Invictus

WordPress Theme Documentation

1. Introduction

Thank you for purchasing Invictus WordPress Theme. Before you get started, please be sure to always check out these documentation files. We outline all kinds of good information, and provide you with all the details you need know to use Invictus Theme.

If you are unable to find your answer here in the documentation, please contact us on our Support Forum or directly from our themeforest account

What is included in the price?

  • Invictus WordPress Theme
  • Child Theme
  • Lifetime Updates
  • Theme Documentation
  • Premium Plugins
  • Premium Support - To our support forum.

Please don't forget to rate Invictus with 5 stars and leave a nice review, it means a lot to us.
Simply log in into your Themeforest, go to Downloads section and click 5 stars next to the Invictus WordPress theme.

2. Theme Installation

The theme is built for use with WordPress 4.6+. We recommend to upgrade to the latest version before proceeding to the installation process.

For an easy installation and setup process, please check our Video Tutorial on YouTube!

INSTALLATION

Unpacking the theme

Before installing the theme, please make sure you unpacked the archive and extracted theme files. After unzipping the archive you will see the following files:

shrine

In case you try to install the wrong files you will get missing style.css file error. This is the most common error meaning you are trying to install incorrect package.

There are 2 ways to install the theme:

  • via FTP:
    1. Log into your web server with FTP client software
    2. Unzip the invictus.zip file and ONLY use the extracted /invictus theme folder
    3. Upload the extracted /invictus theme folder into /wp-content/themes folder
    4. Activate the newly installed theme. Go to Appearance > Themes and activate it.
  • invictus
  • via WordPress:
    1. Login to admin panel.
    2. Navigate to Appearance > Themes and click on the Add New button.
    3. Choose Upload theme option. Click on Browse…(Choose file in Safari/Chrome), select the “invictus.zip” and click Install Now button.
    4. After successfull installation click on Activate or proceed to Appearance > Themes and click on Activate to activate the newly installed theme.
    5. After the theme’s activation you will be prompted to install recommended plugins.All these plugins are included into the theme’s archive or can be installed (optionally) from the WordPress.org repository on your own.
      The theme may function without any of these plugins. But if you want your website look precisely as on demo page, you should install all the recommended plugins and import demo content. This is a good idea if you are building your website from scratch.
      However, if you have an existing website, you should be very careful with plugin installation and importing dummy data – this might affect your site content and structure.
    6. Once it’s done a new menu item Theme Options will appear.

2.1 How to update Invictus theme?

There are two methods to update your theme. These new updates are essential if you want to have a bug free WordPress website with security fixes, new features and improvements to the theme over time. Some of these updates might be needed in order to make the theme compatible with newer versions of WordPress. There is no risk of losing your settings and pages. However if you had made modifications to theme files, they will be lost.

Important Notes:  Please take backup of your website including wp-content folder, wp-config.php and .htaccess and take copy of WordPress database. You can revert back to original site if something goes wrong while you update theme.

Option 1: Update Theme Through WordPress Admin Panel

Please follow below steps to update WordPress theme through WordPress Admin Panel.

  1. First install the Theme Upgrades plugin.
  2. Unzip the file you just downloaded from ThemeForest and locate the WordPress Theme (invictus.zip)
  3. Login to your WordPress Dashboard and Click on Appearance > Themes.
  4. Within the Themes section, on header tab, find and click on “Add New”, then on the header’s second tab, click on “Upload Theme”.
  5. Click “Browse…” and locate the new theme file (invictus.zip)
  6. In the “Upgrade existing theme?” option choose “Yes” from the dropdown list.
  7. Click “Install Now” and after Click “Activate”.
shrine

Option 2: Update Theme Through FTP

Please follow below steps to update WordPress theme through FTP (File Transfer Protocol)

  1. Login to your Themeforest account and go to downloads.
  2. Download the theme to your computer and unzip the item main file.
  3. Locate invictus.zip and extract it. Make sure your unzipping software do not create an extra directory with the same name.
  4. Upload extracted folder into “/wp-content/themes/”.
  5. The FTP program will give a warning that there is an existing directory with the same name, choose to Replace All. It will take between 20 to 30 minutes to replace all files and it depends on your internet speed.
  6. Once all files uploaded, go to WordPress Dashboard and go to Theme options. On the header the theme version will be changed to the latest version.

