Loading...

General


We would like to thank you for purchasing stoic. We do really appreciate that you have chosen Stoic for your website. Before you get started, please look into this documentation. You will find it helpful and understandable through your usage and troubleshooting. We have outlined all the good information and provided all the details to use Stoic. Stoic can only be used with WordPress. We assume that you have a properly installed WordPress on the hand. If not you can look here.

WordPress Information


To install this theme in your website, you will need to have a proper WordPress setup in your server. If you need help to install WordPress in your server, you can follow the instructions in WordPress Codex. Some necessary link are given below regarding WordPress information.

Requirements for Stoic


To use Stoic theme you will need WordPress 4.4 or above and a server configuration compatible for regarding WordPress version. Here are few things you should check to ensure your host is fit to comply with.

  • Check to ensure that your hosting server meets the minimum requirement to run WordPress.

  • Always make sure they are running the latest version of WordPress.

  • You can download latest version of the WordPress from here.

  • Always create secure login credentials for FTP and database.

Theme Installation


You can install Stoic theme in two ways, through WordPress and through FTP. The stoic.zip is the file you will need to get the theme installed.

WordPress Installation


How to install Stoic through WordPress

Navigate to Appearance > Themes

Go To Themes Page

Click Install Themes and click the Upload button.

Go To Themes Page

Navigate the stoic.zip file on your computer and click “Install Now”

Go To Themes Page
Go To Themes Page
Go To Themes Page

Activate the newly installed theme by going to Appearance > Themes and clicking the Activate button.

After activating the theme you have to install and activate required plugins to use the theme. You will find the instructions to install plugins Here

FTP Installation


How to install Stoic through FTP

  • Log into your hosting space via an FTP software.
  • Unzip stoic.zip file and ONLY use Stoic theme folder.
  • Upload the Stoic theme folder to wp-content > themes folder.
  • Activate the theme by going to Appearance > Themes and clicking the Activate button.
  • Install and Activate the required plugins by following the instructions provided Here.
FTP Install Image

Plugin Installation


How to install required Plugins for Stoic

Stoic has 4 plugins included in the theme that need to be installed and activated in order to use the theme: Visual Composer, Metabox, Metabox Tabs and Disquss. All of them are required for the theme to work. When you install and activate the Stoic theme you will get a notification message to install and activate these plugins. Click on Begin installing plugins and you will be taken to plugin install page.

Plugin Installation Notification

In the plugin installation page, you will find a list of plugins similar to the following. Check all 4 plugins from the list. Select Install from Bulk Action dropdown menu and click on Apply button.

Plugin Installation Notification

After that you will be redirected to the following page. Click on Return to Required Plugin Installer to go to plugin installation page and activate the plugins. In the Plugin Installation page, check all the plugins. Select Activate from Bulk Action dropdown menu and click Apply button.

Plugin Installation Notification
Plugin Installation Notification

At the end, you will get a confirmation message like the following. If you get it and no error is showing then you are good to go. Your theme installation is ready to go to build your site.

Plugin Installation Notification

Customizer Settings


Stoic theme implemented it's theme settings with Customizer following WordPress standard instructions. You can change several things using this settings. Controls that are provided through this settings besides WordPress Standard Customizer Settings are: Logo, Adding Custom CSS, Blog Layout, Portfolio Archive Page Layout and Footer Content Settings. Settings are described breifly below.

Customizer Screenshot

Logo


To change Logo you have to follow the following steps:

  • Go to Customizer > Site Identity.
  • Click Select Image button from Upload a logo section.
  • Select an image from gallery or Upload a new one.
  • Save Customizer Settings and you get your new logo for the site.
Customizer Logo Settings

Custom CSS


To add custom css you have to follow the following steps:

  • Go to Customizer > General.
  • Enter your own CSS in Custom CSS text area.
  • Save Customizer Settings and you are done!!
Customizer Logo Settings

Google Map API Key


