Tutorial: Page Basics

This is a tutorial for creating a Page. Pages are very customizable, they are the main content holders of the website. By using Page Builder it is very easy to build and replicate pages.

*A good trick for learning is to attempt to re-create an existing page. This way you learn how it was put together and learn in the process. All the pages on this website can be reproduced just by observing in one tab and then just adding the same thing on a new page.




To begin Click “Add New” Page (can be found in multiple places)

Screen Shot 2014-07-15 at 4.24.26 PM Screen Shot 2014-07-15 at 4.24.16 PM Screen Shot 2014-07-15 at 4.23.56 PM

Give the page a Title

Screen Shot 2014-07-15 at 4.27.30 PM


At this point it is a good time to save as a draft.
Keep saving as you work on the document by clicking “Save Draft”

Screen Shot 2014-07-15 at 4.31.24 PM

Preview will allow you to see what the page looks like

Publish will make the page visible to the world (although they wont be able to find it unless you share the link. The text located under the title named Permalink)

BUT REMEMBER ALWASY SAVE Screen Shot 2014-07-14 at 3.16.11 PM


Screen Shot 2014-07-15 at 4.39.29 PM

This is the “Title bar” by default it will display on top of every page. To disable this to achieve the same effect as the home page you must navigate down the right hand side of the screen until this is seen

Screen Shot 2014-07-15 at 4.39.59 PM


And then disable Show Title.

To get an effect similar to the home page, Select a Wrapper from the first drop down menu in the Page builder. Content can be placed inside of this. To get it to appear just right you will need to set the top padding on the wrapper to 34px this will move the content down so its not obstructed by the menu that over laps a little.


Screen Shot 2014-07-15 at 4.56.21 PM



^^^ default content box

This Page build only exists below the box seen above you have to scroll down after the default content article box. I should also note that the default content box is resizable Screen Shot 2014-07-15 at 4.56.34 PM by dragging the corner if you want to get it out of the way. The default content box is just for really quick pages (like this one), but most of the time we want the more advanced tools the page builder offers.

Screen Shot 2014-07-15 at 4.42.17 PM <<< PAGE BUILDER BOX


To use this, one would click on the drop down menu and click on the desired item (Please note it is not advised to use the gallery option as it can be annoying, please use the Content option instead)

Screen Shot 2014-07-15 at 5.02.21 PM Screen Shot 2014-07-15 at 5.02.28 PM Screen Shot 2014-07-15 at 5.02.33 PM




For this example I will create a gallery on this page.

First we need some columns, so select a size and click the [+] twice

Screen Shot 2014-07-15 at 5.09.51 PMScreen Shot 2014-07-15 at 5.11.17 PM

resize the columns by pressing the [+] and [-] buttons

Please note that these boxes are drag and drop-able, as well as resizable, and rename-able. The name is purley just for you to know what the things are.


Next we need some content. For regular articles, text or photo galleries we will just use the content box.

Screen Shot 2014-07-15 at 5.18.40 PM

so select it and click the [+]

Then drag it into the column you want (columns are completely optional organize it how you like)

Screen Shot 2014-07-15 at 5.21.16 PM

Next click the orange gear Screen Shot 2014-07-15 at 5.21.03 PM to add some content. A very famialure box should appear. This allows us to move our content around and reorganize it very easily.

Screen Shot 2014-07-15 at 5.22.30 PM

Now to add a gallery we will use the [GDLR Shortcode] option… to add a gallery.
The main difference here, why we just didn’t add a “Gallery” before is this will automatically have it so when the images are clicked on they will pop up and let us navigate through.
It is possible using adding it with the page builder option but YOU have to manually click on every image and select what you want ti to do when clicked… and thats annoying. Only draw back with the method we are using here… are the images are a little slower to load as they are actually loading the full quality image as opposed to the resized version. End rant.

So select Gallery…

Screen Shot 2014-07-15 at 4.15.37 PM


The box below should appear. click it to see the options.

Screen Shot 2014-07-15 at 5.30.10 PM Screen Shot 2014-07-15 at 5.30.15 PM

Click the pencil to add images.

Click “Add to Gallery” to the left to select from currently existing images uploaded tot he site.

Screen Shot 2014-07-15 at 5.32.14 PM



Once Completed you are free to continue editing or click the X seen to the right. Remember Save your draft!! and Publish once done.

Screen Shot 2014-07-15 at 5.33.03 PM


A blog is a news feed that will display a number of Posts from a selected category you have chosen. This is really good for high traffic pages, as it serves as a central hub to access the content of your site. You can easily create a new category, tag articles and have them show up exactly where you want them.