Invictus MetaBox, Invictus VC-Elements, Visual Composer and Revolution Slider are included in the theme itself. We normally update these plugins whenever we update the theme to have latest versions of plugin. So it is recommended to update these plugins also after updating the theme. Please follow below steps to update these plugins.

Step 1: Login to your WordPress Dashboard and Click on Plugins.

Step 2: Select Invictus MetaBox, Invictus VC-Elements, Visual Composer and Revolution Slider plugins by check marking the checkbox for each item and select Deactivate option from bulk option dropdown at the top left of the plugin listing grid and click Apply button. This will deactivate the selected plugins.

shrine

Step 3: Again select Invictus MetaBox, Invictus VC-Elements, Visual Composer and Revolution Slider plugins by check marking the checkbox for each item and select Delete option from bulk option dropdown at the top left of the plugin listing grid and click Apply button. This will delete the selected plugins.

Step 4: Now go to Appearance > Install Plugins page and here you can install & activate Invictus MetaBox, Invictus VC-Elements, Visual Composer and Revolution Slider plugins to have their latest versions.

3. Theme Requirements

To use this theme you must be running WordPress 4.6 or higher. If you use hosting with limited resources (for example GoDaddy and other lowcost shared hosting providers), you may experience issues with one-click dummy data installation feature.

We recommend you to contact your web hosting service provider to make sure that your server PHP configuration limits are as follows:

  • max_execution_time 600
  • memory_limit (up to) 256M or 512M for creating custom color schemes with LESS CSS compiler.
  • post_max_size 64M
  • upload_max_filesize 64M

If you are running unmanaged dedicated server or VPS, you should check your php.ini file. Alternatively, you can edit .htaccess file in the root of your website and add the following values:

php_value max_execution_time 600
php_value memory_limit (up to) 128M
php_value post_max_size 64M
php_value upload_max_filesize 64M

Setting these values will ensure you will not get error messages during the installation. To safeguard your website, please use secure passwords and the latest version of WordPress and plugins.

IMPORTANT! To avoid any errors that might come up during the installation we recommend to have memory limit set up to 512M.

Here is the list of other recommended web hosting services:

4. Plugins Installation

Step 1:
shrine
Step 2:
shrine

In order to make the theme look exactly as at demo page you need to install the recommended plugins. Click on Begin installing plugins link.

You will be redirected to plugins installation page. Check all listed plugins, select Install option and click on Apply button. Installation may take a few minutes, please be patient and do not refresh the page.

Theme includes the following plugins:

  • Invictus Elements
  • Invictus Metabox
  • Slider Revolution
  • WPBakery Visual Composer
  • Booked
  • Events Calendar
  • WooCommerce

5. Demo Import

  • via WordPress:
    1. Login to admin panel.
    2. Navigate to Appearance > Import Demo Data and click on the import button.
    3. Navigate to Appearance > Import Demo data > Import Sub Pages and click on the import button.

5.1. Revolution Slider Import

    1. Login to admin panel.
    2. Navigate to Slider Revolution > Import Slider and click on the import Slider.
    3. In theme folder Demo Data > Revolution Sliders.

6. Theme Options

Now let’s navigate to Theme Options. It gives you control over most of theme settings from one place. There are quite a lot of parameters here, but luckily the majority of them have default values that suit most of the users.

How it works

First, you should navigate to Invictus Theme Options and set global options that will work throughout the entire site. These settings will be default for all categories, pages and posts of the theme:

6.1. Overview

The following screenshot shows the General tab of the Options panel:

6.2. Saving changes

After you have made some changes in the panel, please don't forget to click the "Save Changes" button located both in the bottom and top section of the panel.

6.3. Restoring default settings

To restore default settings of some particular section you may click the "Reset Section" button that will bring back the default values for that particular section you have opened. If you want to reset the whole panel, go ahead and click the "Reset All" button.

