IshYoBoy - LOOKIN' FO' DESIGN? TEMPLATE? THEME?
PREMIUM WORDPRSS THEMES & PLUGINS

Web: ishyoboy.com
Twitter: @ishyoboydotcom

Thank you for purchasing one of our items.
We really appreciate it.

Support requests:
http://support.ishyoboy.com/

Any questions in general:
hello@ishyoboy.com

Documentation

Inverto WP - Minimal WordPress Theme

Premium Theme Setup
Tip: Are you a WordPress beginner?
Let us Install & Setup the theme for you, hassle-free →
Table of contents
  1. General overview
  2. First steps
  3. Page Builder Elements
  4. Creating & Managing Content
  5. Theme License Key
  6. Update Instructions
  7. Sources and credits
  8. Change Log
1. General overview

Before you can start enjoying your new theme, let's see what the Inverto zip file includes:

  • Documentation - You are currently reading the file in it :)
  • Demo Content - XML file with pre-defined content for manual import
  • Child Theme - Starter child theme for future theme modifications
  • Theme Zip - Zipped version for the built-in WordPress Theme Uploader
Top
2. First steps

To be able to use Inverto WordPress theme please follow all of these steps:

Tip: Are you a WordPress beginner?

If you're looking for WordPress theme installation and Setup to look exactly like the live theme demo and do not feel comfortable to go through all the steps below - then we're here to help.

Let us Install & Setup the theme for you, hassle-free →
Top
1. Install WordPress

Please download and install the latest WordPress version on your server from wordpress.org. If your hosting provider does not provide an automatic "one click" WordPress install, here is a little tutorial to help you do it manually:

If you haven't worked with WordPress before, check these tutorials in order to learn at least the minimum WordPress basics.

Top
2. Install both "Inverto" and "Inverto Child" themes and activate the child theme

Option 1: WordPress Theme Uploader

  1. After having WordPress installed, log into the admin area.
  2. From the left sidebar click on Appearance, and click on Themes.


  3. Now click on the Add New button.


  4. Click on the Upload Theme button.


  5. Click on the Choose File button and locate the unzipped Inverto archive in your computer. Select the inverto.zip file.


  6. Click Install now and wait until the install process is ready.
  7. If you get the "Are you sure you want to do this?" message, it means you have an upload file size limit and you should either install the theme via FTP (see "Option 2" in this step), or call your hosting company and ask them to increase the limit (provide this information: "upload_max_filesize" and "post_max_size" and ask them to set it to 40MB).
  8. Repeat all the steps and install the inverto-child.zip from the unzipped Inverto archive
  9. Both Inverto and Inverto Child should now be available for activation
  10. Hit the Activate button next of the Inverto Child theme.


  11. Voila! The theme is now activated and ready to use!

Option 2: FTP upload

  1. Connect to your FTP account using an FTP client (Total commander on a PC, Transmit or Cyberduck on a MAC). Navigate to your WordPress installation directory and enter wp-content\themes folder in it.
  2. Now, in a second window, browse the files in your computer and locate the contents of the unzipped Inverto archive and the Theme Zip folder.
  3. In it, you will find a file called inverto.zip. Unzip it and you should have a folder called inverto. To be 100% it's the right folder, it should contain functions.php and style.css directly in it.
  4. Just upload the inverto folder to wp-content\themes.
  5. Now find the "Child Theme" folder in the unzipped Inverto archive.
  6. In it, you will find a folder called inverto-child.
  7. Just upload the inverto-child folder to wp-content\themes.
  8. After having both themes uploaded, log into the admin area.
  9. From the left sidebar click on Appearance, and click on Themes.
  10. Both Inverto and Inverto Child should now be available for activation
  11. Hit the Activate button next of the Inverto Child theme.
  12. Voila! The theme is now activated and ready to use!

This was the last step needed for a correct installation of Inverto WordPress theme.
Now please follow these additional steps in order to make Inverto WordPress theme look and work correctly.

