Divi Theme Tutorial for Beginners (2024) 15 Minutes Divi Crash Course

divvy is one of if not the most popular WordPress theme and visual Page Builder on the market what I love about building WordPress sites with divvy is the thousands of professional templates hundreds of website elements and how you have complete control over your designs by using their intuitive easy to use and responsive visual page builder you can create essentially anything you can think of without touching any code or any of the technical stuff so today my focus is to help you set up get familiar and using dy's key features so that you can feel confident in building and designing your website Pages using divvy's powerful Builder Okay so just quickly before you go ahead and launch into dvy and WordPress consider subscribing if you haven't done so already or if you're new to this Channel and that way you'll stay updated with actionable videos and tutorials designed to equip you with the skills knowledge and tools to help your small business Thrive online and with that not out the way let's go ahead and dive into my ultimate divy theme tutorial for beginners first things first you need a WordPress website as you can see I'm currently using hostinger which allowed me to purchase a domain hosting and create a WordPress website in just a few minutes if you currently do not have a WordPress website up and running online then what I'll do is I'll link hosting a Down Below in the description for you to create an account purchase or connect a domain name launch hosting and a WordPress website which you can do in just a few minutes okay so as you can see I'm inside a fresh WordPress account now once you have arrived inside WordPress simply navigate up to appearances and then locate themes and that's going to take you to your WordPress themes at the moment you can see I've got 2024 activated but what we want to do is we want to purchase then download and upload the divy theme into our WordPress account to do that simply head over to your browser and type in elegant them.com or click on my divy theme link Down Below in the description and that's going to take you here then simply navigate up to unlock the power of DV then go ahead and click on join today you have two options to either purchase a yearly license or a lifetime license this is completely up to you you can also try dvy risk-free for 30 days if you don't like dvy as a WordPress theme then you can always get a refund within the first 30 days so go ahead and purchase dvy and then we'll meet you inside your elegant themes account and once You' have arrived inside your elegant themes account go ahead and select themes and plugins then come down and locate D theme and then click on Download the dvy theme then once you have successfully downloaded the Dy theme simply head back over to Wordpress and back inside themes what we're going to do is click on add new theme then locate upload theme go ahead and choose the Dy theme zip file that we just downloaded you can see it here dzip then click on open and hit install now congratulations the theme has been installed successfully then come down and click on activate and just like that with activated the divvy theme now let's navigate over to the front end of our website and this is what our WordPress website looks like before we've made any customizations using the divy theme and divy Page Builder now let's go ahead and create our first page with divy navigate up to new and then come down and click on page we're not going to use wordpress's block editor we're going to use the dvy theme navigate over to add title and this is going to be our homepage then click on use divy Builder come down and click on start building then here we have three options for building our WordPress website Pages the first option allows us to build a WordPress page from scratch using the divy page builder or we have the option to create a website page using a professional pre-made layout that you have access to and you have access to hundreds of pre-made templates full pack website templates as well as section templates and you also have the option to clone an existing page that you've created with divy now the best place to start as a beginner is to use a pre-made template and then to customize that template using the divy page builder the way that you like simply come down and click on browse layouts then go ahead and select a category I'm going to select business then simply navigate through the premium templates within the category that you selected and choose one that you like the look of you can also click on that template then simply navigate through each page over on the left hand side to make sure you like the look of that professional template I like the look at this so what I'm going to do is go ahead and click on the homepage and then select use this layout go ahead and use your dvy username and API key if you haven't added this information already you can find this over on the elegant themes website then once you've added those details go ahead and click on submit and just like that we've added the home template page to our website now what we can do is customize this page the way that we like now to understand the visual Page Builder and how it works we first need to understand the structure of the divvy page builder first we have the page section this blue box here and your page is made up of these sections then within each sections you have rows and you can create as many rows as you like within each of your sections for example if I click on change row structure you can see that this is a single row however I can add two rows three rows four and more down here as well as these custom rows I'm going to close this and then within each of your rows you have these modules and these are essentially elements that you can add inside your rows and there are many types of modules or elements that you can add inside your rows for example if we navigate down here to this plus icon we can search for the specific module that we want to add to this row let's have a look at some popular ones down here we can add a blur or a button if we like similar to the button down here if we navigate down further we can add a contact form a divider if we like between modules we can also add a gallery a heading in similar to this heading here we can add images maps as well as a pricing table and more down here okay so let's close this the great thing about the divy themes pre-made templates is you have access to all of these professionally built templates that you can then customize the way that you like you can simply change the content and add your own content to the different sections rows and modules simply replace the content on these templates as you can see the templates are already responsive across devices let's preview what this template looks like on mobile as you can see the template is incredibly responsive okay so let's navigate back down to desktop and then navigate up to the top simply hover over each of the modules and click on settings to make your own changes I'm going to come down here and change this content and you have access to all of these formatting options up here I'm going to come down and click on the green tick and once you have made any changes simply come down and click on Save draft this is if your website page is currently not published online however if you want to publish those changes that you've just made live on your website then simply click publish because this is just a draft page I clicked save draft okay so I'm going to navigate up to this module and then click on this get icon and again I'm going to navigate down to this text box and change this content then I'm going to add an underline for this word now with each of these editing boxes you can drag them around the screen you can also come down and make the Box bigger if you like and this is all based on personal preference now once you've made changes to the content simply navigate over to design and here you have all these different design options for example I'm going to navigate down to heading text this is an H1 heading text I can change the heading font The Heading font weight I'm going to click here and then come down to semi bold I can also change the heading font style The Heading text alignment and the heading color if I like if we navigate down here we can change the heading size based on the device for example if I click on tablet The Heading size is 40 if I click on desktop The Heading size is 72 and if I click on mobile The Heading size is 24 I'm not going to make any changes here I'm happy with the default setup of this template okay so I'm going to navigate back over to desktop and then navigate up the page and minimize this option then you also have other options down here that you can play around with if we click on Advance we can come down and click on visibility and we can disable specific modules across different devices es also if you're more experienced you can play around with custom CSS okay so I'm going to come down and click on tick and then navigate down to the next module which is this button module simply click on the gear icon and here we can make changes to the button text I'm happy with the button text we can also come down to link and we can add a link to an internal page on our website for example once I've created a consultation page what I would do is link this button to our consultation page on our website for now now I'm going to go ahead and click on the screen tick and then navigate down the page now if I like I can also make changes to the section if I click on background you can see this is the background color so I can change the background color of this section if I like I can also add a background gradient a background image or a background video however again like I mentioned I'm happy with this template background let's go ahead and close this next we have this module here now if I click on the gear icon what I can also do is leverage a to generate content on my website for example let's go ahead and click on generate content with AI then I have the option to come down and improve with AI for example I can make my content better I can rephrase I can come down to paraphrase I can shorten fix spelling and grammar I can rewrite for and I can also change the tone or make it more and these options over here so this is if you've already gone ahead and you've created content down here you can use AI to help you improve your content if you want to learn more about Dy AI what I'll do is add a beginners tutorial up above and down below in the description which will dive deeper into leveraging D's AI so what I'm going to do is quickly just change this and this text down here I'm happy with that now down here you can see we have another module this is a video module what we can do is simply replace this video if we like simply upload your video here or navigate over to andert from URL and you can add the URL from YouTube or a different platform I'm going to go ahead and close this for now and navigate down the page let's close this here you can see we have a row if I click on this row here there are four rows I can go ahead and change this just to three and as you can see I now have three rows I'm going to come down and delete this module so essentially what you want to do is navigate through each of the different sections make changes to each of the sections as well as the rows and the modules within each row it's incredibly easy to make those those changes again once you've made any changes come down and click on Save draft or publish now you can also navigate down here and click on this plus icon and you can quickly go ahead and replace this layout with a different template layout this is if you decided you didn't like the look of the template page layout that you chose you can also choose from Saved layouts and your existing Pages for example if we close out of this and come down and click here you can add this page to your library maybe you change the entire ire style of this template and you want to save it as your own you can go ahead and do that now that way you can access this template and create your future Pages faster I'm going to close this for now and you can also do the same with sections if you like a section you can go ahead and click on Save and you can save the section as well as the row and then if we close this you can do the same with modules just add the module name and then save to library and that is how you can quickly create your pages your sections rows and and modules okay so what we're going to do is navigate up to new and add one more page and this is going to be the about page come down click on use DV Builder and again we have these three options we can clone an existing page choose a pre-made layout or we can build from scratch again I'm going to go ahead and click on browse layouts I'm going to select business again and then navigate down and this is the template package we used earlier I'm going to come down and click on the about us page and then click on use this template give divy a moment to load that new layout and as you can see I now have an about us page again what I want to do is navigate through the sections rows and modules and make those customizations now you can also navigate down and you can create a completely new section by clicking here then come down and choose a new section you can either choose regular specialty or full width or if you've saved a section you can go ahead and choose a section from the library I'm going to come down and click on regular and then here we want to choose a row I'm going to come down and choose this row here then what we want to do is insert modules over here I'm going to add a blur and here we can make changes to the blur if we like for now I'm going to click tick and then if I navigate over here I can add another module and for example this could be a video I'm going to click video and then I would add the appropriate video in here again with the section I can navigate up to the gear icon click on background and I can add a background color for example I like the look at this again I have these other options like I mentioned before I'm going to click tick and as you can see I just added a new section all I would do is add an image in here change the text the content in here and add the video now what I'm going to do is navigate up to the top click on Save draft and then navigate back over to our WordPress backend then what we want to do is locate divy and over here what we want to do is upload a logo go ahead and upload your logo I'm going to use this logo here and click on open and then set as logo once you've made that change go ahead and click on Save changes and now let's preview what that looks like on our website as you can see we have the logo here but it looks quite small so what we can do is navigate back over to our dashboard and then come down to appearances and then click on customize and this is where you can make Global changes to your website I'm going to click on header and navigation and then primary menu and then for logo Max height I'm going to drag this out and I'm happy with that sizing so I'm going to go ahead and click on publish now close this and then come down to appearance and click on menus give your menu a name then come down and click on primary menu and then create menu then click on the publish pages that you've just created and click on add to menu at the moment we only have a home and about page you can add more later on once you've created those pages then come down and click on Save menu then what we need to do is navigate over to settings and then come down and click on reading then navigate up to your homepage displays a static page and then come down to home homepage and click on home and then all you need to do is click on Save changes and then navigate back over to your website and as you can see just like that on our website we have our primary menu we have two items in our menu about and the homepage and you can add other Pages just like I've showed you in this tutorial if you're interested in diving deeper into the divvy theme and Dy Page Builder and leveraging more advanced features then what I'll do is add the appropriate video tutorials Down Below in the description for you to check out as you can see divvy makes it incredibly easy to create and customize your WordPress website and there we have it guys that is it for this divy theme and divvy Page Builder tutorial for beginners now if you have any questions make sure to pop them down below and with that said thank you so much for watching this video all the way through to the end if you got value make sure you leave a like And subscribe and that way I'll see you in the next video take care everyone

Channel: Stewart Gauld

Views: 7,677

Keywords: divi theme tutorial, divi theme builder, divi tutorial, how to use divi builder in wordpress, how to use divi theme in wordpress, how to use divi plugin in wordpress, how to use divi theme builder, how to use divi, divi builder tutorial, divi theme review, divi theme wordpress, divi theme mobile responsive, Stewart Gauld

Id: AoIvpNIzowI

Length: 16min 0sec (960 seconds)

Published: Tue Feb 06 2024