NOTE: some options are "blank (empty)" by default and that means the theme will take the default value in that case. It's not an error.

6.4. Exporting / Importing settings

You may easily export your settings and then import them into another WordPress installation (or just for backup purposes). To do that, visit the "Import / Export" tab:

To export your options, you may either "Copy Data", download the data file or "Copy Export URL".

To import options you also have three different ways and you must choose pick the one that correlates with your export method. For example: If you downloaded the "Data File", you must click on the "Import from File" button.

7. Header

Header is one of the most important parts of any website. This section will provide you with all the information you need to know.

7.1. Header General

Header is the section of the theme that appears on the top of each of your pages and posts:

7.2. Creating Navigation

Your header requires a custom menu to be created for the navigation to work. WordPress comes with a brilliant "Menu" functionality.

To create a new menu, go to Appearance Menus, click on the "create a new menu" button, type in your menu name ("Site Navigation" on the example below) and click on the Create Menu menu button:

After the menu is created, you will presented with this view:

It is important that under the "Display location" you tick the "Primary Menu" checkbox (as shown on the screenshot above) so the theme knows that you want this particular menu to be displayed as the main website navigation. You may go ahead and "Save Menu" after you do that.

Adding new menu items

You may add new items to your menu within the sidebar located on the left on the screenshot above (with the "Pages" heading) - of course you need to create some Pages or Posts first (for that visit the Creating Pages section). There you may tick pages or posts you want to add to your menu and after you click on the "Add to Menu" button, they will be moved to the area on the right:

After you're done adding your menu items go ahead and click the "Save Menu" button. From now on, that particular menu will be shown in your website header as your main website navigation. Cool!

7.3. Header Styling

  • In order to set your prefered navigation layout, go to Navigation Menu → Header Menu Layout section of Theme Options. Here you have list of header layouts to choose from
  • Here you can customize styles and typography for displaying main menu and subnavigation using theme options (see below). You can set any color for main navigation and subnavigation, In the same way you can set your desired fonts to be used in navigation & subnavigation.

MOBILE MENU OPTIONS

7.4. Creating mega menus

Invictus features Mega Menus. The mega menus are available only for top level navigations items only. Just go to Appearance / Menus, edit your site navigation menu and arrange your menu items.

7.5. Top Area

In Invictus you can use top area bar above the main menu area to show some additional information like your contacts, links to social profiles and CTA button. You may see an example on the Hospital and Restaurant demo:

To enable the Top Bar section, go to Theme Options / Navigation Menu / Top Bar and enable the "Top Bar" switch so it looks like above:

8. Page Banner

Here you can customize styles and typography for displaying Page Banner and page title using theme options (see below).

You can make following:
  • add custom background image/color for page title area
  • enable / disable breadcrumbs
  • Page banner height
  • Page title typography

9. Blog Options

Setting up Blog post options

  • You can set the sidebars on posts inner pages - to no sidebar, only left or right
  • You can set all the properties of page banner as mentioned above for posts inner pages.

9.1. Blog Posts

At the beginning, we're going to show you how to create single Blog posts. Each of them can represent your single project/work. You may create new posts by going to Blog / Add New tab in the WordPress side navigation or clicking the "New / Blog" link in your WordPress admin bar:

A new Blog post creation page looks like the following:

9.2. Blog Page

When you're done creating your posts, it's time to display them in a nice grid on your website.

  • Page Builder - you may create as many pages with a posts as you wish with a "News & Blog" component available in the Visual Composer page builder.

Posts Page with Page Builder

You may create a Post page using a "News & Blog" component available as one of the elements in the Visual Composer page builder. Just create a new page, enable the Page Builder (click on the blue Backend Editor button):

Click Add Element to add a new element:

and choose the "News & Blog" component:

The element has just been added to your page builder content. Whenever you add a new element, a settings page will appear. For the "News & Blog" it looks like this:

And... that's basically it. You may save and preview your page. If you decide to create your Post page this way, keep in mind that it's going to display posts from all categories.