Top
3a. Install "WPBakery Visual Composer", "IshYoBoy Freelo Assets" & "Contact Form 7" plugins

Navigate to "Appearance -> Install Plugins" or click the "Begin installing plugins" link in the Notification area. Install and activate both plugins.


WPBakery Visual Composer and IshYoBoy Inverto Assets plugins are mandatory for the theme to run correctly. They will add the portfolio functionality and all content elements which can be used to build your pages' content.

Contact Form 7 plugin is used for the main contact form. It has an excellent documentation so please follow it to set-up the plugin correctly. After you are done with the installation, you will find a new "Contact" link in the left navigation sidebar. This is the basic "Contact Form 7" form that is used on the site: 

<div class="ish-row">
   <div class="ish-grid4">
      <p>[text* your-name placeholder "Your Name *"] </p>
   </div>

   <div class="ish-grid4">
      <p>[email* your-email placeholder "Your Email *"]</p>
   </div>

   <div class="ish-grid4">
      <p>[text* your-web placeholder "Your Web"]</p>
   </div>
</div>

<div class="ish-row">
   <div class="ish-grid12">
      <p>[textarea your-message placeholder "Your Comment"]</p>
   </div>
</div>

<div class="ish-row">
   <div class="ish-grid12">
      <p>[submit class:ish-cf7-submit "SUBMIT COMMENT"]</p>
   </div>
</div>

Note: Whether you decide to use the default CF7 configuration or to import the demo one in the next step. Do not forget to set the e-mail to which all filled contact forms will be sent. To do it, navigate to "Contact -> Contact Forms" and edit the contact form you want to change.

Set the e-mail
3b. Install "Revolution Slider" & "Layer Slider" plugins

Note: Installing Revolution Slider or Layer Slider is optional. You can skip this step and continue to import data and get back to it later.

If shipped with the theme, Revolution Slider & Layer Slider can be found in the "Plugins" folder within the zip file downloaded from ThemeForest. If the folder is empty or does not exist, it means the sliders are not shipped with the current theme. Please unzip/extract these files as they contain not only the sliders, but also documentation and additional files. Uploading the ZIP files directly, without unzipping them, will result in unnecessary errors.

Once unzipped, install the plugin you need, by uploading the "revslider.zip" for Revolution Slider or "layersliderwp-x.x.x.installable.zip" for Layer Slider, using the standard WordPress plugin installer located under "Plugins -> Add New" within the main WordPress navigation and the under "Upload Plugin" button.

To learn how to work with Revolution or Layer Sliders and how to import the demo sliders, please go through their documentation. It can be found within the previously unzipped/extracted folders within the "Plugins" folder. The demo sliders, available for this theme, can be found inside the "Demo Content" along with all other demo files.

Top
4a. Import and set everything automatically


AUTOMATIC IMPORT:

This step is highly recommended as you will be able to see all pages and elements used correctly exactly as in the online preview.
It can spare you a huge amount of time and sweat drops. We've warned you. The decision is up to you now.

BEFORE THE IMPORT:

Please, increase the maximum execution time of your PHP server to "600" seconds. This can be done by:
- manually editing the "php.ini" file and setting the "max_execution_time" variable.
- changing the value in the administration panel of your website if such panel is provided by your hosting provider.
- contacting your Hosting provider's support team to help you with it as they know exactly how to set it.

Ensure "IshYoBoy Inverto Assets" and "Contact Form 7" are installed and activated

To avoid unnecessary errors and headaches during the import, please make sure "IshYoBoy Inverto Assets" and "Contact Form 7" are installed and activated under "Appearance -> Install Plugins" before importing the demo content.

Ensure "Wordpress Importer" is not installed or activated

To be able to automatically import all the premium features, such as widgets, megamenu, etc... please make sure "Wordpress Importer" is not installed or activated under "Plugins" before starting the automatic import.

