Build an Enterprise Newsletter in Minutes

Webinar

Content is at the core of your customer experiences, so it’s absolutely essential to get it right. But to really drive value, how you manage content matters just as much as what you create.

In this webinar, WordPress VIP and Gold agency partner rtCamp will show you how the Mortgage Bankers Association slashed the time it takes to produce their monthly newsletter from several hours, down to 10 minutes.

You will:

  • Learn how the WordPress block editor can speed your time to market
  • Get fresh ideas for building replicable, scalable workflows
  • Study real-life examples of Gutenberg use cases
  • Participate in a live Q&A with rtCamp’s Guten-experts

Transcript

Tess Needham (00:00):

Hi, everybody. Thank you so much for attending WordPress VIP’s webinar, Build an Enterprise Newsletter in Minutes. Hi, I’m Tess here at WordPress VIP. We’ve seen how important email newsletters are for our enterprise clients to reach their customers. But there’s so many newsletter creation tools out there and they catered to a wide range of use cases.

I’m sure that many of you have seen several versions of newsletter tools. So, that means that building them can be slow and it can take valuable time away from your teams. So, when we saw this newsletter solution that our featured partner rtCamp built within WordPress for our client Mortgage Bankers Association. We were blown away. I’ve never seen anything like it before in WordPress.

So, we invited Mervin Hernandez, director of Client Solutions at rtCamp to share the project in this webinar. So, thank you so much for joining to hear everything that Mervin has to say about this really cool project. We’ll have plenty of time for questions after Mervin’s presentation.

So, if questions come to you, you can use the Q&A box here in Zoom, and you can pop your questions in there, even if they just come up to you while he’s presenting, and then we’ll have time for Q&A at the end. And you’ll also have time to add more questions at the end. Imran from rtCamp is also here to help with anything that’s more technical. So, Mervin, thank you so much for your time today. I’ll let you take it from here.

Mervin Hernandez (01:25):

All right. Thanks, Tess. And welcome again, everybody. We appreciate you joining us. So, I’m Mervin. I’m with rtCamp. We’re proud to be one of WordPress VIP gold partners since 2016 and big fans of WordPress for a long time. So, briefly tell you about us.

We just celebrated our 11th year anniversary here at rtCamp, and we got our start in the publishing business. So, we really understand how good content needs to be paired with strong platforms to reach all of the potential that it can. We’ve worked with Fortune500 companies like Google, Facebook, Penske Media Corporation, Al-Jazeera, all to build solutions that make content the hero, making it easy to create, distribute, and monetize online.

Now, we use our deep knowledge of WordPress and the web in many different ways from consulting, working on legacy migrations of systems, design, marketing, all the way through to advanced development team training and managed support services for enterprises and even WordPress products. So, part of our ethos is really working closely as a partner with all of our clients during every engagement, so that we can best match business requirements to the technology solutions that are going to meet those needs. This was part of how we identified the challenge that MBA was facing, not just a migration of a website, but also a business solution.

So, let’s dive right in. So, to tell you briefly about MBA, the Mortgage Bankers Association, this is a network of more than 2, 000 financial entities and service organizations as well as professionals. So, members are employees of these agencies inside of the MBA network, as well as individuals, professionals that subscribe to their publications.

Now, MBA engaged us for a full scope project. This included a look at their legacy system all the way through design, business workflows, creations for publications, and we successfully delivered the great new website solution on WordPress VIP. And this included our focal point of the newsletter tool that we’re going to talk about today.

Now, our stakeholders for this project, as you can imagine, these were the publishing leadership at MBA, as well as the editorial staff. So, everyone was closely involved all through the process. The three main publications that they manage on the site is MBA NewsLink, which is delivered every weekday. And this covers the most relevant national news from MBA journalists, MBA commercial, Multi-Family NewsLink. Now, this is a weekly publication and this has the news and analyses that real estate finance professionals need to be aware of.

And MBA Servicing Weekly. Now, this is featuring top mortgage service industry-related content. So, very specialized pieces of information here. Now, we just set the stage for you really quickly. We told you who MBA is, what they’re about.

