 Hello everybody. Hi, can everybody hear me okay? I have a tendency to talk in low so Just let me know you can't hear me My name is Sunoon Chia I This is my any second time speaking at work camp first time I spoke. I'm from Atlanta by the way I flew from Atlanta Here to Boston is my first time here. It's a great city. I love it Love to visit again It was a great excuse to come over here because of work camp. So Decided to you know talk about one of my favorite things ever. I'm sure everybody here has heard of Divi That's why you're in here Anybody have not heard of Divi thing? Okay, cool. That's okay. So just a little introduction Well, let me tell you a little bit about myself I am my name is Sunoon again. I have been building sites for about 15 years professionally about seven Seven and a half. So I kind of know what I'm doing for a while And I also do SEO as well in addition to web design something I enjoy very much and I also provide WordPress tutoring. So if anybody needs any help, please let me know I can also do remote WordPress tutoring as well. So it doesn't have to be in person It is one-on-one or I could you know show your team how to use WordPress I'd be happy to do that as well And here is my niece. I have to put her in here. She's my new old niece She was born about five months ago. So this is this was a couple of months ago So she's really young. Her name is Isla and I'm obsessed with her So that's me and if you are interested in Seeing this presentation, I have put it all on the web. Just go to shiftweb.co Just makes it easy for you. My company name is shift web solutions And so you go to shiftweb.co This is just it's a very simple site just for work here So you want to follow along and go back to what I was talking about then you just go here Find the sessions here Okay, so we'll just jump right to it this this presentation is about Divi features which I didn't know about Divi, just to let you know is one of my favorite themes ever I've used hundreds of different themes. I've tried all kinds of things and once I started getting into Divi It's it's pretty much the last thing that I've just used and that's something better comes along than I'll use it But one of the reasons or a bunch of reasons why I like using Divi I Guess I'm biased. I think it's the best thing in the world. Like I said, I've used many different things and this is my favorite It's also one of the most popular things. I'd be surprised if you use WordPress and you've never heard of Divi It's just very well known. It's created by Elegant themes, which is a very well known Developer has been around for a long time. They they also sell other things as well But Divi's are the most popular ones. So I think it's their last thing that they That they built Another reason why Divi's awesome because it's a drag and drop visual builder Which is I need to get into a little more because apparently it's the future as well. A lot of people believe That's the direction that Gutenberg is also going into and other things you know, you have squarespace and Wix and I think a lot of them are You know catered towards people who prefer visual builders So that's what Elegant themes is as well is this is also a visual builder So if you're more of a visual person and you need to go to sites then Divi themes is pretty fun to use It's it has a great user interface. It's super easy to use. How do any of you use visual composer before? Yeah, I hate it. I used to use it I is what I used all the time in the past, but so you're familiar with it. You probably I Don't know some people like it, but you might get frustrated a lot. It's not it's not that fun That's why I think Divi builders much much better than visual composer And the support is also really awesome Because there's a huge community around Divi theme You'll find support anyway. You just Google something. There's people that made a video on it or you can contact somebody who just Claims to know a lot about Divi. There's a ton of resources ton of websites Just dedicated just to Divi theme a lot of tutorials out there and another thing I like about Divi theme is that when it's a premium theme But you can use as many times as you like. So if you purchase a License for you know Divi theme or Elegant themes you you can use it for forever Unless you pay well, there's two two Licenses options. There's one necessarily that's 89 bucks a year. The one-time fee is 249 Which is just that's all you have to ever pay. You don't have to pay yearly So it may sound like a hefty fee, but just imagine for me who built sites for clients 249 was a small price to pay because I could use it forever with updates forever and never have to pay anything else So I'm gonna jump right to it because I only have 40 minutes and I want to be able to have enough time for questions and end I think a lot of people typically do have questions about Divi. So we have to answer them So this is really great for people who have never used Divi theme One of one of my favorite things about Divi is that it comes with pre-made layouts So for example this site that I've made for you right here for work camp is just using a Divi layout I literally just found a layout click to use it and then edit it I did do a lot of editing, but it's just it was just a good easy start You know you want to do something. That's not that doesn't need to be fancy So the pre-made layouts Divi or elegant themes the developer Divi theme comes out with new layouts Like I think every week now. It's crazy How often they come out with the layouts and if you go to this side you click on learn more you'll see all the different Layouts that they have so far and as you could see there's pretty much one almost in every industry I mean, you know if you're look if you're a restaurant and you want to find a restaurant Layout you can use this one But the thing is you can use any of these layouts for your restaurant You don't have to limit yourself to just this restaurant layout. So Let's see how many layouts. I think they have Well, they say that they have 140 layouts, but that also includes for example you click on one of them Let's say you like this this particular layout. There's multiple pages For for this particular design the blog page case study page about us What is this home landing? So it's pretty cool. So if you like this look then you can use this whole design for your site for free And it literally takes a second to To upload it to a page. So I'm gonna show you how to do that really quick Show you how easy it is. So this is what my WordPress site I'm gonna click that new And you choose to use the Divi builder load layout You're all the layout. So let's say, you know, let's use this one that you like You want to do a landing page. Let's do a home page. Just choose the uses layout and Internet is a little slow. So it's going to go on a load But it's because it's loading all the modules for this particular page. Oh, that was fast. That was good So literally in two seconds, I created this page and Upload all these modules these pre-made modules. So let's publish it and I see what it looks like in two seconds It's pretty awesome. So Divi elegant things is always coming up in new layouts So that's one of main reasons why I like Divi. It's pretty cool. It's very very easy You need something quick. The second thing is the color palette and the manager the color manager is very new so I added that on here, but The color balance been a lot for a while for a while. So what what this is if you're familiar with Divi theme This is this is pretty cool So for example in Divi theme, you have all of these modules Let's say you wanted to make a change for Any port for color for a background color or text color or whatever it is In the past and you want to change the color or something You would just put in a hex code right go to design text color and then put in your hex number, but now Divi Divi theme has a color palette here. So this is a color palette that I just set up in the last word camp But you can set up a color palette so you can have Access to your brand's colors very quickly and easily makes it very user-friendly and To set the color palette you just go to Divi and theme options And then you're to color palette. So you just Click on one of the colors set your color blah blah blah set it Click same and then that's how you set your color palette now the color manager. This is a new feature that Divi just Made it update on it's actually in the visual builder and I don't use the visual builder off often But I need to get into it more because apparently it's going to be It's a lot of the features that elegant themes now comes out with the new updates for everything is in the visual builder So a lot of these updates and capabilities that Divi theme has you can find it in this back end So here in the back end, this is not the visual builder This is just just the normal back end that I'm used to and I like using more But then there's the visual builder you click on to option to edit with the visual builder You can actually edit in the front end if you You know looking at your website and you can see you can make changes, but it's taking a second to loan here And what with this new updates here the color manager is that you can act you? Divi now pulls up recent colors that you've used So there's a color you use even if you didn't set it in a color palette I just showed you it will pop up and the reason why this is awesome is because it just makes it so much easier for you to You know make changes to your site. So let's say I want to make changes to this yellow part right here Visual builder area Background is yellow. So you click on it That's the back section Let's say it's a color you get to choose You can set it to the background color and these the most recent colors Options are somewhere around here But if you want you want to learn more about the color manager click learn more on the site and This tells you about the new update about the color manager But I'm gonna skip through that just because we don't have a lot of time so Move on to the next thing another thing and I love about Divi that makes it easy for you to build Your your site is right click convenience. So if you're in the admin of Your website and these are all modules for this particular page right here, right? What I love about Divi is the right click Convenience here you right click on any of these modules right click it and Then you have all these options to rename this this module to do split testing Safe to library Disabling you to disable this particular module on your cell phone Traffic or even desktop you can disable it everywhere Which is really cool lock it for clients Collapse it like that Copy you could do all this stuff and I love the The right click convenience here. It makes it makes it very easy. I'm not gonna go through every single one of these a couple of these are actually mentioned and My my top 10 Features in here, so we'll go through that but that's just something to keep in mind If you use Divi a lot you probably didn't even think about doing the right click right clicking the modules So this is a really really easy way to manage your site so here's another thing number four module search bar is only Available in visual builder. So again, this is not visual builder. This is the visual builder right here So the module search bar is also really cool. So for example, let's say you wanted to edit this This model right here Let's click Edit just this button right here. You see this right here search options. So let's say It's really handy, you know going in and trying to find something is can be a pain because there's so many options So you start clicking start typing text Color, maybe something will come up. No, I guess this is not a text. Let's do this text view There we go. So if you're in a text Module, then you'll if you type a text color pop right up and you don't have to search for it manually Which is really annoying. Now again, this is only available in the visual builder. So Well, here's the recent colors That's this is a really easy way You know to find the visual builder and something probably if you use to be builder a lot you probably went on it This was there. So that's another thing that I like Another thing I like about Divi is the gradient backgrounds. This is super cool I really love this feature. It makes it so easy to Divi makes it really easy to Add a little player and character into your backgrounds. So I'm gonna do that in the back in here So let's say if you want it to Add a background to this background right here. Let's right-click it And I'm sorry. Just go into the settings settings So here you go. You see that the option is to do a solid color a gradient background a picture or a video if you go to the let's go back to This one This section where there is a background Is just it's yellow So it's a yellow background. Let's do a gradient You just click to choose, you know gradient and then if you you can play around with it select a color Looks really And then there's a bunch of settings There we go, so you can just play around that's another that's a feature with Divi that I really like I use that from my side a lot I use the gradient background a lot. It looks really cool And I have here on the site just you guys know a little how-to on how to how to use the critical gradient background I also have a little more about new so if you need a tutorial just makes it easy So you'll like something that you see just click go to the site and you can learn more about about each feature Here's another feature. I like that design options for headers This one is really cool because You can change instead of using CSS to change your header Styling you don't have to do that and what I mean by header for example, let's just go to This right here text So that's not a header I want to be my headers like each one each two right here each one Each one I have no idea why Okay, they're trying to change they change the color see creative design agency But let's say you wanted to change this particular header You would just go into that module right here this text module go into design And then scroll down and find the header options right here each one each two each three four, etc Instead of you know setting, you know CSS you could just go here and change it each one that you have set and And then change Pretty much everything the font weight the style the color size and everything and you would have to do any CSS So that's something I really like about as someone that builds a lot of sites for clients I like this feature a lot another thing I really like about Divi is being able to upload custom fonts. I Don't really see the need to do this too much just because there's already hundreds of fonts available Divi theme provides pretty much every font from Google fonts Right in your admin. So you want to change the text right here heading font Just click on it and you can see all fond us available But let's say you have a particular brand and you have a custom font You can just upload one right here by just clicking upload So they know you don't need to use any additional plugins or anything like that. You can actually upload Custom fonts right here Just really cool But don't go crazy and download every font You know because then your your site will be uploading every font every time so I would limit your usage Collapse and rename so Here's a cool thing I like about Divi is that if you work in a module section a lot like me If you have a certain if you build a page, they can get really really long And then you're gonna, you know, it's gonna be hard to navigate around trying to find Where's what so? One of the things that I'd like to do a lot is just renaming Like one of the first part of the Module so for example creative design agency This is the first module you can tell it's the first one anyway because it's up here But let's say you just like you wanted to have a visual view of what it's called I would just click on text and You can rename any of these labels. So we just do agency just so you know It's the label right here So you can rename any any one of these right here I can also collapse them by just doing it right click again and doing collapse So you have a ton of modules. This just makes it less overwhelming because it Kind of you know reserves a lot more space for other things But if you want to rename so let's say you do collapse you can actually rename This right here hero to something else Just do Top and then it'll be easy for you to find So that's a feature about Divi that I really like Another one. I really like a lot is I've been able to say to the library So let's say you create a module here this module right here this Yellow and image thing and you want it on another page Well, you can say this particular module this whole thing or even individual modules But you can save it by just adding it to a library. So you save it to a library and we can just call it Favorite and then if you create a new page Have new and then you use Divi builder you can Upload right here at from library at a module that you just saved that module that you liked I had to let from my bird and there is favorite header I know when you do that Save it and it's on a new page So it makes it super easy for you to not have to create everything over and over again. It's really boring and tedious to have to Create these modules You can also save individual Modules here these little great things and save to library You can also even save rows And this whole thing would be a section So the blue part is the section and then these are the rows and then you have the little modules here So you could save every single one of those I think that makes it really easy to To build sites in other pages if you want to keep a consistent scene in design So you don't have to go back and forth and see what you did Here's the last thing that I like about Divi I Love this feature because You know mobile friendly Web design is so important So you need to be able to make sure that your site looks good on the web So let's say if you look at this page on On your phone it looks great on desktop, right? But let's say created side agency was way too big on your phone detects. You can actually change that by Just right-clicking any of the modules, right? So let's say where was that text I created design agency This is right here. So you find that find that text module that says Creative design agency And then right-click it. Oh, I'm sorry. I like to right-click a lot. That's not right It's just clicking those the logic settings. So you click on that and then if you go to design And you want to change the text It is h1 header text, right? So we go to design scroll down find h1 text header and Then you can see a text size right here You want to change the text size for a mobile view if you click on this little phone icon It'll open up the options for this particular text Heading text size for your tablet and smartphone. This is a super cool feature that you know Don't forget about so if something on your side doesn't look right On your phone you can edit this the sizing text on And right here in Divy app That's pretty much it. I mean everything is a really awesome thing. There's as you can see there's so much flexibility Has so much power you don't have to be a web developer to build your side and you like to build your own site and You can use Divy and make your site look really good And it's really easy to use as well. So does anybody have any questions about how do you Updates Updates are really easy and not hard. So if you I suggest that you use a child thing So if if you have a you know, you're using Divy thing Just upload a child thing if you need to make any changes to your CSS code or anything like that and do any customization is just a child thing But if you do updates come actually quite frequently with what Divy thing just because it's such a You know such a well Why do you use theme that say updated often? I can't say how often they do it but it is pretty often The last update was just like last week Does have features like when you click on the TV, uh-huh it has any Section where you can move data to my quick or you have to go Download the version. Oh, no. No, it's just like any other WordPress theme If you just if you just go to your theme section It would just show that there's an update right here. It's just like for any other thing It would give you a prompt right now. There's not update So it doesn't show you but if there is it would just show updates needed Yeah, so, you know, so right now I'm using Divy 3.1 0.1, which is the latest version a Divy I'm glad you asked this question because Divy actually just Launched a new update for updates, right? That this new update actually allows you to revert back to the old version of Divy so if there's a An update with Divy theme and I don't know something happens to your site Which is can happen you shall update your website before you do any updates and something happens Then you can actually click on a button and says revert back to old version Which is we just Yeah, no with Divy just make sure that you put in go to Divy Right go to the options click updates and make sure you put in your your api q your username api So if you buy Divy theme You have you have to put an api. So let's say you don't put in this information There's an update and you're going to have to manually update yourself And upload it again, but if you just put an api api, then it'll just be when there's an update options It'll it'll say update now. Maybe just click it and it'll update Yes But um, one is uh, just when you went and set in the module the h1 settings Yes, is that something you can do in like settings or across all modules? Uh, yes, there is that's that's a good question. Um, uh, there is that would be in either in your um, your your child theme Or uh, whatever sets with the layout that that is set up But if you want some sort of standard you would just do it in the child theme Yes So, um So here's the thing elegant themes have been slightly quiet about about that But they keep reassuring us that everything's can be okay We're going to take care of you guys don't worry about it when the update comes don't worry about it But what I would suggest is right now everybody should just download the plugin classic one classic editor Just just to to be be sure For now, but then one of new, you know, this new good perk when it comes up when the new update comes up Um, I I'm pretty sure I'm I'm feel confident that that elegant themes is going to Create some sort of compatibility They've been a little quiet about it. So I don't Classic editor meaning um for you to to to be able to um edit your side just like this the way it is now Oh, there's a there's a plugin. There's a plugin that you can use that pretty much disabled schoonberg when the editor I mean when the update comes Yeah, and that's what I'm going to do for every single one of my sites Made a plugin that lets you revert to the whole yeah And that's what I'm going to have to do for for you know, I manage, you know hundreds of sites So I have a lot of work ahead of me. What is it called again? It's just like the classic editor Okay. Yeah the classic editor um So if you want to To make sure that you're going to be safe with with the new update. I would just download this Until everything, you know, is okay with the new update Yes Yes, great question. So a lot of people say claim that divvy is is kind of slow From my experience, it could be it could go both ways It could be slow just depending on how you build your site So if you have a large page with a ton of images and you don't optimize your images Doesn't matter what theme you use your site's going to be slow um So make sure that you optimize your images and then in addition to that I highly recommend wp rocket uh Caching plugin. So I used to use a super cache. I think there's total cache, right? And you guys heard of that? I hated those plugins. They always broke my sites Once I thought wp rocket it was one of the best caching plugins I found and it really helped speed up the site But just make sure you optimize your images um And if you don't know how to do that the easiest way to do it just go to think it's image optimizer or compressor I'm sorry. It's used to be called Yeah image compressor.com So you can compress for images and this does a really good job of just compressing your images without um You know compromising the quality of your Your your images so make sure that they're optimized and then using caching plugin and just You know, you know, here's another thing when you have when you use divi and you decide to uh hide a module for example, you have a page and um, you know, you have the option here To disable right disable disable disable that you want to keep it just keep in mind Even though you do this still loading So that's something that people don't think about as well So it will slow your site, but divi theme is pretty it's a little heavier than you know, I say like genesis theme I mean, of course it is because genesis. You don't you can't do anything Um, I mean I used to use it all the time, but there's not a lot of options It's a it's a great theme if you don't really need a lot of customizations and divi I like it just because it's great for clients. It's great for them to to manage and to make changes if they need to But it is a little heavier because it's a visual builder So it's going to be like that for you know, a lot of the visual builder themes or plugins out there Um, so I would just say, you know, use a passion plugin and image optimizer Yes That's another great question. I would say you just buy it If you're a designer developer, whatever it is you built that that's the service that you provide buy it and then um, if You when you build their site and you just put in your api, right and that's it Yeah, and then it you know It's it's hidden nobody can see it nobody can use it again, but you build it for them. You just that's part of your service That's what I would do. I see some people, you know, have their client buy it. I'm like, that's to me I like to provide a service a You know Stress fee service for my clients to make it easy for them. They don't have to worry about anything That's why I also do hosting but you know, I don't suggest you provide hosting unless you plan to do it in Long term because it's it's a lot of work, but I provide hosting. It's great residual income. I love it But it also allows me to update their site for them. They don't have to worry about it. Yeah, yes Is there a 40 in feature? Yes It's really cool. Um, yeah, so let's say we go to This page really quick Let's just go to edit another page Uh, sample page click Let's see add a module. It's a module and when you click add module, you'll see all the different options here and you'll see Yep, accordion is the first one Yeah, super easy. So let's say you add one you do, you know, blah blah blah say and let's say you you You know already set the text the font like all the styling for that particular order of accordion and you don't want to do it again Just close it Yeah, I just started using the I built a site with it and I was trying to find out I saw in portfolio that you can make a like image carousel But I don't want to use that I don't want to use a portfolio I would just like to have like a slider Yeah, it's like a carousel slider that is I can say how many images that was beyond that Yeah, so it would just be like slide like but small but small small you could do that cross like yeah Um, yeah, so you could do that to say add an insert module. I believe that one is So you want across the page? I want five across It's actually something you can do an extra which is the theme that you add to divi from divi from elegant themes It doesn't cost more. Okay, but I I think I know what she's talking about Extra they have like a slider that has a couple of pictures with an arrow on each side It's like a carousel scroll. Okay. Yeah. Um, so just so you guys know there's a difference between divi theme and divi builder Divi theme is uh the actual theme that you use To get all these features divi builder can be used on any theme like extra theme so, um If there's a theme that you like And do you want to be able to use divi builder? You can you can download that theme and then do You know download divi builder. Is that thing that you can use within divi builder the extra the way I I use it I mean you download divi and then you download extra as a theme and it just uses divi as a child like extras of child theme Oh, is it? Okay. Yeah, I'm not familiar with it. It's just because I wanted that specific functionality and I realized extra offered it Okay, I wasn't aware that extra was also a child theme. I think that's what I think that's how it works Yeah, yeah, it's the only one they have there's multiple ways in how to go about that So if you want to talk after this and I can give you some way to say So I have probably a couple more questions. Uh, time for a couple more questions. Yes Um, can you talk about transitioning from visual composer to divi like what that's like? Yeah, so Um, what I would suggest in short to answer that is just to build a whole new site Is your site big? Uh, not just build a new site. It'll be easy. Just build a new site and then uh, you know Finish it somewhere else and then when you're ready launch it. Yeah, I wouldn't try to like You know do it at the same in the same install. I would just do it all over again. Yeah, that's the best way to do it Anybody else have questions? Yes um Was it there's like a divi theme or there's like a I think if we call it like the divi like plug-in and there's like an elegant plug in our theme I was wondering what the real difference is between the two. Yeah, so um elegant themes is the is the developer for all of this so That out of the way, there's divi theme theme is the actual design that you use right for your site, which is In here you upload a theme And it's it's the divi theme. So it's just a bare bones and it has all the options for for divi For the divi builder now, let's say you want to use a completely different theme Like you go theme fours and you found a theme that you like Um, I would just be careful because most of the themes on theme fours uses a visual composer So it'd be kind of crazy if you try to use visual composer and divi filter But let's say you find another theme that you want to use and it's not divi theme You can actually use divi builder plug-in, which would you upload into here as a plug-in to Enable your site to be You know to to use a divi builder, which gives you all these options that I was just talking about Yes, when you use the divi filter, which I've been using for a couple of years Yeah, and I've created several sites and I love them and you know, you have to Learning her of course and the tutorial is very helpful But is that so I've created my own theme with the divi builder. Is that right? No No, you're you're just using divi builder. You're just creating a bunch of layouts Yeah, so, uh, what theme do you use? You have to use you have to use Like a default theme what oh you're just using a default WordPress theme that gets uploaded I really don't yeah, so if you don't know then you probably use a default theme I would just I instead of using div because the thing is you don't want to use divi builder and divi theme So if you ought to have divi theme installed like I showed you here Right here don't install divi builder too But if you're using some other theme like WordPress theme like I didn't I like to leave it Then you would install divi builder And then you you know, if you don't if you're not sure I would just use a divi theme I Use a divi builder But the divi builder is the thing that let's you drag and drop the divi builder come to the field Yes, the divi builder is built inside of divi theme. So I'm using the divi theme period. Yes Okay, yeah, yes But you could use a divi builder with another theme Yes, which is a plugin But you can't always override like with 2017 you can't override the home page settings easily Yeah, so you're still stuck with the home page settings. So it's very frustrating because there's too much padding There's all kinds of margins and it just takes a lot of work You still got to get that out of it if you want that divi look that's why I'm using the divi theme Yeah, the divi theme is really the only way if you want to use divi builder another theme I'll just say be careful because some of the options might not be available So just I'll just use divi team. Yes I want to correct my question actually So there's two themes So there's like a divi theme and then there's like an extra theme in some of these other ones On elegant themes. Is there any recommendations about those other ones? Yeah, so elegant themes elegant themes makes a ton of themes They used to you they used to that's what they did they developed themes for people buy But then when divi came out they stopped making other themes They provide support for the other themes But you just you could just use divi theme But you look at their themes and you like the design of them Just go ahead and use use those and then upload divi builder Well, you can also pay 150 dollars for a child theme That needs divi Okay, right So there's some fancy child themes that are all laid out with beautiful angles and gradients But you still need to buy divi as well Yeah, so I would yeah, so if you if you just google divi child themes. I actually if you do that Yeah, I actually have um If you use a child theme, which is like a design for you you have to buy divi theme And if you go to my website, you'll see the a resource for child themes and The volunteers say that I'm done But I can talk to you guys after