If you plan to import the E-shop demo, please ensure "WooCommerce - excelling eCommerce" is installed and activated

If you want to import the content of our live demo e-shop, please make sure WooCommerce plugin is installed and activated as well. To install it, head to "Plugins -> Add new", use the search functionality to look for "woocommerce" and install the "WooCommerce - excelling eCommerce" plugin.

Please, skip installing woocommerce essential pages ( Shop, Cart, Checkout, My Account ) inside woocommerce wizard to avoid duplicating these pages after they get imported.

Skip install woocommerce pages

You have to set these imported pages for woocommerce after the demo content was successfully imported.

Shop page: "WooCommerce -> Settings -> Products -> Display -> Shop & Product Pages -> Shop Page"
Cart page: "WooCommerce -> Settings -> Checkout -> Checkout Options -> Checkout Pages -> Cart Page"
Checkout page: "WooCommerce -> Settings -> Checkout -> Checkout Options -> Checkout Pages -> Checkout Page"
My Account page: "WooCommerce -> Settings -> Account -> Account Pages -> My Account Page"

If you need tochange woocommerce colors, you can install the WooCommerce Colors Plugin for that. It allows you to change the colors of the buttons and other elements in WooCommerce.

Colors for E-shop demo:

Primary Color - #eb7859
Secondary Color - #f7f6f7
Highlight Color - #f2463e
Content Background Color - #ffffff
Subtext Color - #bac2c4

Make sure to update the woocommerce image sizes before importing the demo data. Navigate to "WooCommerce" -> "Settings" -> "Products" -> "Display" tab and scroll down to "Product Images". Please set the size as per the table below. If you skip setting the image sizes, the images might appear blurred and you will have to re-generate them using the Regenerate Thumbnails plugin at a later time.

Image Type Image Size Hard Crop
Catalog Images 260 x 350 Yes
Single Product Image 510 x 680 Yes
Product Thumbnails 180 x 180 Yes


Use the One Click Import provided by the theme

Navigate to "Appearance -> Theme Options" or click the "Theme Options" link in the admin bar and enter tha "Demo Data Import" tab. Ensure all necessary plugins are installed and active. Now click the "Import Demo Content" button, sit back and wait until the process is finished.



Once successfully imported, skip the next steps and jump directly to step 9.

4b. Import and set everything manually


BEFORE THE IMPORT:

Please, increase the maximum execution time of your PHP server to "600" seconds. This can be done by:
- manually editing the "php.ini" file and setting the "max_execution_time" variable.
- changing the value in the administration panel of your website if such panel is provided by your hosting provider.
- contacting your Hosting provider's support team to help you with it as they know exactly how to set it.

Navigate to "Tools -> Import" then click "Wordpress" and install "Wordpress Importer". After installation choose the correct demo xml (e.g. "theme_minimal.xml") located in the "Demo Content" folder and import the XML file. In the next step select "Download and import file attachments" and press "Submit".

As our demo content consists of many pages and images, if you decide to download all attachments, this action might take up to few minutes based on your internet connection speed and server configuration. Therefore please wait while everything loads. If for any reason the Import freezes and fails without the "All done, have fun" message, please upload and import the xml file again until you get the message.

Top
5. Change permalink style


! Ignore this step if you have used the Automatic Import in step 4a.

Navigate to "Settings -> Permalinks" and under "Common settings" choose "Post name".

Change permalinks

Top
6. Set up home page and blog


! Ignore this step if you have used the Automatic Import in step 4a.

Navigate to "Settings -> Reading" and under "Front page displays" set "A static page". As "Front page" set "Home". As "Posts page" set "Blog".

Set up home page and blog

Top
7. Create a navigation Menu and set it


! Ignore this step if you have used the Automatic Import in step 4a.

Navigate to "Appearance -> Menus". If no menu exist please create a new one and add you pages to it.
Do not forget to set it to be used in "Main menu" area. Ignoring this step might lead to navigation problems and its incorrect display. For more information about WordPress menus, please visit http://codex.wordpress.org/Appearance_Menus_Screen