And now, we know that they are a very large population of readers and they have a huge collection of industry content curated by their editorial team. Now, the main way that readers consume all of this content is of course on their website and the project delivered mba.org on a new, more responsive design and website solution that you see today.

Now, in our discussions about their legacy system, we found out that the workflows to create a newsletter from recently published content, this required a significant amount of time for the team to push. Now, speaking from a business perspective, for a moment, a website is a tool to accomplish many communications goals. Now, visitors come to you for some sort of information, insight, data, and it’s our job to help you deliver that insight successfully, curated quickly and of course, enable business success online in however, whatever form that takes around the content.

Now, as was the case for the MBA project and many others that we touch. It can become costly to maintain legacy systems and enhance them as time goes on and not just in dollars and cents, but also in efficiency and at the time it takes to make changes in those systems. So, staying in the business mindset for another moment, editorial teams focusing on their goals, they really dedicate themselves to sourcing, authoring and curating really quality content for their audience.

Now, in a fast-paced publishing environment, like the MBA’s weekday newslink schedule the workflows to bring that content from publishing into a newsletter. This can have real business impact and the time to push those publications, it really depends on how good the tools are. So, the process in MBA’s past newsletter system, this required a lot of manual input of information on every single piece that needed to be included in each newsletter.

Now, this followed a parallel workflow along with articles that were being written. It almost needed to be a duplicate of, okay, an article is being written and published and alongside that also populating it into a newsletter workflow. Now, here on the right side, I’m showing you a screenshot of what the newsletter product looked like in the legacy system.

A few other considerations now in terms of design, this old system was incredibly script, strict in layout capabilities. So, ads could not be moved around, which had some revenue implications on how much MBA could charge for certain placements. There were designing consistencies, and these can distract from a brand identity just in general. The newsletter template also did not render well across devices. So, in the modern-day era of responsive design and any device, any screen, this was really important.

Now, here are a few screenshots of what the newsletter creation system looked like before. Now, the screens to populate these pieces of data are so far removed from what the readers will ultimately see in the end. What we’re looking at here is just entry fields and structured headings of sections for the newsletter. Each and every item, title text, URL link, image had to be populated by hand and as you can see, this is a completely different view and experience from what the readers are going to see. So now, let’s say we wanted to optimize this or create a similar workflow in a couple of the most popular newsletter creation tools like Constant Contact and MailChimp.

So, we took a shot at that. So, we followed a workflow of 14 articles, URL links, excerpts, and images that we wanted to populate into a template already built into Constant Contact in this case. Now, it took us roughly an hour to populate all of the newsletter content and this was in an existing template. And as you can see from this sample of my time-lapse it was still a manual process, even when I gathered all of the different pieces in a single file and just brought them over copying and pasting. It was nearly an identical workflow for MailChimp.

So, because it follows the same pattern, you can create a template, populated, but you still have to compile all of the information and make sure that it’s all formatted properly. You still have a lot of burden on the editorial team, and it’s not exactly fast. So, to summarize, the process of creating a newsletter, anywhere outside of where the articles are being published, it’s going to inevitably require that content be pushed or pulled in some form or way. So, either through a technical integration or manually.

This will of course add technical complexity to a solution and time to publish, if not, both as was the case for MBA. So, a labor or time-intensive process of compiling all of this, it will have business implications. Now, MBA and editorial teams, they need a solution that really accelerates their creative process, adds value, delivers results and it’s seamlessly out of the way. So, from our discovery phase with the MBA team, we took a really careful look at the business impact of the solution that we were about to touch. Now, we took the opportunity to deliver more than a migration and a new website, and we actually enabled MBA and the newsletter team to work with a system that enabled them to create newsletters and publish them very quickly and very easily.

Now, this project also had other areas that were of high importance, like legacy SEO and URL structures. So, we wanted to make sure those remained in place from past published articles. And of course, the human element is ever present. We ensured that the delivery part of this initiative, that we spent time with the owner users of these solutions.