10. Portfolio Options

Setting up portfolio theme options

  • You can set the sidebars on portfolio inner pages - to no sidebar, only left or right
  • You can set all the properties of page banner as mentioned above for portfolio inner pages.
  • You can set the call to action section for portfolio inner pages with title, subtitle, button text, button link and background image options.

10.1. Portfolio Posts

At the beginning, we're going to show you how to create single portfolio posts. Each of them can represent your single project/work. You may create new posts by going to Portfolio / Add New tab in the WordPress side navigation or clicking the "New / Portfolio" link in your WordPress admin bar:

A new portfolio post creation page looks like the following:

10.2. Portfolio Page

When you're done creating your portfolio posts, it's time to display them in a nice grid on your website.

  • Page Builder - you may create as many pages with a portfolio as you wish with a "Portfolio" component available in the Visual Composer page builder.

Portfolio Page with Page Builder

You may create a portfolio page using a "Portfolio" component available as one of the elements in the Visual Composer page builder. Just create a new page, enable the Page Builder (click on the blue Backend Editor button):

Click Add Element to add a new element:

and choose the "Portfolio" component:

The element has just been added to your page builder content. Whenever you add a new element, a settings page will appear. For the "Portfolio" it looks like this:

And... that's basically it. You may save and preview your page. If you decide to create your portfolio page this way, keep in mind that it's going to display portfolio posts from all categories.

11. Widget

Sidebar is the perfect way to make the necessary information always available to the visitor. Theme comes with saveral default sidebar - e.g Left sidebar, Right Sidebar, footer columns etc..

  • They are suitable on blog and shop pages, allow to navigate the site easily and find the needed information faster.
  • You may find the Sidebars and Widgets in Appearance > Widgets section.

Theme widgets can be set in the Appearance > Widgets section.

widget

12. Team Options

widget

13. Footer

This section covers all information required for you start with your website's footer.

Footer is the area located at the very bottom of your website. If you haven't imported any demo site yet then you will be presented with this view:

  • You can set the footer variants on the whole site - to Standard footer with Widgets, Standard footer with Visual Composer modules inside, or Disable footer on the whole site.

Footer Widgets Area is by default not visible (if you haven't imported any demo sites). In order to show it, you need to add some widgets. To do that, go to Appearance / Widgets menu and drag some widgets into Footer 1-4 widget areas:

  • Set the footer page to make it display as footer on the site; for Standard footer with Visual Composer modules inside footer style only.
  • here you can enable / disable subfooter
  • You can add the copyright message in the field; HTML formatting is accepted.
  • here you can change typography, background image/color for subfooter

14. Visual Composer Elements

Testimonial:

Team Members:

Counter Box:

News & Blog:

Portfolio:

Pricing Table:

Twitter Feeds:

Image Gallery:

Buttons:

Product Category:

15. Invictus Templates

One of the greatest theme features are "Invictus Templates". They give you access to over website sections that will allow you to create complete pages in a matter of few mouse clicks. Please check the instructional gif below to learn how to use them:

Using Invictus Templates

You may use Invictus Templates on any page that is supported by the Visual Composer Page Builder (the WPBakery Visual Composer & Invictus Elements plugin must be installed and activated).

To begin, just activate the Page Builder on your page by clicking on the blue "Backend Editor" button:

When you activate it, you should see a blank page builder page as in the following screenshot:

You may add a new template by clicking either a template icon in the upper left corner (marked as 1 on the screenshot above) or by clicking on the "Add Template" button (marked as 2).

After clicking any of them, you will be presented with the Templates library popup window:

  • 1.Templates Categories - you may easily filter all sections by clicking a desired category name.
  • 2.Bigger Preview - When you click it, a bigger preview of a specific template will be displayed.

When you're decided with a template, just click and it will be imported directly to a page you're editing, like that:

You may import as many templates as you want.

Note: As you may see on the screenshot above, the image thumbnail has not been automatically generated. That's because the image is hosted on our server (we don't want you to get bloated with new images every time you load a template). This way the process of importing templates is also faster.