Top
8. Set up widgets

! Ignore this step if you have used the Automatic Import in step 4a.

First of all navigate to "Appearance -> Widgets". On the left, there is a set of widgets that can be used. On the right side you can find a list of all pre-defined sidebars.

Theses sidebars can be used on several Widgetized (Sidebar) areas throughout the whole webpage. Inverto comes with the following set of widgetized areas:

  1. Expandable area - on all pages
  2. Blog Sidebar area - Left or Right blog sidebar - used on Blog pages only
  3. Portfolio Sidebar area - Left or Right portfolio sidebar - used on Portfolio pages only
  4. Woocommerce Sidebar area - Left or Right woocommerce sidebar - used on Woocommerce pages only
  5. Footer - Main footer area used on all pages

Widgetized areas

All these areas can be set globally for all pages from "Appearance -> Theme Options", but can also be customized on every single page. This is where the "Unlimited Sidebars" Inverto feature comes in handy. You have the possibility to create unlimited number of sidebars under "Appearance -> Sidebars" and then decide in which area to use them.

Custom Sidebars on every page

The order is to firstly create new custom sidebar under "Appearance -> Sidebars" by clicking on "+ Add Sidebar" button, Then navigate to "Appearance -> Widgets" where you'll see your freshly created sidebar in the right column. Now simply add the widgets you want and define their widths. Once done, navigate either to "Appearance -> Theme Options" and set the Sidebar to be used in the widgetized area you wish, or navigate to the exact Page, Blog or Portfolio and set it there for the given page only.

Unlimited sidebars

Enough theory! To finish the setup of widgets we recommend to remove all widgets from all widgetized areas. This makes all the areas clear and ready for Inverto WordPress theme widgets.

Once all widgets are set in the "sidebars" it's time to decide where to display each area. Inverto provides the opportunity for you to manage all widgetized areas and decide which sidebars to display in them. Navigate to "Theme Options" and in each section "Header Options"

All custom Inverto Wordpress theme widgets are marked with yellow icon right to the titles.

Top
9. Set all "Theme Options"

Inverto provides advanced theme customization interface under "Appearance -> Theme Options". Please go through all settings and tweak them to your needs. The settings are self explanatory but you can also find description next to each option.

Theme Options

Top
3. Page Builder Elements

Inverto comes with an outstanding set of content elements available to help you assemble the content just in seconds. Whether you are a developer or a newbie you will be able to make thousands of combinations. All elements are integrated using a custom Drag and Drop Page Builder and are extremely easy to use.

When editing any page or post detail, just click on the yellow "Switch to Page Builder" button located above the default WordPress Visual Editor. This will transform the default editor into a drag and drop page builder. Click the "Add element" button and choose from the provided list of available elements.

Page Builder

Choose from the list of all available page elements to easily assemble the page layouts you are trying to achieve. For regular text choose the "Text Block" element and start typing the text you would like to appear on the page. Take your time to explore all available elements as these will be the building blocks for your website.

Page Builder

All the content is organized in rows and columns. You need to use a row in order to be able to add any content to the page. The row element has its own settings which can be edited to set the background color, text color, choose row decorations and behavior, add parallax effect or video for the background, etc.. Make sure to explore all row settings so you can be able to use the full power of the theme.

Page Builder

Once a row is placed, the content can be divided into one, two, three or more columns. Just choose the right layout for the current row and then add all the content into each column.

Each element has its own settings with descriptions to help you understand what they do. Make sure to scroll down to the complete bottom to see all available options.

Page Builder

Well, this is it. You have the basics necessary to create your own content. So go ahead, explore each page element and its options and create beautiful pages. Have fun!

4. Creating & Managing Content
Page Content