We provided documentation, one-on-one team trainings for MBA’s publishing team to get up to speed and get going with the new solution very quickly. But let me show you what, in the newsletter creation tool specifically, we focused on. So, taking a step to WordPress in general, WordPress already has a great experience for editing and writing and the Gutenberg editor. Now, we integrated features already available by creating a custom newsletter block that feels organic and familiar to the way that articles are already being written.

Now, the goals for this, as you can see, there were a few really high priority items, something that would really integrate with the website and the publishing way for writers and editors in the newsletter creation process. Now, the newsletter block allows for both standardized aspects of a newsletter to be defined as well as moveable and stylized options to be dynamic. Now, the content for every newsletter is selected on demand and it’s populated into the respective blocks. The content sections also allow for users to filter and style different elements as they see fit.

And these are all defined by editorial leadership. So, also very important was that the templates be more engaging and include responsive features. So, it could be viewed and facilitate rendering on any device. To touch on the technical side of the WordPress implementation. These are some of the things that helped us streamline this whole process from a technical perspective. So, we wanted the solution to make it very quick and easy to spin up a new newsletter.

It also needed to refer to content and metadata from articles that were already published easily. The tool should also be flexible enough to allow for style changes. So, thumbnail images could be placed on left or right, links and additional text would render properly. Preview capabilities were also really important. So, we wanted to make sure the writers and the creators of these newsletters were not so far away from the editing view to what the readers would see in the end.

And we’re going to show you how nearly identical the screens looked in just a moment. Now, the solution must also facilitate distribution. And in the case of MBA, the newsletter module creates a single file that is populated into their distribution platform very easily. And a quick side note on this. So, WordPress itself can of course handle distributing emails to thousands or hundreds of thousands of emails recipients, but tools like SendGrid, ActiveCampaign, Higher Logic like MBA was using.

These can add value in features like metrics, segmentation, membership management, and MBA was already leveraging these for their newsletters. So, our solution plugs very easily and seamlessly into their process to distribute it. We add the value by creating it easily and quickly in WordPress. So, we made it an imperative to give every one of our clients, not just a good experience with rtCamp, but also with WordPress. So, this is why in order to put all of this into service, we worked hand in hand with the MBA team to make sure that they were comfortable and they were familiar with every piece of feature that we built for them.

So, we held sessions where the team got to experiment and practice alongside us, these new processes. And we made it very quick and easy for them to pick up everything right away and get to creating newsletters on their own. So, looking at where we started, we took them from a screen of input fields to now we brought MBA to a modern and studying workflow where they create a newsletter at the speed of thought. It’s a much, much more realistic experience to what the readers are going to see in the end. And let me show you exactly how these blocks work.

So, to spin up a new newsletter, the editors can add their very own newsletter block to a blank newslink. This automatically brings in the standard newsletter template layout. It populates a few of the most recent posts, the default ad locations, and it fills in the newsletter footer by default. As you can see, this is all stylized in the MBA colors, type faces and heading section. So, nothing has to be done manually in that regard.

So, here, you can populate the metadata for this publication. So, issue number, volume, date, these all keep inconsistency with their brand identity. And this is really important as you add more publications, they all look and feel the same. Next to bring in multiple articles into this little news roll block editors and writers, they can select a category of articles that were recently published. And just by checking the boxes, they’re going to be populated automatically into the respective area of the newsletter, where they want to include those links.

A lot easier than copying and pasting, right? So, ads are also a really important part of publishing. So, here, we have the ability to refer to campaigns that are active and populated elsewhere by the advertising team. These are populated automatically. Now, another important part of the newsletter for MBA was the ability to move these ads around and to have a flexible layout. This was a major limitation for the previous system.

And here you can see how easily we move this from the top to the bottom of the newsletter, and they can do that quite easily on the fly. So, we’ve helped enhance all aspects of this newsletter creation process and keeping style, consistency is also big part of that. Whenever new additions are made to body copy, links are added to the footer. These all observe the same type faces and colors set by the MBA team. Now, this was done by expanding one of WordPress in Gutenberg blocks that kept the capability to style rich text elements, such as links and you see here.