To add google map API key you have to follow the following steps:

  • Go to Customizer > General.
  • Enter your own Google Map API Key in Google Map API Key text area.
  • Save Customizer Settings and you are done!!
Customizer Google Map API Settings

Blog Settings


We have included settings to change layout for blog archive page and sidebar positioning here. To access this settings you have to go to Customizer > Blog.

Blog Layout


To change Blog Archive Page Layout, go to Customizer > Blog. You will find a Dropdown Menu named Blog Layout. Choose preferred sidebar position and save customizer settings. If there is a sidebar available for Blog Pages it will show in your preferred position.

Customizer Logo Settings

Blog Sidebar Position


To change Blog Archive Page Layout, go to Customizer > Blog. You will find a Dropdown Menu named Blog Sidebar Position. Choose preferred layout and save customizer settings. You are good to go with new layout for Blog Archive Page.

Customizer Logo Settings

Portfolio Settings


Portfolio Archive Page Header Image


To change the header image of the Portfolio archive page you have to go to Customizer > Portfolio Settings. There you will find a section named Portfolio Archive Page Header. Click on Select Image button and select an image from the Gallery or upload a new image. Then save customizer and you will get a new header image for Portfolio archive page.

Portfolio Layout Settings

Portfolio Archive Page Layout


To change the layout of the archive page you have to go to Customizer > Portfolio Settings. There you will find a dropdown menu named Portfolio Layout. Select your preferred layout option from there. Then save customizer options and you will get your new Layout.

Portfolio Layout Settings

Header


Header is probably one of the first things you would like to setup in your site. Header consists of pretty much everything that lies on the top of a page, including Menu, Header Image, Header Text, Video Background in the header section, Slider in the Header section etc. We have added extensive way of managing the header section Stoic theme.

There is a settings panel for managing header style at the bottom of each page. There you can change the header style of a page and set up a header for each page.

Header Settings

The header styles are:

Header Styles

There is two variation for each header type. They are Full Screen and Classic. You will find a checkbox in the Header tab of Page Settings section of the editor. If you check the option then the header section will be full screen height otherwise it will be in classic mode.

Video Background


To enable Video Background for header section, go to page settings in the bottom of page editor. From there, select Video Background option from Header Type selection menu. Then insert the configuration information in the Video Background tab there.

Video Background Options

In Video Background tab, you will find several options to configure video background properties.

  • Youtube Video Url - you have to put your youtube video tutorial in this field.
  • Mute Video - you can select if the video needs to be muted or not. If you check this box the video will be muted, otherwise it will play with sound.
  • Autoplay Video - this option determines whether the video will start playing automatically after the page loaded.
  • Loop Video - this option determines whether the video will keep playing in a loop.
  • Start At - you can control from when the video will start playing. If you put a value there, the video will skip prior to that time.
  • End At - you can control when the video will stop playing. If you put a value there, the video will stop playing at that time or loop to the startng point of the video.

Sliders


To enable Sliders for header section, go to page settings in the bottom of the page editor. Select Slider option from Header Type selection menu under Header tab. Then go to Slider tab. Select the slider you want to show in the header section from Sliders option. Update the page and you are good to go. If you don't know how to set up a slider then go to this section and see how you can set up a slider for a page.

Header Slider Settings

Text Rotator


To enable Text Rotator for header section, go to page settings in the bottom of page editor. Select Text Rotator option from Header Type selection menu under Header tab. Then go to Text Rotator tab. You will find three text input field here.

Header Text Rotator Settings
  • Title text before rotator - in this field you will put the text that needs to appear before rotator texts.
  • Title text after rotator - in this field you will put the text that needs to appear after rotator texts.
  • Rotator Text - in this field you will put the words that you want to animate - displaying one at a time. Put the words in this field, separated by comma.

Update the page and you are good to go. If you want to show an image as the background of header section, then set a featured image and it will appear as a background of text rotator in the header section.

Sliders