All the content on all pages is managed through the Page Builder. Whether it's a Blog Post, Portfolio Item or Regular Page, all the content can be created using the page builder. Inverto provides advanced "Grid System" for perfect content positioning along with dividers and separators to add more space to the design of each page.

Top
Page Settings

By default every page uses the "default", global options managed under "Appearance -> Theme Options". In some cases a custom setting is needed which differs from all other pages. This is when "Page Settings" can be used.

There are a few meta-boxes allowing you to control the layout of the current page, the breadcrumbs, sidebar, etc..

Top
SEO Options

Inverto was built following the most up to date SEO best practices. It was built to play well with the amazing WordPress SEO by Yoast plugin but can also be combined with any properly-coded SEO plugin.

Top
Pages - Creation and Editing

If you have followed the documentation until here you already know everything about the content management of pages.

Top
Portfolio - Creation and Editing

Before starting with the portfolio creation, please decide whether you'll use 1 portfolio or several portfolios. If the latter, different portfolios will be represented by portfolio categories, therefore it's necessary to use categories nesting.

The portfolio or portfolios can be displayed on any page by using the Portfolio element, which provides a great level of customization plus it inherits all its options from the global, "Theme Options". Please create a Portfolio page, set it as the main portfolio page in "Theme Options", set all "Portfolio Options" and use the page builder's "Portfolio" element to make the page display the portfolio.

Creating the single Portfolio items is as easy as creating any page. There is no layout restriction, use elements to create any layout you wish. There is a set of Portfolio only elements which can be used to display the dynamic content within a single portfolio item: Portfolio Gallery, Portfolio Links, Portfolio Categories.

You are provided with an absolute freedom within the content. Use the "Media Embed" element for Videos and other Media, add Images, Slideshows, columns, menus...

Adding images gallery to a portfolio single item and managing the images order is very simple and intuitive. Just use the "Image Gallery" page element and place it wherever it fits best your current portfolio item layout.

The sidebar settings if set to "Default Setting" are inherited from "Portfolio Options" Tab under "Appearance -> Theme Options".

NOTE: Every Portfolio item needs to have "Featured image" set as this will be used to represent the item. Always upload the images in high quality. Inverto will then optimize them.

Editing the portfolio single item settings

Top
Blog Post - Creation and Editing

The content of every Blog post is a free field and all content elements can be used to create the content and the desired layout. If set in "Theme Options" social share buttons will be displayed after the content. If not, they can be entered inside the content via the "Social Share Bar" element.

For every Blog post a Post Format can be set and so:

  • Standard - Text only posts.
  • Image - Text and Image posts. You can set a featured image to represent the post.
  • Audio - Use the Audio settings field to enter the mp3 url, featured image can be used.
  • Video - Use the Video settings field to enter the url, embed code or self-hosted video. Featured image will be used as a backup if no video is provided.
  • Link - Use the link settings to enter the URL and the Text for the link. Featured image can be used
  • Quote - Use the quote settings to enter the quote and author. If content is provided it will be displayed after the quote. Featured image can be used as well.

Post Audio

Post Video

Post Link

Post Quote


Top
Expandable area

The Expandable area is controlled in Theme Options and can be either disabled or displayed on all pages.


Top
WPML - Multilingual CMS

Inverto theme is compatible with the great WPML - Multilingual CMS WordPress plugin. In case you and your business need a multilingual site, WPML is the solution. Not only you can provide different language versions of pages and content, but the "Theme Options" are per-language, which means you can completely change the look and settings of the website for every language.

If you are new to WPML please refer the official website and the Getting Started Guide.

NOTE: We strongly recommend preparing your content and website settings without the WPML Plugin being installed and first then, when your content is ready, installing it and starting with the content translation. This will spare you lots of problems and headaches.

Language specific Theme Options

Language specific Theme Options