So, the newsletter editors can see here in Gutenberg, nearly identical views of what the readers are going to get in the end. This all lives elegantly and alongside the published articles in WordPress. So, they’re already familiar with an experience that is very similar to what the end experience is going to be. So, each newsletter is archived and it’s available for viewing on the website itself. It renders responsibly on any device.

So, here, we’re looking at the website archive page, and this is what it looks like in an email, and it looks great. So now, that we’ve shown you what the newsletter creation modules look like and how they function. Let’s show you a few other examples of how the experience in WordPress can also deliver business value in a lot of other applications. So, WordPress is incredibly capable of handling not only large amounts of content comfortably in many different applications, but it’s also available to manage workflows and business solutions in a number of contexts. MBA and associations networks that publish newsletters.

It’s a mission-critical part of their operations and WordPress shines in all of these areas. Now, WP can help personalize content and engage better with your readers. Frequently, you can manage large populations of subscribers or customers to target. You can monetize readership and distribute newsletters to an unlimited number of recipients and track conversions and get metrics.

Now, these are just a few examples of the types of communications goals and business processes that we’ve built solutions around. And I’m going to have my colleague, Imron just gives you a couple more examples of the practical ways that WordPress has just allowed businesses and creative professionals to leverage blocks and good design and business solutions. So, Imron?

Imran Sayed (21:21):

Yep. Thank you, Mervin. Hello everyone. I’m going to talk about how WordPress can provide you with unified editing experience. So, for event pages, blog post, and more. Let me show you how we build the homepage for American Eagle with Gutenberg.

So, as you can see, you can go ahead and insert a particular blog over here, and you can insert different postcards. You can select the post of your choice. You can search for the post and it populates its feature image, title, and category. You can also increase the width of it, and you can add as many posts as you want over here. So, this basically gives you more control over what you want to show in this particular blog.

So now, if you take a look at the text, the text is also editable, come in be you and this text is editable as well. And if you preview it, this is how it looks in the front end. So, this entire homepage, except the header is built with Gutenberg. So, bringing your content closer to your distribution, allows your team to use a single, powerful, and flexible workflow to create different types of content. In this case with American Eagle, it’s a landing page, but it could just as easily be a blog post or a newsletter.

The block-based WordPress Gutenberg editor gives you editor flexibility to experiment with different layouts without compromising on your brand identity, already built into each of these blocks similar to what we did for MBA. We made ad sections that auto-populate with targeted ads for Grazia and blocks make it possible to seamlessly include elements like forms, signup fields, videos, and social fields elegantly within the body content. So, the bottom line is that a fully integrated and experience within WordPress can enable your content team to do what they do best without the tools or workflow getting in their way. I will now let Mervin wrap up and I’ll be back to answer your questions in a few seconds.

Mervin Hernandez (23:49):

All right. Thanks, Imran. That was great. And that about covers it for us. And thank you everyone again for joining us for this quick session. Now, we took a business approach to the way that we wanted to feature the project today. But we welcome your questions and we welcome the opportunity to serve you and your teams solving business challenges using WordPress.

We’re really proud to work and live in this rich digital experience platform that engages businesses and customers all over the web. My favorite question to answer is can WordPress do blank? So, connect with us. You’re welcome to ask us some questions. We actually have some plenty of time to cover some of the technical aspects that we went over briefly here.

But with that, I know Imran has been looking at some of the questions that might have come in. Yeah. We appreciate you joining us and learning about what WordPress can do here and in many other applications.

Imran Sayed (25:01):

Thank you, Mervin. So, I think we already have some of the questions right here. Great. First question is, what is metadata? So, I think Casper, has already answered that.

So, metadata is basically data about data and in this case, it’s the metadata of the post like category stacks published date. The next question is, how are you sending? That’s a good question. So, in case-

Mervin Hernandez (25:28):

So, sending in the case of MBA, they’re using a system called higher logic. And as I mentioned, it’s a marketing tool that distributes the emails that they’re creating here in WordPress. And what they can do in that tool as others, like ActiveCampaign and the like, you can create different marketing and automation workflows, you can get different types of metrics.

I mentioned, we can accomplish all of those things in WordPress, but in the case of MBA, they were already leveraging that tool to do their management of memberships and segmentation. So, they create the newsletters in WordPress and very easily populate a single instance of the publication into their system and distribute it that way.

