How to Win with WordPress 5.0 Gutenberg Compatibility with your WordPress Learning Management System LifterLMS
Manage episode 221488821 series 2284198
How to win with WordPress 5.0 Gutenberg compatibility with your WordPress learning management system LifterLMS in this episode of the LMScast podcast with LifterLMS founders Chris Badgett and Thomas Levy. Chris and Thomas dive into what you need to know as a course creator about the new page builder for WordPress.
Gutenberg has been out for a while as a feature plugin, so you may have seen it pop up on your site. If you are interested in trying out the plugin, you can head over to WordPress.org/Gutenberg and download it for free.
For those unfamiliar with it, Gutenberg is a page building plugin that allows you to switch between the classic WordPress editor and the Gutenberg editor. What we currently have in WordPress as the default editor is a W-Y-S-I-W-Y-G editor meaning ‘what you see is what you get’. It is very similar to the editors you find in Microsoft Word and Google Docs.
If you have ever used a page builder like Elementor, Beaver Builder, or the Divi builder, then the Gutenberg update should not be too much of an issue for you. You can still use the page builder you currently use instead of the Gutenberg one.
Gutenberg uses what are called ‘blocks’ to build pages. If you are familiar with other page building plugins, they are the equivalent of ‘modules.’ For many people, the page building setup is easier to use as it tends to be more intuitive. You can drag and drop in elements such as images, videos, quotes, lists, text boxes, headings, and many more.
At LifterLMS we are very excited for the release of the Gutenberg builder and how that will make building visually complex sites more accessible for more people. Be sure to head over to WordPress.org/Gutenberg and check out the live demo they have where you can play around with some of the settings on the front end.
You can also try out Gutenberg with LifterLMS if you head to poopy.life where you can create a free WordPress installation in 30 seconds and install Gutenberg and LifterLMS. From there you can test it out. After you’re done testing out the new page builder for WordPress, head over to LifterLMS.com to find out more about how you can use LifterLMS to build your own online courses and membership sites. If you like this episode of LMScast, you can browse more episodes here. Subscribe to our newsletter for updates, developments, and future episodes of LMScast. Thank you for joining us!
Chris Badgett: You’ve come to the right place if you’re a course creator looking to build more impact, income and freedom. LMScast is the number one podcast for course creators just like you. I’m your guide. Chris Badgett. I’m the co-founder of the most powerful tool for building, selling, and protecting engaging online course called LifterLMS. Enjoy the show.
Hello, and welcome back to another episode of LMScast. I’m joined today with a special guest, LifterLMS co-founder Thomas Levy. Thomas, welcome back on the show.
Thomas Levy: Thank you, Chris.
Chris Badgett: Today we’re going to be talking about Gutenberg and your WordPress LMS. Here at LifterLMS we’re leading the charge with Gutenberg and helping in the transition. And part of that is just educating what Gutenberg means, which is WordPress 5.0.
Thomas Levy: Yeah, I mean, it will be in 5.0, but that’s I guess the main feature. There’s some other stuff going on in there, but yeah, that’ll be public.
Chris Badgett: Yeah, that’s rolling out soon. It’s estimated to roll out on, I believe, November 19.
Thomas Levy: 19.
Chris Badgett: But they may delay it, we don’t know, but we’ve been getting ready for it, but first we wanna do some education around what it is and what it means for Lifter and Thomas has had Gutenberg up for a while. He’s been working with it to develop blocks with Lifter. Let’s just start by explaining the terminology of what are the pieces that make it. What is Gutenberg, and what are the components that it creates?
Thomas Levy: Sure. So Gutenberg has been out for a while now as a feature plugin. So, anybody who wants right now today, you go to WordPress.org, grab the Gutenberg plugin, install it on your site. You have the option to, when you’re creating new posts and pages to flip between the classic editor, which is what you see now and Gutenberg, the Gutenberg editor. So, essentially it’s just a re-envisioning of the post page content creation tools inside WordPress. What we have today is just something very similar to what you might find in Microsoft Word. It’s a Wysiwig editor. It’s what yo see is what you get. W-Y-S-I-W-Y-G.
Chris Badgett: It’s been the same for 10 years, right? More or less.
Thomas Levy: Yeah, I mean I don’t know if it’s 10 years, yeah I mean I guess probably 10 years, 10-ish years. I started using WordPress in 2007, 2008 and yeah, there’s a Wysiwig editor in there. So, I mean I think there’s been modifications. We’ve seen some changes to the overall interface, but yeah, I think the feature set has been the basic thing since I guess probably about 10 years, maybe I guess more than that probably. At the time I mean it was a huge innovation over writing HTML essentially. But I think what we’ve learned, what we’ve seen page builders innovate on is that the Wysiwig editor is a giant abstraction from your website. And by that I mean you can see the text is bold, underlined, italics, larger with headlines, smaller with body content.
Chris Badgett: But what you see is not exactly what you get.
Thomas Levy: Exactly, yeah. So, yeah, exactly. So, I mean if you look it like say the 2010 theme and you use the Wysiwig editor, what you see is pretty much what you get. But then theme development has come a long way in the past 10 years and what you see is not exactly what you get, because you need to do this mental translation of what you see on the editor versus how styles of your theme are going to be applied to it, layout and things like side bars. If you’re using short codes, you’re staring at this little tiny block of weird HTML like stuff, but then that actually generates something completely different on the front end. So, what you see is not what you get exactly. And I think Gutenberg is a step towards throwing away the idea of what you see is what you get. There’s a huge push towards structured data.
Chris Badgett: What does that mean?
Thomas Levy: Yeah, it’s complicated. A really easy example of structured data is, like one of the early Gutenberg examples was a recipe card. So, imagine you have like a cooking blog. And again, this is a simple site example, but imagine you have a cooking blog, you can have every one of your blog posts is probably gonna be a recipe. Maybe not everyone, but you’re gonna have recipe blog posts obviously. So, a recipe card might look like, the data in that recipe card is like a title and then a couple sections. So, you’ll have like an ingredients list, a set of preparation steps and then a set of cooking steps. So, you’ve got like three headlines there. And then below each of those headlines you’ll have your actual list of ingredients which will be like a bulleted list probably. And then your preparation steps will be like a one, two, three, four, five. Like a numbered list of the different steps you need to take. And then your cooking instructions are gonna be another numbered list.
Thomas Levy: And then maybe you’ll have some pictures or something. Like the picture of the finished recipe. So, if you go to, I think it’s called Gutenberg examples. It’s a plugin, like the WordPress Automatic created to help show examples of what you can do with Gutenberg. There’s a recipe card block. So, you drag that over into your editor and it pre-fills those headlines for you and your structured data is ready. So, that’s the format of your data. And you get to enter whatever you want. But it helps you organize your data in a structured manner, which is the way we think as developers. We’re always thinking in structured data like that. But helps make it really simple for the end user who’s not worried about that data architecture or mapping or anything like that, can just kinda that really quick, clearly and intuitively without having to work through and build their own concept of what their things are. Does that make sense?
Chris Badgett: Yeah.
Thomas Levy: Yeah. So, anyways. You asked me to explain the terminology and I just talked for like 10 minutes about nothing.
Chris Badgett: Structured data is terminology. But what about blocks and templates and all that?
Thomas Levy: Right, right, so, Gutenberg’s core is made up of this system of blocks. And it’s a new word, but anybody who’s been using WordPress for a long time will see blocks as a more visual version of say a short code or a widget. If you’ve been using page builders for example Beaver Builder and Elementor, they call them modules. But they’re essentially widgets. They’re just this little blocks of content. And like I said, so, this recipe card that I just talked about is an example of a block, but you also have blocks, which is a paragraph. Just paragraph text when you’re just writing content. Headlines would be a block, which are like H1 through H6. Various sizes of larger text for your headlines. I’m trying to think of some … oh, so, they also have like imbed blocks. So, if you wanna-
Chris Badgett: [inaudible 00:07:13].
Thomas Levy: Exactly, like a YouTube video, a Vimeo video, a video that you’ve just uploaded to your website natively. It’s like an MP4 or .mov or something like that. So, there’s all kinds of different blocks built into the core and those blocks can be used in various combinations to build out your website. So, again if anybody has been using a page builder, you’re familiar with this concept already, it’s just a different word for it. And then each block will also have settings. The paragraph block has settings for setting a background color on it so you can make like an info call out block or something like that, excuse me, with the regular paragraph. And I think the core paragraph block also has like the … like in newspapers you see that big, I think they call it drop caps where it’s like the first letter of the paragraph is like three lines tall or something like that. So, they got an option for that.
Thomas Levy: So, every block can also have its own set of option depending on what it’s trying to accomplish. So, again, it’s pretty familiar. It should be easy to use or rather it is really easy to use. And think the average who is used to using the Wysiwig editor will see pretty much no difference. It’s a different interface and it looks different, but really what you get is just more power. So, it unlocks some new possibilities.
Chris Badgett: So, what does it mean for LifterLMS?
Thomas Levy: Yeah, so, I’m really excited about this in LifterLMS. I’m really excited, one, maybe to a certain extent, because it will reduce some complexity and support responses, but … this is possibly a long answer, so, you’re ready for it, ’cause I mean there’s a lot of background to understand why this is so powerful. So, with these blocks we also now as developers have the ability to specify templates for various post types. So, a pretty simple example of a template would be in a block post. So, you go to WordPress post, add new. More than likely all you need is a title and a paragraph. So, that’s your template, it’s really simple. It’s just necessary paragraph block that’s like, write your blog post here. So, that template is really simple.
Thomas Levy: But if you think to other, and again, this kinda gets into data modeling and structured data. WordPress has become much more than a blogging platform. So, we’ve got posts and pages in the core, but if you’re listening to this you’re creating courses or thinking about creating courses. And courses have a much larger set of parameters, concerns, pieces of data that you’re thinking about when you’re creating your course. And if we just look at the course page as an object on the website, there’s all sorts of data there. All the metadata that we have in LifterLMS. Like course difficulty, tracks, tags, categories, expected length, instructor name and roll or position.
Chris Badgett: Syllabus.
Thomas Levy: Yeah, the syllabus, which is like the whole outline of the course, which that gets into a very complicated data structure, ’cause then all those things within the syllabus, the sections, the lessons, the quizzes, each one of those have their own titles and sets of metadata and things like that. But if we’re just literally looking at the course, yeah, we have that outline on there, the course syllabus on there. So, there’s all these pieces of data that have their place within the course. And we’ve found is with the tools available to us today, pre Gutenberg and let’s just say up until where we are today. These are really the only tools we still have available until Gutenberg is officially publicly released and stable.
Thomas Levy: We don’t have the ability to make it really, really simple for users to customize the way that, that structured data is output on the front end of their website. So, it’s the easiest thing to do as developers. So, if you think of each one of those pieces as a short code. We do have a short code for each one of those things.
Chris Badgett: Which is like how people with Elementor build a custom template.
Thomas Levy: Right, right, right, yes. So, if you’re using Elementor, Beaver Builder, Offsprout, Divi, whatever, you’ve probably installed LifterLMS together. Like any one of those page builders plus LifterLMS. You’ve probably found out that you wanna use LifterLMS labs action manager to remove all that default content that we have on there. So, if you think of each one of those things as a short code. They’re not exactly short codes, but if you just think of them as a short code. The nest experience for us as developers or as product creators really, it’s not even so much developers, which is just people creating a product that thousands of people use and everybody has a different need, but we’re just trying to figure out what is the generally accepted course layout on the front end.
Thomas Levy: So, we’ve laid all those things out. And we do that with code. So, we’ve creates this template with code, but there’s all different layers of customization. If you’re a developer and you’re familiar with actions and filters, you know that you can just go in there and with align a code you can easily rearrange that template. Just a few lines of code. The action manager lets you remove all that content with check boxes instead of having to write code to do so. And there’s nothing wrong with not being a developer, the average user is not a developer and doesn’t know what an action is and it doesn’t matter. But that’s the tools that we as developers have available to us today to output all that custom content that we’ve added to WordPress. ‘Cause that doesn’t come in WordPress, it comes in LifterLMS.
Thomas Levy: And we want you to be able to see your course outline, but if we build options for all of that stuff, then we need to make more database calls and we’ll slow down your website to allow you to customize the layout of your course. So, we deal with the hooks, because it’s more performant. And it is easy to customize, but again, you need to be a developer to do so.
Chris Badgett: We built a plug in for non developers to … the action manager if you’re trying to do it on your own.
Thomas Levy: Right, right, exactly. Exactly, yeah. And I mean I’ll be real with you. If you’re using LifterLMS labs action matter, it adds 20 to 25 additional database calls to each one of your course page loads.
Chris Badgett: Which is why we out it in a separate plugin.
Thomas Levy: Yeah, yeah, it’s not ideal. It’s not ideal, but it does get the job done. So, okay, so, what happens with Gutenberg now. Oh and then the reason you’d wanna remove those things, because if you’re using a page builder, you wanna control the layout of your course and you’re gonna do that with the modules that we built for Beaver Builder, widgets in Elementor, short codes if you’re using Divi, so on and so forth. And then you can build your custom layout. You can save it as a saved template in Divi or Beaver Builder, whatever. In the page builder of your choice and then you can load that up on each one of your courses, you’re good to go. You’ve decided how your structured data is presented and you’re happy. There’s a couple of extra steps, but you do that at the front end and then you’re good to go in the future.
Thomas Levy: But what if you’re not using a page builder. So, that’s my frustration as a developer is that I don’t wanna have to tell everybody in the world, “Oh, if you wanna customize your layout you’ve gotta go and install these two other plugins to do so.” But at the same time to build it to be 100% customizable means a lot of other settings. It would mean that we’d have to build a page builder into LifterLMS to allow you to do that. And it’s just we do a lot of things, but we can’t do everything. We’re not gonna build a page builders into LifterLMS. They already exist, they do a great job. There’s a half dozen of them that are great. So, there’s no reason for us to build that into our plugin.
Thomas Levy: But at the end of the day I hate when somebody emails me and say, “Hey, I wanna customize this.” And I have to say, “Well, you could be a developer and do it this way or you can install this other plugin and do it this way, but then if you do that you’re also gonna have to install this other plugin on top of it.” It’s just complicated, it’s not great. So, why am I stoked about Gutenberg. I’m stoked about Gutenberg because Gutenberg now provides us with a way to customize the template of every custom post type of course as a custom post type. So, that if we roll back all the way back to 15 minutes ago when I talked about blog posts and just having that paragraph as their template. With a course we now have all these different blocks which make up each on of those things.
Thomas Levy: So, again, each one of those short codes as an example like the course progress bar or course metadata which is like tags and categories and things like that. Each one of those becomes a block, which you can now drag over. But if we build a predefined template. If you don’t want the instructors thing and we get that request all the time. Some people really want their instructor information displayed and some people don’t. It’s like a polarizing thing. You either love it or you hate it. And maybe that’s an argument for us just building a setting. But we haven’t. So, anyway. You just hit the little trash icon on the block and it’s gone. And then you can save that as a prebuilt layout in Gutenberg and then later when you create another course you just load your prebuilt layout and you’re good to go.
Thomas Levy: So, all of the stuff that right now we need to do with essentially two different plugins or some code will be natively possible in WordPress. And now, if you’re a page builder guy or girl and you’re used to the page builders. You’re probably just gonna keep doing it exactly as is.
Chris Badgett: And that’s fine.
Thomas Levy: Yeah, there’s nothing wrong with it. And I mean I think Gutenberg is great, but I don’t think it solves all the problems. And this is phase one of Gutenberg. I think we’re going to see Gutenberg evolve and-
Chris Badgett: We haven’t even hit 1.0 yet.
Thomas Levy: Yeah, yeah, exactly, so, there’s still like, if I roll all the way back and maybe this is just semantic and doesn’t really matter to the sake of this discussion, but we’re still abstracting the data. So, you still need to do a mental translation from what you see on the back end with Gutenberg to what happens with your theme on the front end. It’s a step in the right direction. We’re not all the way there. But if anybody’s listened to [Matt 00:16:31] talk about the future of Gutenberg. Like this is not its final form and we have a lot more work to do and we’re gonna see Gutenberg evolve and be drastically different in a year than it is today. And then it’s gonna be out on the 19th. So, this is phase one. So, we’re not 100% there. So, I think for the time being, people that are really, really happy with page builders, they’re gonna continue with page builders. And Gutenberg isn’t really gonna change their life much at all.
Thomas Levy: But for our brand new user who’s maybe not really great at WordPress or doesn’t know WordPress that well, all these tools that you can get with two other plugins, you’re gonna get out of the box with Gutenberg. And I’m personally really exited about it, because it’s going to … my struggle is always, if you’ve ever talked to me, you’ve probably requested a feature and I’ve probably talked through it with you and ultimately told you, no, sorry. And it’s nothing personal, it’s just that we get hundreds and thousands of feature request and there’s only so many things that we can build. And every course is gonna be unique based on the needs of the course creator.
Thomas Levy: And there’s not necessarily a right or wrong way to do it, but we need to just kinda determine what is the most general approach that is going to keep the most amount of people happy out of the box with little configuration, while also considering that we don’t wanna build a plugin that has so many options that one, it overwhelms and two, it overwhelms your server with too many database calls and being unperformant, yeah, unperformant is a word. So, I don’t know, I’m really excited, I think it’s gonna change a lot of things and I know some people are nervous about Gutenberg, but realistically if you’re nervous about it, go to Poopy.life, install the Gutenberg plugin and just check out what happens. Poopy.life is a free service for schooling up temporary WordPress installations. It takes 30 seconds. You install Gutenberg, you install LifterLMS and you can play around with it and then once you see how it works, you could disappear and leave that site alone and it’ll disappear.
Thomas Levy: So, I think there’s a lot of … you just gotta div in and get your feet wet. But I’m excited. I’m excited for all of us. I’m excited for the course creators. I’m excited for WordPress, ’cause I wouldn’t dive in too much into what they’re already talking about for the future, but I’m really excited to see what happens in phase two, phase three of Gutenberg. So, for us initially what you’ll see is some templates. We’re going to modify the way LifterLMS works right now, but again, you’re not really going to have to do anything on your end. If you’re using the action manager you’re gonna be able to stop using the action manager. And rely just on Gutenberg templates.
Thomas Levy: And there’s also some performance increases that are gonna happen as a result of this too, because of the way that Gutenberg loads and saves data there’s a smaller … this gets maybe, I don’t know, whatever. There’s less of a reliance on the post meta table, which ends up in WordPress kinda becoming a massive table. And the bigger table it is, the slower it is to read from. So, because of the way Gutenberg is saving data now it’s a little bit more performant. I guess you could actually argue a lot more performant depending on the scale of the site. So, that’s really cool. And some of the stuff that happens in Gutenberg too, the HTML that’s actually seen or rendered is generated during the saves on the admin panel as apposed to on the front end when your end user loads.
Thomas Levy: So, it’s kinda got like a small bit of built in caching already or page caching. So, that’s pretty cool. And not every block works that way, but some do, a lot do. But I don’t know, it’s really exciting and the other cool thing that we’re looking at, that we do with page builders right now is conditionally displaying page builder modules based on enrollment.
Chris Badgett: That’s very cool.
Thomas Levy: Yeah, it’s really, really cool. So, I think it might actually be somewhat of an underused feature, ’cause it’s like … so, that’s something that we really advertise that well. Or I don’t know, maybe we do, you do the advertising. I sometimes don’t know what we’re telling you, you can and can’t do. I found a feature the other day that I don’t remember building and I told Chris about it and he’s like, “Oh, cool. You could do that?” And I was like, “Yeah, I don’t remember building it though.” So, that kind of stuff happens sometimes, but ping us if you wanna know about that secret feature that neither of us knew about. And if you do know about it, I don’t know, I’ll send you a sticker or something. But anyway, what was I saying?
Chris Badgett: Just displaying blocks conditionally.
Thomas Levy: Oh, yeah, yeah, yeah. One of the things, I haven’t 100% figured it out yet. I’ve got two weeks, we’re on the clock here, but what I would like to do and we might not do day one, but we will do at some point is extend all blocks, not only our blocks, but just blocks in general. So, the paragraph block from core or if you’ve got another plugin like WooCommerce that has like a product block or something like that. Extending all of those blocks so that you can show any block conditionally based on enrollment so you could show this paragraph if they’re enrolled. Show this paragraph if they’re not enrolled or something like that. Based on courses or memberships and things like that.
Thomas Levy: So, I think that’s gonna be really exciting that’s gonna be within LifterLMS content, but also outside in the greater site where you can have content upgrades for not enrolled users to try to get them into your course on a blog post or something like that. Or if they are a member of this, maybe there’s some bonus content in the blog post. So, there’s a lot of possibilities that we’re gonna be able to open up outside of LifterLMS just based on data available to us within LifterLMS.
Chris Badgett: That’s fantastic. Thank you Thomas. So, hopefully if you’re confused or just don’t quite understand what Gutenberg is and why it’s coming, hopefully this helps and if you’re scared of it, please don’t be. And just know that if you’re looking for a WordPress LMS. A learning management system, an online course platform for your WordPress website or you’re doing some kind of training based membership site. LifterLMS and Gutenberg are gonna work great together. We’re gonna innovate together and ultimately just help provide you with great tools to build your course or your online school or your training based membership site or coaching program. So, thanks for coming on the show Thomas.
Thomas Levy: I’ve got one more thing. Thank you. The other thing I wanna say too is that we’re developing all this very publicly. I mean, we’re an open source product or plugin. So, if you are using Gutenberg and you’re interested in what we’re doing, we’ve got a functioning version of some of these Gutenberg features. It’s called LifterLMS Blocks. I haven’t put it up for public consumption, ’cause Gutenberg isn’t really public yet, so, neither is this product or plugin. It’s free and it will be free. Like this is gonna get rolled into the LifterLMS core upon the release of 5.0 or earlier possibly. But if you’re already using Gutenberg, Gutenberg is so new. I mean we’ve been hearing about it for two years or I don’t know, maybe a year and a half, whatever the timeline’s been, I don’t know, but a lot of us aren’t using it yet.
Thomas Levy: I mean I’ve been running the plugin for six or eight months, but just kina been passively observing what’s going on. I’m not using it in production, but if you’re doing the same thing as I am. Like, we just don’t know how this is really gonna be used yet. What the reaction is gonna be. I’ve had a lot of developers and a lot of advocates of various things working on this and it’s a big project that has not been developed alone. It’s been Gutenberg itself has been developed publicly. But there’s so many possibilities here.
Thomas Levy: And I guess all I’m trying to say is if you’re already involved in this in some capacity, reach out to us and let us know what you’re using. If you wanna check out the Blocks plugin. Maybe this is your introduction to Gutenberg and you’re like, oh, I haven’t heard anything about this, which is totally fine, because I think there’s a lot of drama that nobody really cares about and at the end of the day isn’t gonna affect many people’s lives. And maybe this is the first you’re hearing of it. Go check it out. Check out our blocks plugin and if you have any feedback, hit us up and let us know. You can find me on Slack. It’s [inaudible 00:24:28] if you’re a customer. You post in the forums if you’re just using LifterLMS for free.
Thomas Levy: We just wanna hear from you, we wanna hear what you’re excited about with Gutenberg, what you’re planning on doing to Gutenberg. If you have any questions, we’re here to help. So, I don’t know, we’ve been trying to do more and more things with the community as far as how we’re developing and co-creating things. And this is a great opportunity. We’re on a tight timeline here, so, just because you have some feedback, doesn’t mean we’re gonna implement it, but we wanna hear it and we wanna know what you’re thinking. Yeah, let us know.
Chris Badgett: Awesome, well, thank you Thomas and yeah, if you’re looking for a WordPress LMS that’s Gutenberg compatible and you haven’t heard of Lifter yet, check out LifterLMS and our community is what we hear people, one of the things they really love about the LifterLMS product and brand. We’ve got a Facebook group, Slack community. Even an Office Hours Mastermind for our Infinity bundle customers. We’re all about community and we’re all about focusing on the needs of our community and our customers. So, any feedback is always welcome. Have a great day.
Thomas Levy: Thank you.
Chris Badgett: And that’s a wrap for this episode of LMSCast. I’m your guide Chris Badgett. I hope you enjoyed the show. This show was brought to you by LifterLMS, the number one tool for creating, selling and protecting engaging online courses. To help you get more revenue, freedom, and impact in your life, head on over to LifterLMS.com and get the best gear for your course creator journey. Let’s build the most engaging results getting courses on the internet.