Use the WPML language selector in the WordPress Admin bar to switch between languages. When a new language is added it will copy the current Theme Options from the default language and from this moment the "Theme Options" will not be synchronized anymore between the language versions. If a change is done to the options of one language and it needs to be in all languages, the change needs to be manually applied into each language's options. This is why it's better to first configure all options in the "default language theme options" and first then create, all other languages.

To simplify the process, you are provided with the option of exporting and Importing the theme, options. You can copy the "Transfer Theme Options Data" string of the one language from "Backup Options" tab under "Theme Options" and import it in other languages by pasting it into their "Transfer Theme Options Data" and hitting the "Import Options" button.


Top
Backup Options

Inverto theme provides "Theme Options" Backup and Restore functionality. The backups are per-language if you're using the WPML Multilingual Plugin. Therefore you can backup the "Theme Options" of every language.

Only the latest backup is saved. If you back the "Theme Options" up again, it will be overwritten. To backup all data, please navigate to "Backup Options" tab under "Theme Options". If you're using the WPML plugin, make sure you are viewing the settings of the correct language as the "Theme Options" are specific for each language. Now click on the "Backup Options" or "Restore Options" buttons and you are done!

NOTE: We strongly recommend preparing your content and website settings without the WPML Plugin being installed and first then, when your content is ready, installing it and starting with the content translation. This will spare you lots of problems and headaches.

Inverto provides the option of exporting and Importing the theme, options. You can copy the "Transfer Theme Options Data" string of the one language from "Backup Options" tab under "Theme Options" and import it in other languages by pasting it into their "Transfer Theme Options Data" and hitting the "Import Options" button.

Transfer Theme Options Data

To reset the "Theme Options" to their defaults use the "Reset Options" button located on the left bottom corner of every page. Please note this will erase all your modified settings on all "Theme Options" tabs.

NOTE: "Reset Options" is language specific therefor only the current language' options will be reset. To reset the settings of all languages please navigate to every language's "Theme Options" page and hit the "Reset Options" button.


Top
5. Theme License Key

Once you've located your license key on your purchase receipt, you may enter it by navigating to Appearance > Theme License in WordPress administration area.

Once your license key and email used during the purchase are entered, hit the "Save & Activate" button and your license will be automatically activated. Upon a successful activation you'll see a green “License key is active” notification.

Activating your theme

What is the license key for?

It is important to keep your license up to date in order to continue getting updates for your IshYoBoy WordPress theme and support for any issues you may encounter. Renewing your license grants you access to support and updates for a year, including all updates for bug fixes and feature introductions.

Without a valid theme license, you will be unable to get support and receive theme updates.

Find your License Keys →

What if my license key has expired?

License keys may be renewed on our website. You will get a renewal notification if your license is about to expire, or has indeed expired.

Top
6. Update instructions

Always backup the theme before deleting or updating it, to avoid losing any modifications..

Inverto has a built in update checker, so whenever we release a new update or fixes, you will be notified right away in your WordPress Administration area.

Automatic Updates

To simplify the update process, if you have purchased the theme from our IshYoBoy.com shop, you can enter the obtained unique License Key and you will allow WordPress to do the update automatically without you having to do everything manually. All this directly from the WordPress Administration area.

Find your License Keys →

Don't have a valid IshYoBoy.com License?

If you have purchased the theme from another marketplace such as ThemeForest, Creative Market, MojoMarketplace, etc.. You can easily convert it to IshYoBoy.com license and use it.

Convert existing license →
Get new license →
Manual Updates

If you have an active license key from IshYoBoy.com applied to your theme, you will receive live update notifications which allows one-click updates directly from your WordPress dashboard.

To update the theme manually using WordPress administration, activate a different theme in Appearance > Themes, delete the current Inverto theme and upload the newest version the same way as you first installed the theme. Once done, activate the theme and it's done.

Top
7. Sources and credits

The following fonts, icons and other files were used:

Fonts
Iconic Fonts
Javascript 3rd-party plugins
Patterns, Images & SVGs
Theme Options
Top
ishyoboy.com - Thank you again! Top