Imran Sayed (26:22):

Right. Now, the next question is that, is this tool going to be available throughout publicly as a plugin?

Mervin Hernandez (26:32):

So, we are working with a couple of clients who are interested in this tool right now, and we actually build it quite specialized for MBA. We want to give them a shout out for allowing us to feature them as the project as well. We are able to adapt it. And the template that you saw us populating the content and bringing content into that is something that we can customize for other applications. So, we are able to customize it and deliver it in other WordPress instances.

Imran Sayed (27:06):

Right. So, the next question we have is that, how can this be leveraged for internal communication? From Ashley.

Mervin Hernandez (27:15):

Absolutely. So, just the same way that this template was for the MBA NewsLink. If you have certain pieces of content that you’re managing for an internal team, let’s say short announcements, maybe internal tweets, for example. So, you manage short internal tweets in WordPress in a custom post type. Then, this template can be customized to include, okay, these were the last few company announcements that you should be aware of. And here’s the link to the full articles or what have you.

So, you can distribute this inside of a company, inside of a segmented email list, even from within WordPress. So, just the same way that you can have a public-facing website or an intranet. So, to the newsletter, however you distribute it, you can use it for an internal team.

Imran Sayed (28:11):

Right. Perfect. The next question we have from Michelle, she is asking is the newsletter function built-in or proprietary?

Mervin Hernandez (28:22):

In between. So, the solution that we built. This is a specialized solution that we delivered. And so, the block elements and the template that it renders, it is a customized solution that is delivered. However, some of the block elements that we used. So, the styling and text and images and alignment, some of those blocks are available on WordPress and Gutenberg natively.

And there’s many, many block builder plugins that are also adding many of the same features. So, I know Atomic Blocks is very popular. We have a couple other suggestions of similar functionality, Imran?

Imran Sayed (29:10):

Yep. So, would you like to show that?

Mervin Hernandez (29:16):

Sure. What do you got?

Imran Sayed (29:18):

So, we can look at the American Eagle pillar page that we built. So, we build these blocks, using combination of the cover blocks as well as custom blocks. So, as you can see, we are in the Gutenberg editor. We put a group block over here and then we put a cover block. Now, the best part is that we have extended the cover blocks by adding styles to them using style variation.

This is a normal heading block, but on the right-hand side, if you see, we have added another variation to it. So, we are keeping the cover blocks as it is, but we are also extending them so that you can have another variation to it. We have given options to make the background fixed. And then, we have also created another block wherein you can add this block for showing the post. So, this is the group block.

And then, inside of it, this is the recent block post, which is a custom block. And here you can change the title of it, you can edit the title, the viewing link, you can toggle between the category of the post, as well as you can decide how many posts that you want… number of columns that you want. So, as you can see that you can also select if you want a particular post to populate at the start, at the beginning of all of these posts. So, you can add those posts there.

Then, you also have some other selection criterias like you only can decide how many stories, how many posts you want to show. You can select between categories. You can add tags. So now, the posts that are related to this particular, these many tags will be showing. And then, you can also filter them by authors.

Mervin Hernandez (31:07):

And something I forgot to mention in the presentation is the MBA team. They set not just the design standard, but also what aspects of the newsletter writers should be able to tweak and which ones they want to be consistent across their publications. And similarly, here for AE, they defined, oh, yes, we want to be able to pull in from various categories and we want it to still render the same way, no matter what kind of content it is. These are the panels that we’d like to display. So, all of those parameters, depending on the solution and depending on the team, what things you want to be movable, what things you don’t want to be movable.

All of these blogs are customizable. And that’s the solutions that we create, which are very specialized and tailored to your team and your workflows. But there are features that are already available in commercial blocks. And we’ve shown you a couple of the ways that companies want to have their workflows facilitated and seamlessly quickly delivered for publications and pages.

Imran Sayed (32:23):

Absolutely. Thank you, Mervin. The next question we have, what did you do to ensure the newsletter created in Gutenberg, also it looks good across all email clients? So, I’ll take this one, Mervin.

