Adding Pages

The process of adding pages is quite similar to adding posts:

1. Go to Pages > Add New

2. Enter a title and some content.

3. Select a page template or leave the default (more on this just after).

4. Change the settings for the page header (optional).

5. Write a few words excerpt (it is good for search results and SEO to have an excerpt, no matter what kind of content do you have in your page).

6. Hit “Publish” and you’re all done.

Header Options

All pages have this option for a custom header. You can show or hide the title (it will still be in the DOM for SEO purposes) or add some media, like an image or revolution slider instance. The options are pretty intuitive, so please read the descriptions to learn how to use everything..

Visual Composer

This theme is based on a “modular grid”, achievable with the Visual Composer. It might take a while until you get this entire modular concept, but once you get the idea it will be really use to understand how it all works.

For starters, you should watch this video screencast to see everything in action! 

Each column will be a module that will extend it’s height to match the height of all siblings. So the first step is to add some columns. In these columns you can insert any of the available elements, such as images or text blocks. When you insert an element and preview if you’ll see that it has a certain amount of padding around it and a white background. These are added by default by the theme, but you can modify these values for each column, by editing the column and set new values.

Most things that you need to modify are the paddings and the backgrounds (other controls might not have the best results but you can try). You can add paddings both in px or percent, change all paddings, change only some, etc.. The same goes for backgrounds: you can have a solid color background or an image displayed in the form of a cover (filling the module) or a pattern (repeatable background).

Note that these paddings that you set will be divided by two for screens lower than 960px, in order to ensure maximum responsiveness. So if you have a column with 100px padding at the top, on smaller screens this column will only have 50px padding at the top, and so on.

Inside the columns you can add any kind of content, so get creative with the available options! For images, sliders, video elements added through iframes you should use columns with 0 padding on all sides, while other kinds of content should have a certain amount of whitespace.

Take a look at the screenshot below to see how to edit a certain column:

Page Templates

As you might already noticed, there are a few Page Templates available for you to use. Each template will configure your page to look and act in a different way.

1. Default Template

This is the default template and it outputs exactly the content of the page, without any modifications.

2. Blog

This page outputs all the posts that you have in your blog.

3. Contact

This one has a map available in it. Note that the content (contact form) still needs to be added separately (via shortcodes), but this page template is the starting point for any contact page. The map is configured in the  Map Options and each field is properly detailed, so you shouldn’t have any issues with this.

4. Portfolio

This page displays a certain amount of portfolio projects. The style and contents of each portfolio page can be set when editing the page, using the available options.

5. Gallery

This page displays a lightbox gallery of images within a masonry grid. The grid options are the same with the portfolio options, so please read below about how these work, but you should stick with the simple masonry or classic grid options and just upload large images and let the theme do the rest.

UP NEXT: Adding projects