You can add image sliders in the header section of a page. To add a slider image to your header section, you have to create a slider and then set it as a header in the page settings. There are two type of components in Sliders. They are Zion Sliders and Zion Slides. Sliders consists of multiple slides. First you have to create a Slider to contain slides. Then you have to create some Slides and assign them to one or multiple Sliders just like you add blog posts to categories.

Z ! O N Sliders


First go to Dashboard > Z!ON Slides > Z!ON Sliders.

ZION SLIDER ENTRY

You will find a form there to add new slider. Fill up the form and click Add New Slider. It will show it on the list right side of the page.

SLIDER LIST
New Slider

Z ! O N Slides


First go to Dashboard > Z!ON Slides > Z!ON Slides.

You will find a list of slides here. To add new slides click Add New button and it will take you to slide editor.

Fill up the editor with necessary information.

Add a featured image for the slide. This is the image that will show in the header section of the page.

Select a slider from the box titled Z!ON Sliders.

Click Publish or Update depending on whether you adding new slide or editing an old one.

Builder


Stoic theme uses Visual Composer as it's default page builder. You can build pages with awesome design and layouts with it. We have created some amazing UI blocks and integrated them with Visual Composer for you. You can access the page builder from Page or Post editor.

To access page builder option, go to Page/Post Editor. There you will find two buttons on the top of WYSIWYG editor of wordpress called, Backend Editor and Frontend Editor. You can choose any of them to access the page builder.

There you will find a plus ( + ) button at the top right corner of the page. Click there to access the UI components from Visual Composer builder. It will prompt a pop up window where you can select UI components and add them to your page.

In that pop up selection window, there is a tab called Reign Blocks. There you will find our custom made UI Blocks compatible with Visual Composer, which you can use to add Reign UI Blocks to your page.

For further details on using Visual Composer please check out the official documentation for Visual Studio here.

Portfolio


We have added Portfolio in this theme. You can add and manage your portfolio with this theme with ease. To add new themes you will need to follow the following steps.

Add Portfolios


First go to Dashboard > Z!ON Portfolio.

Click on Add New button on the page or at the left side menu under Z!ON Portfolio. There you will find an editor to add new portfolio.

In the editor, you will find several input fields besides traditional WP Post/Page editor fields. I am going to guide you through them below.

Project Summary input field let you put a short description of your project. You can put a short description,

Project Story input field let you put a detailed description of your project. You will get a WYSIWYG editor for this. You can add text, images, videos and other types of content for this section.

Project Details section contains three input fields letting you to add Client's Name, Date of the project completion and an Url to the project.

Project Images section let you select images of the project. You can select multiple images and they will show as a slider in single portfolio page.

Portfolio Categories section gives you a set of checkboxes where you can select categories to assign the project under a certain category or multiple categories.

Portfolio Preview section let you select a preview image which will be displayed in portfolio archive page or any page where you use a portfolio showcase block from builder component.

Add Portfolio Category


To add a Portfolio Category, go to Dashboard > Z!ON Portfolio > Portfolio Category.

You will find a form to add new Portfolio Category here. Fill up the form and click Add New Category button.

To edit existing category's properties hover on the title of category from list, you will find Edit button. Click on that button and you will be taken to another page with an edit form. Edit the neccessary information there and click Update button.

Widgets


We have added several widget area option in Stoic theme. If you want to know how to add widgets to different widget areas, please check the official documentation provided by WordPress here. There are three types of widget area in this theme. They are discussed briefly below:

  • Blog Sidebar - Widgets added in this area will be shown in sidebar in blog posts, blog archive pages and blog category and tag pages.

  • Portfolio Sidebar - Widgets added in this widget area will be shown in the sidebar of portfolio archive pages, single portfolio pages and portfolio category pages.

  • Footer Widgets - Footer widget areas contain contents for footer area. There can be 1 to 5 footer widget area depending on the settings in customizer option. You can check out the customizer options here. The number of footer widget areas indicates the number of columns in the footer.