How to Begin a WordPress Blog – How to Start a Blog using WordPress – Tutorial

How to begin a WordPress blog If you want to start a WordPress blog, this is a real good tip

After my face disappears from this video, there is a tutorial about a really basic WordPress theme with which you can build anything you want It's called the Divi WordPress theme It is basically delivered by Elegant Themes, one of the biggest providers of WordPress themes online They have over 200000 clients

Why? Because they give you some real basic stuff which looks high quality as soon as you have your website online So, check the tutorial which is coming now It is about 23 minutes long And it is about the basic builder of this, uh, WordPress theme called Divi You will find out it is very simple to start your WordPress blog, because it is all explained in very simple terminology

No coding, just dragging, dropping, Oh, and don't forget, below the video there is some links with more tutorials about this theme About 3 hours Anybody can build his WordPress blog with this theme Enjoy the tutorial In this tutorial we'll be going over the Divi builder which we will be using to build all of your pages when using the Divi theme

When you build a page with Divi everything is comprised of sections, rows and modules Sections are your largest organizational element Inside of a section are rows of columns and in each column is a module or multiple modules Looking at this page here is a very basic layout We have a single section and inside that section a row of two one half columns and inside the first column we have a text module and in the second column we have an image module

Let's go over to our builder and see what that looks like This blue section here, that's the section The green here, that's the row It's a row of two columns and in each column is a text module and an image module Settings are available for each of these

You can see the icon here is the settings icon So sections have various settings as well as the modules But we'll get into more of that later Now, you can have any number of sections on your page so let's add a new one to see how it works When I click the add section button, you can see that all sections need to have a row, so your first row has already been added

You just need to choose how many columns you want inside of it So click the insert columns button to get a list of all the available column layouts For this next column I'm gonna do 4 one fourth columns You can see once your columns have been added, you can click in any of them to add a module So I'm gonna add a module inside this first column by clicking the insert module's button

And then I'm going to add an image module So you can see, here's a list of all of our available modules I'm gonna click the image module and once you click a module, you gonna get all the various settings for that module For the image model, the first thing is to choose your image, so, I'm gonna upload an image I'm gonna upload all of these

And I'm gonna set this image as the image for this module Then I input my alt text I'm not gonna link this anywhere And add the animation fade in "from the left" and save So once you've added a module, you can see it appears here and you can take your modules and put them in anywhere really, so if I wanted to drag this empty column, I can do that or I can bring it up here and put it underneath or above my other image Let's put it back where I started from

Now if we preview our changes here you can see that this new image has been added down below our other section So, that's that, some more images Put it quickly here so to add the images that were uploaded in each of these columns Okay, so I've added four image modules, each in their own one fourth column inside this row here So let's take a look at what that looks like

There we go We have a section with the one half column one half column A text module in the first column, an image model in the second column Below that we have a new section with a four one fourth column row and in each column we have an image module Well, let's go

Um, I think I like more separation between these two sections, so what we can do, is give our second section a different background color which you can do in the sections options so on that second section I am gonna click the options icon to bring up all of the available options for these sections They can do all kinds of great stuff with sections You can choose a background image, a background color, a background video

You can enable or disable inner shadows or you can enable or disable parallax effects for background images or to give them a nice fixed position you just scroll, which is really cool For this section I'm not gonna use a background image or a background video I'm just gonna do a simple color so, in it, click the background color option and just use a really nice grey, subtle grey There we go Finished like that I am also going to turn on inner shadows which will give you a little more separation

and save So let's preview that There we go, so we have this new nice grey section which has been separated Looks great You can also add new rows within the sections you have already created, so you can see this little add a row button here and I add a new row below my images

So, you're gonna click the insert layout or insert row button And for this let's do another one half one half column

Since the new rows have been added, now, this can be rearranged anytime by dragging and dropping which is great and you can also take your rose and put them into different sections So if I wanted to take these images that we created earlier and put them inside the first section up above my other images, I could do that Let's take a look at what that looks like There you go, you can see the images have been added to this row for this section above the previous row Let's bring them back down to where they belong