Mervin Hernandez (32:34):

You got it.

Imran Sayed (32:36):

Yep. So, to ensure compatibility, we tested the email content with Litmus too, and we tested them on most used email clients to ensure that they’re working. We also have written some media queries. So, Mervin, would you like to show the page where we have written the markup? Yes. So, in the head section, we have also written the media query. So, to ensure that this works seamlessly on across all devices.

Mervin Hernandez (33:08):

Okay. And this is included in the standard template for their newsletter publications and this is what ensures that it renders properly across all of their devices.

Imran Sayed (33:20):

Right. The next question we have, how did you achieve the floating text of the American Eagle website? Is that available on WordPress natively? So, the floating text-

Mervin Hernandez (33:33):

Thank you.

Imran Sayed (33:34):

… I believe. Okay. So, that is something that we have a given as customized one that is not available by default. So, that’s something that we’ve created custom. Okay. So, next one what we got is, is the newsletter function… okay. I think we’ve already done with that.

Okay. Can you explain where newsletter data lives, sends, opens CTRs, et cetera. We have coordination issues with internal databases. For example, we use Luminate and Raiser’s Edge, and there’s concern about switching email platforms, which may require that we export data from one platform and import it into other.

So, to answer this one, I think the data that we have lives in WordPress itself, that’s the best part that because all of the posts and this news are already there in the WordPress. So, our data is already available in WordPress itself. Mervin, would you like to add that?

Mervin Hernandez (34:34):

Yeah. I think there was two parts to that question. So, the data for the content of the newsletter, the articles, images, all of that lives inside of WordPress. Now, MBA, they do their… it sounds like that data was related to metrics and analytics, that data for MBA, it lives in higher logic and that’s the tool that they’re using to manage their subscriptions and do the distribution part of it. So, they create the newsletters right next to where all of the articles are published. So, all of that data is right here in WordPress and then the readership, the clicks, open rates, all of that lives in their email and membership management solution higher logic.

Now, just to follow up on that, you’re having challenges with integrating those pieces of information. Now, if you want to consolidate all of that into a single instance. So, that is certainly doable depending on what you want the result to be. So, if you want to see how many people are coming to your site, based on reading then UTMs and tracking analytics can be included in the template in WordPress. So, we can incorporate things that will bring you more insight as to where they’re coming to your website from because you distributed the newsletter on another system, for example.

So, those are ways that a solution provider can look at the whole picture. You’re creating content here, creating newsletters, sending them elsewhere. We can look at what the end result is supposed to be, what your marketing team needs in order to assess what’s working, what’s not working. And we can incorporate that into the different parts that work together.

Imran Sayed (36:28):

Yep. Great. Okay. The next one we have is, is it possible design the newsletter inside of WordPress and then send it through MailChimp or Constant Contact or do you have to contract with another email resource?

Mervin Hernandez (36:49):

Not at all. So, yes, it is possible to bring this into another distribution platform. There’s a few ways that can happen. In the case of MBA, it’s a single instance of the newsletter publication. So, once it’s finished, saved, it’s turned into an archive page and it’s turned into a single HTML file that they put into their email distribution system.

I understand that MailChimp and Constant Contact, they do have the ability to bring in either a template or a single HTML file similarly. And the answer would be, yes, that you can couple MailChimp, Constant Contact, ActiveCampaign, what have you with something that WordPress is able to produce and create in a flat file, so to speak.

Imran Sayed (37:43):

Okay, great. Next one we have is, how to integrate or how integration the content on WordPress with email system? Do you send the content while REST API or with RSS feed?

Mervin Hernandez (37:58):

All of those are WordPress is capable of doing that. But as I mentioned in Constant Contact and MailChimp, for example, their RSS poll feature is very limited. They will only pull one or two articles at a time to let you select from one or two most recent articles. They’ll only pull an image, a title, excerpt, and a link. Now, that’s fine, if you want to publish just one or two of your most recent items, but when you’re compiling lists like this of 14, 15 articles, when you have advertising campaigns that you need to track and refer to, those get more complicated.

And that’s where the limitations come in of those popular solutions. So, yes, they can do that in a very limited way. However, it would require something more advanced. Some, I wouldn’t even know off the top of my head, like REST APIs into MailChimp. It would require some complexity.

Imran Sayed (39:07):

Right. Okay. Thank you, Mervin. How’s the email distributed? What do you use? I think there’s Katrina now wants to add to it that I second this question. I use WordPress, but still heavily rely on MailChimp as well.

Mervin Hernandez (39:22):

Yeah. We can explore those options within a team and a client. I know that you can import a single HTML file. So, perhaps if you create a special type of an archive on WordPress, you may be able to pull it into an HTML block in MailChimp. However, you have to look at a few other considerations. Like I mentioned UTMs and tracking links back to your main WordPress site.

You have to make sure that the assets are flattened and that when you import that into MailChimp, it’s not breaking any links or that has not been rendered improperly. So, it’s going to require a bit of finesse to look at all of the different pieces that are coming over from WordPress and being populated into a different system. And that’s something we took very, very good care of because we knew that MBA had to distribute this outside of WordPress through higher logic.

So, we made sure that the styling, that style sheet, it is flattened. It’s included with the HTML file. They’re putting into the email platform that all of the assets and images and references, all of those were appropriate to take outside of WordPress or handle distribution outside of WordPress. There’s a few important things that are different.

Imran Sayed (41:00):

Right. The next one we have after a newsletter has been populated and the editor press is done. What is the technical process to get the HTML CSS to the mail system? And the second one is that, is it require a manual copy paste or automated? Yeah. We can show that slide.

Did you run into technical issues such as email being truncated due to the length of the code? So, as you can see over here and believe this is the newsletter markup. So, when you press the done, you can also preview it. So, we created a custom preview button for this, and then you have an option, you have a tab that allows you to see the visuals of it, how it’s going to look like.

And then, you also have another tab, which is the markup. So, this is the markup that gets generated, that we are generating after the entire newsletter is built in WordPress, in the Gutenberg editor itself. And we just do a copy, paste of this mockup and then send it through higher logic.

Mervin Hernandez (41:58):

Yep. And this is the single instance of every newsletter. Everything has been compiled and rendered and flattened in a very compliant way inside of WordPress. This is the only thing they need to populate into the higher logic or whatever other platform you use, ActiveCampaigns, SendGrid, all of those, add the bells and whistles of metrics and tracking and membership management, what have you. So, this is the one instance that they’re bringing into their distribution platform.

Imran Sayed (42:31):

Right. And the last part of this question was, did you run into any technical issues? We haven’t received any such information from the client that they’ve run into any technical issues regarding the length of the code. It’s just normal HTML in a tabular format, the way the email clients would like.

Mervin Hernandez (42:47):

Yep. And you were telling me Imran that there was… that you had to put it in a table instead of using divs, which is kind of the typical styling method for front end.

Imran Sayed (42:58):

That’s correct. That is correct. So, by default, WordPress offers you in this div elements are uses H one P tag, not in tabular format, but since the email clients require the HTML format to be in table elements. So, when we created these custom blocks, we ensure that the mockup that we use is in tabular format.

And that’s what we are generating custom over here. So, all of this is tabular format, and it also requires us to put an inline style. So, as you can see that we are using the inline style in these table elements.

Mervin Hernandez (43:36):

This is where the real tailoring part comes in. So, because we knew higher logic had these requirements. Similarly, we can put such things in place to integrate with Constant Contact, MailChimp. However, those platforms want to receive the formatting in a technical way. The creation process can look very similar in Gutenberg blocks, drag and drop elements, good styling.

However, the end result that markup that you bring into your distribution platform that can be adjusted and customized to be whatever that platform needs it to be.

Imran Sayed (44:18):

Right. Okay. Another one we have, I can see from your markup, you’re using HTML tables. How are you converting the standard core blocks to use HTML tables-

Mervin Hernandez (44:31):

That’s for you.

Imran Sayed (44:33):