So I have uploaded this and added my new row with two one half columns I'm just gonna put some text in there for now Keep the things simple Then, for the text modules you can choose your text color so to give a dark section, you know we just It's light grey, so I want to keep my text dark to make sure it shows up nice but if you had a dark background color you can make your text light instead You can also choose your text orientation so I'm just gonna keep it floating to the left and click save

And in here Let's add some tabs It's only clicking the tab module

Now this is one our more advanced modules within the tab module window you get to add tabs with uh You get a new, uh, setting for adding tabs You'll see this button here that says "add tab

" You can click that to add a new tab and choose a title for the new tab Um, I am just gonna choose This one is called button

That's simple and then add some text So I added a new tab I can add one more Button two Add some text

Save There we go So we've just created a tab module with two new tabs and then you can adjust the order for the tabs by dragging and dropping as well And you can choose an admin — an admin label For all our modules you can choose an admin label, which is great, so if you have a lot of modules on your page and they're all called tabs it's gonna be hard to remember which one is which so you can change that

So I'm just gonna call this details And you can see it changed the label here so where this said "tabs" it now says "details" And let's see what that looks like Here our first section with an image and text Second section, with the one row a four one fourth columns with images and a second row from the same section with some text on the left and some tabs on the right That's a really basic overview of how the builder works

now we have a basic understanding let's get into a more advanced layout with the combination of sections, rows and modules, you can build just about anything It's really great Here you can see we have a — our demo up This first section is a full-width section with a slider

Below it we have a new section with a single row of four columns and below that a new section with a row of two columns with an image module a text module Below the tax module a counters module Below that we have a new section of four one fourth columns each with an image module inside of it And below that we have a new section with a background image, a text module an image module and so on So let's go over how you might create something just like this

I am gonna create a new page called homepage test Now, when you're creating a new page, anyone using the builder, the first thing you want to do is click the "use builder" button Now, if you already have some content in your page – we just add something here – that content will automatically be added to the builder, within a four column row within a text module Let me see – let me show you what I mean I'm gonna click use build – use page builder The old text editor goes away and the builder editor comes up and you can see that a text module has already been added

This is just because there's already content within my page so if I look at this you can see that where this row is in here now if at anytime you wanna go back to the — to the the default editor, you should be warned that all your builder content will be lost and your page will be reverted back to its original state So we go click on "use default editor" Gives you a nice warning Click "Yes

" Now back to where I started There's a little bit of text I just added Anyways, I wanna start from a blank page so I am going to keep it blank and then I click the use page builder again There we go We have a blank row inside of one section

Now, to start things off if you are looking at our homepage the first element is a slider Now, this is actually a unique element because it is a full-width slider You may have noticed that there is an "add section" and "add full width section" button The full width section is little bit different than the normal section It has a different set of modules that each extend the full width of the page which gives some cool possibilities

so for example this full slider which usually would have been cut off at a fixed with because it is in the full width section it gets to extend the full-width of the page which looks really cool So let's create one of these I'm going to add a new full width section by clicking at full width section button You can see that full width sections are purple instead of blue which visually separate it the best, so you know what you are editing And when I click the insert modules button here you get a different list of modules There's only a couple full width, uh, full width modules right now

So let's add a slider Then I click the full width slider button Once you've clicked the slider, you have various settings You can choose whether or not you want to show your arrows Whether or not you want to have circle buttons, little pagination buttons

You can choose whether or not you want to have a parallax effect for images and you can choose the admin label as with all of the modules The first thing you need to do in your sliders is add a new slide You can have any number of slides within the slider So let's add one Click the "add new slide" button

You can choose some heading text for your slider Now, let's say: "This is a heading button text" if you want include a button Um, tsk, click me Button URL, which is the URL you – where you want your button to lead to So you can send people to Google And you can choose a background image, a background color or a background video For this slide I am just gonna choose a background image so I click the upload image button

And then when I upload a new background image Actually, I am gonna upload all of these, so these and these for the page Okay, so here's the background image I'd like to use, and we'll select it and click set as background You can also choose to have an image next to your text