Yeah. I’ll go ahead with that. So, in Gutenberg, when we are creating custom blocks, whatever content we use in the save method, that is what is being used and goes into the database. So, in the editor, it can have whatever market wants, but when you actually going ahead and previewing it or generating a custom preview page for this, we go ahead and ensure that we grab the table elements and go ahead and show that over here. So, we are going ahead and retrieving the content of the block, what goes in the same method.

And we are going ahead and populating it over here. So, that’s been done custom. Okay. Next one we have is, how can I create my custom theme? So, I believe you’re asking, it’s a general question. I believe it’s not related to Gutenberg, but if you are asking in general, how can I create custom theme?

So, on the WordPress org, we have got all of the documentation available, how we can create the custom theme development. We also have different tutorials available for generating custom themes. So, you can definitely take reference of that and you’ll be able to create the custom theme for you. Is MBN using a plugin or a custom post type? So, the MBN newslinks that we have, these are the custom post types.

Okay. Next one we have, can you create charts and tables within WordPress? Yes, of course, you can. In fact, Gutenberg has opened us new possibilities for us, endless possibilities for us that we can do so many things with the blocks. So, if you go to Gutenberg libraries, there are different blocks available that you can check out wherein you can insert the charts, tables, et cetera, within Gutenberg blocks itself. Okay.

Next one we have is, do you offer these wonderful email marketing strategies and services for non-WordPress site clients? Or is the whole point to support WordPress customer sites encourage further WordPress adoption usage, including leveraging this email strategy, et cetera?

Mervin Hernandez (46:52):

So, we focus very squarely on WordPress. We have worked with clients that have been outside of the platform for their publishing workflows and systems and this, in some ways it can stand alone. So, if you like the way that it’s creating newsletters and managing content in a WordPress way, it can’t integrate into other systems, into larger systems.

Someone earlier mentioned the REST API, that is one method where we can refer to another system and bring articles and bring metadata. We can bring in asset references into a WordPress way. And then, you can create using the Gutenberg editor experience if that’s the part that you like. So, yes. We’ve done solutions like that in a number of capacities. And so, it is possible to use WordPress in a part of your workflow that involves other systems.

Imran Sayed (48:01):

Right. Perfect. Okay. I think the last one we have, is there a way to have two separate categories under one domain, such as this domain/technical writing and then this domain/another one. Right. So, can you please elaborate on this question? Actually, what do you mean with this, [inaudible 00:48:23]?

Mervin Hernandez (48:23):

So, we can support both. And I don’t know if it’s a multi-site question, but WordPress allows for categories and certain taxonomy organization structures of content, which would allow for that. Or if they’re two very big and different pools of information, then a multi-site would also allow you to have different forward slashes and then organize information in two different, but related WordPress instances, that’s called multisite. Go ahead, Imran.

Imran Sayed (49:01):

Yep. That’s fine then. Okay. We don’t have any more questions.

Mervin Hernandez (49:07):

All right. Those are some good questions.

Imran Sayed (49:09):

Thank you. Thank you.

Mervin Hernandez (49:10):

And we covered a lot of ground and that’s great. Well, we want to be mindful of time. We thank everyone again for your attention. We are here to serve as resources and even solution providers. So, if you have questions about WordPress, it’s capabilities or some creative ways that you’d like to leverage WordPress tools, we’re happy to chat with you and brainstorm.

This is what we love to do all day long. So, even just for fun, we’re tinkering and doing things like this. So, it’s been a pleasure. And thank you VIP for hosting us. Thank you, MBA, for allowing us to use the great solution as an example. And we hope you guys get in touch with us. We’d love to connect.

Tess Needham (50:01):

Thank you so much-

Imran Sayed (50:01):

Thank you everyone.

Tess Needham (50:03):

… Mervin. Thank you, Mervin. Thank you, Imran, so much for presenting.

Imran Sayed (50:05):

Thank you.

Tess Needham (50:06):

And thank you everybody for joining WordPress VIP for the webinar. At WordPress VIP, we help some of the world’s top brands, power their customer experiences through leveraging the open web. And please get in touch if you have any questions or topics that you’d like to see covered next time, really appreciate your time today. So, have a great one. Thanks, everyone. Bye.

Contact us

Fill out the form to request a demo.