Say if you upload, if you upload a slide image it'll appear to the left of your text and if you don't upload an image than your text will expand the full width to the slider So I'm gonna add an image by clicking the upload image button and click this stone image Click set as slider image and that's it and oh I also um, text color so because of our because our background is dark we're gonna wanna make sure our text is light It's already set to light so that's fine and we are also going to add some content so I'm just gonna paste in some content here for the slide which will appear below your heading and above your button And click Save And let's add one more slide for this And add a new heading

Button text, as usual Button URL For this slide I'm not gonna use a background image I'm just gonna use the background color instead Now, if you choose a background color and a background image the background image is gonna appear over the background color

So in this case we leave the background image blank Hm, I am just gonna choose a nice green blue here Uh, and I am gonna add some content as before There you go, we have two new slides within a slider and these slides can be rearranged at any time You can also click the settings icon to get back into that slide setting

If you wanna change anything Anyways, and then click save And you can see that the full width slider module has been added I like this to be the top of the page and I'm gonna drag it to the top Uh, let's see what that looks like

Our first slide with the purple stone background and our stone image with some text on the right And our second slide which is a plain green background color and "text only", no image So far this is all we have on our page because that's the only row we've — or only section we've added a module to So, let's add some more Below our full width slider I'd like to add a row of blurbs

Blurbs are just a combination of text and image So I like to have four of them, all next to each other so then I click insert columns and choose four one fourth columns Inside of each of those columns we're gonna add a blurb So I click the insert modules button, choose the blurb module Now, the blurb module is just a heading, some body text and an image, so I'm gonna choose my title text

You can choose to link your text somewhere by inputting your URL I don't wanna do that in this case and gonna leave that blank You can upload an image and use this icon image And then you can input your text content below Click Save and add three more of these There we go

I've added a module into each column, four of them in a row Yeah, let's see what that looks like So you've got a slider and below that four blurbs in our new section Let's add another section below that one I'm gonna click the add section button and inside here I want to have um

a two-thirds column next to a one-thirds column So I'm gonna choose the two-third one-third row On the left I'd like to have an image

Into the right some text So I choose the image model on the left here Use this nice iPad iPhone image And to the right we're gonna have some text And align it to the left

Keep it dark And then click Save Now, you can also add any number of modules within a column below other modules by clicking the insert modules button You can see here So below the text I'd like to add some counters which are nice like stat bars so I'm gonna click the insert modules button and choose the animated counters module

You can add a new bar to your counter by clicking the add new counter button and choose a title and a percentage and add a few more Click save and choose your text color which you like to keep dark And the background color of the bar Hm, there we go Okay, so now let's see what that looks like We have a slider, four blurbs, an image, some text and some counters

Now, I like to add some separation between these two sections So, I'm gonna adjust the settings of our third section here Give it a gray background color as well as some inner shadows Take a look at that There we go It's look really nice Now, below that, for sticking to our demo layout, and add four more images, some icon images which represents some of the great features we support

MailChimp, Woo Commerce, WPML So let's do that and go back to our builder and then add a new section And in this section four one fourth columns And in each of these I'm going to add an image Our logo images as seen here

Okay, so I've added four new images, all in a row Preview those changes Got our slider, our four blurbs, our image, text, counter and these four new images below that All right Let's add a new section with the background image

This is a great feature of sections because they expand full width and if you add a background image it creates a really cool separation between the section above it and below it So let's add a new section and for this section I'm gonna add a background image instead of a background color Gonna click the settings icon and I'm gonna upload a background image, which is this one Click set as background You can also do a video background in this case I am just gonna do an image and keep it the way it is

And inside of this section I'm going to add a text module and an image module So I'm going to keep them full width so I'm just gonna add a one column row Can add some text Now, because this text is sitting on top of an image, I'd like to make sure that the text color is light That way it shows up and I'm going to center this text

Click save And below this text I'd like to add an image So I'm gonna put the insert modules button again Click the image module Can add this nice iPad air image

We'll fade it in from the top and then click Save I have a new section with the background image inside of that some white text in an image below it Preview those changes All right And now we have created a really great homepage design, very similar to our demo

We have a slider – full width slider, four blurbs, an image and some text and the counter Four logo images, a section with the full-width background image, some text and an image below it And that's a basic overview of the Divi builder

Free Email Updates
We respect your privacy.

free online tools

affiliate marketing