OGO

Creative & Colorful Multipurpose WordPress Theme


Introduction

First of all, thank you so much for purchasing this theme and for being our loyal customer. You are awesome!
You are entitled to get free lifetime updates to this product + exceptional support from the author directly.

This documentation is to help you regarding each step of customization. Please go through the documentation carefully to understand how this template is made and how to edit this properly.

This guide covers all the needed information for building an amazing website, as well as some helpful tips and tricks that will make your experience working with this theme easier and more enjoyable. If you need any additional assistance while using the theme, you can always contact us via email and our support team will be glad to help you out.

Getting Started #back to top

Installing OGO #back to top

In this first section we will go through the essential steps required to start building your website with the OGO theme. We will explain how to install the theme, import the included demo content, as well as how to update the theme.

After downloading the OGO installation file from ThemeForest, extract it and in the extracted folder locate the ogo.zip file. You can then install the OGO theme using one of the two following installation methods:

WordPress upload

For most users, this is probably the simplest installation method.
To install the OGO theme using this method, please follow these steps:

  • 1. Login to your WordPress Dashboard
  • 2. Navigate to Appearance > Themes > Add New > Upload Theme
  • 3. Click on Choose File and select ogo.zip
  • 4. Click on Install Now

FTP upload

If you would like to install the OGO theme via FTP, please follow these steps:

  • 1. Extract the ogo.zip file you previously located. You should now see a folder named ogo
  • 2. Using an FTP client, login to the server where your WordPress website is hosted
  • 3. Using an FTP client, navigate to the /wp-content/themes/ directory under your WordPress website's root directory
  • 4. Using an FTP client, upload the previously extracted ogo folder to the themes directory on your remote server

Once the installation is complete, just activate it and the theme is ready to use.

You should see a notification at the top of the screen that required plugins need to be installed. Please install and activate all of those plugins, since they are necessary for the theme to function properly.

Importing Demo Content #back to top

With the OGO theme, you have an option to either start creating your website from scratch, or choose to import the included demo content to use as a starting point, and then modify it according to your needs. In this section we will explain how to do this.

If you plan to use an online shop with OGO, please install and activate WooCommerce plugin before installing the demo content.

OGO comes with a one-click import plugin. To import the demo content please follow these steps:

  1. Login to your WordPress Dashboard
  2. Navigate to Appearance > Customize > General > Purchase Code tab and insert your Item Purchase Code into the respective field:

  3. Save the changes and navigate to Tools > Import Section. Pick RB Demo Importer plugin and click Run Importer

  4. RB Demo Importer will allow you import the needed part of the content as well as the whole content:

  5. From the Import Type section, choose what type of content you'd like to import:

    • All - imports pages, content, widgets, and settings. We recommend this for users who would like reflect their site exactly as it appears on our live demo.
    • Content - imports only pages and their content. This option is recommended for users who would like to see how we've created our page layouts, but who want to keep their own Customizer settings.
    • Widgets - imports only widgets. This option is recommended for users who would only like to populate the theme’s widget areas with the widgets from their chosen demo. No other content is imported.
    • Options - imports settings into Customizer only. This option is recommended for users who would like to achieve the same look and feel of their chosen demo site, but do not want to import any additional content.
  6. If you also wish to import media files (images, videos, sounds), make sure to set the Import Media Files option to "Yes". In this case you must agree to the copyrights notice.

  7. Click on the Start demo content importing button and wait for the import process to finish.

    Please note, if the above screenshot looks different at your side, you should check http or https settings of your WordPress instance to match your website's URL:

  8. Final step is to import Revolution Slider's demo content:

    • Navigate to Slider Revolution > Import Slider
    • Click on Choose File button and locate the Demo > Sliders folder, wher you will find dummy files
    • Click on Import Slider button
    • As as result, you should see imported sliders.

    Please note, the images we use on our demo sites are copyrighted, and if you'd like to publish them on your site, you would need to purchase them separately. We bought most of our images on Shutterstock.

Updating OGO #back to top

Automatic updates will help you update your theme within one single click. To activate this awesome option you should insert your Item Purchase Code into the respective field here (in case you've not inserted it earlier before running the demo importing tool ):

Having this done, the automatic updates will be activated and you will be notified when a new theme update is available:

You can update your theme manually as well by performing the following steps:

  1. Download the latest theme .zip file from ThemeForest
  2. Extract it and locate ogo.zip
  3. Extract ogo.zip and locate the ogo folder
  4. Copy/Replace the contents of the ogo folder to the /wp-content/themes/ogo folder of your web site.

Troubleshooting FAQ #back to top

1. Why do I see a white screen when importing demo content?

If you get a white screen or some other error when trying to import our demo content, this probably happens because of the maximum execution time limit. You need to increase the maximum execution time (upload time) setting of your web server. The default maximum execution time on web servers is 30 seconds. Please increase it to 120 seconds. Possible ways of achieving this are:

  • By Wp-config.php changes - set_time_limit(120);
  • In htaccess - php_value max_execution_time 120;
  • In php.ini file - max_execution_time = 120

Ask your hosting provider to take care of this for you.

2. How do I optimize my site?

Please use this tool to investigate reasons for slow loading: https://developers.google.com/speed/pagespeed/insights/?hl=en

GoDaddy has a nice article about this: http://bit.ly/2cYs9Tc

3. How to translate or rename default theme labels?

You can use the LocoTranslate plugin (http://poedit.net/wordpress) to translate/rename all the theme's labels.

Using OGO #back to top

Setting Up the Header #back to top

One of the first things you might want to do after you have installed and activated your OGO theme is to set up your header area. The header contains the logo, menu, search bar and other optional widgets.

We recommend using Customizer, which is fully supported by our themes. To set up your header, navigate to Appearance > Customize from your WordPress Dashboard. Settings you define here will be default settings for all pages of your website.

Some options, such as the font color, opacity, spacings and background color, can be overridden on a page to page basis from a specific page’s backend. For more information on how local page settings work, please refer to the Pages section of this guide.

Header customizaion might be separated into two parts: for beginners and for experienced users which require more header variations. If you like the current theme design and would like to keep the same header in your site, Customizer is the only option you might need. It will let you set your own logo, change fonts and colors, add some specific page settings etc.

The simple mode: Customizer

Customizer will let you slightly customize the design you're currenlty having. The tools are pretty intuitive and don't require any additional description. As an example to add your own logo to the webiste, navigate to Appearance -> Customize -> Header -> Logo from your WordPress Dashboard and click the Logo field. After you upload your logo image and save settings, you should have a visible logo in your header area.

The Header section of the Customizer will help you setup these sections:

  • Top Bar
  • Logo
  • Menu
  • Mobile Menu
  • Sticky Menu

The advanced mode: Header Builder

If the Customizer is not enough for you and you'd like to create your own header with no limits, Header Builder is the tool which will help you do that. Navigate to RB Templates -> Add Header and build your own header using WPBackery Page Builder without any limits.

When the new header is ready, you should assign it either to all pages with Customizer or use it on a certain pages only.

To apply the new header to all of your pages using Customizer please navigate to Appearance -> Customize -> Header -> Custom Header and select the created header:

If you wish to assign the newly created header to a certain page only, please edit that page and select the new header bellow the page:

Please note, in case of applying a Custom Header Template, all the Header settings which were set with Customizer will be ignored.

Menu Creation #back to top

To create a new menu, navigate to Appearance -> Menus from your WordPress Dashboard and click on Add a Menu. Enter a name for your new menu and then click Create Menu.

Every page that you have created will be listed in the section on the right. Simply click the pages that you would like to add to your menu and they will be added. Once you have added pages to your menu, you can click and drag the menu items to rearrange them, or nest them one underneath the other.

In the Menu Locations section (which is located underneath the Menu Structure section), check the checkbox next to Navigation Menu. This will activate the menu you have just created, and you should now see a functional menu in your header.

Footer #back to top

Footer customizaion might be separated into two parts: for beginners and for experienced users which require more footer variations. If you just need to have a footer copyrights notice, Customizer is the only option you might need. It will let you set your own textings, colors etc.

The simple mode: Customizer

Customizer will let you slightly customize the design you're currenlty having. The tools are pretty intuitive and don't require any additional description. As an example to add your own logo to the footer, navigate to Appearance -> Customize -> Footer -> Footer Appearance from your WordPress Dashboard and click the Logo field. After you upload your logo image and save settings, you should have a visible logo in your footer area.

The advanced mode: Footer Builder

If the Customizer is not enough for you and you'd like to create your own footers with no limits, Footer Builder is the tool which will help you do that. Navigate to RB Templates -> Add Footer and build your own footer using WPBackery Page Builder without any limits.

When the new footer is ready, you should assign it either to all pages with Customizer or use it on a certain pages only.

To apply the new footer to all of your pages using Customizer please navigate to Appearance -> Customize -> Footer -> Footer Appearance -> Custom Footer Template section and select the created footer:

If you wish to assign the newly created footer to a certain page only, please edit that page and select the new footer bellow the page:

Please note, in case of applying a Custom Footer Template, all the Footer settings which were set with Customizer will be ignored

General Look and Feel #back to top

Now let’s set up the general look and feel of your site. If you've imported the demo content and would like to keep its general look and feel, then you do not need to do anything. Otherwise, go to Appearance -> Customize -> General and set the needed colors, fonts, sizes etc..

Having set up the basic elements for your site, you’re ready to start building your pages.

Building Pages #back to top

To create a new page, navigate to Pages > Add New using your WordPress Dashboard. In the text field near the top of the screen enter a title for your page. After you have added a title, choose the layout type from the section on the bottom named Sidebar Position. This will allow you to add sidebars to your page.

In the right section of your screen you will find the page settings. Any settings that you define here will override the global settings set in Customizer.

It is generally considered a good practice to set up the look and feel of your site on a global level, and override the settings when necessary on a local level. This will save you a lot of time, unlike if you were to set up every page separately.

To start adding elements to your page, first make sure that you are in the backend or frontend editor view. If the blue button near the top left of the page says WPBackery Page Builder, click on it to enable the WPBackery Page Builder view. Once you’re in the WPBackery Page Builder view, the blue button will say CLASSIC MODE. You can now click on the Add Element button to start adding elements to your page.


Finally, click the Publish button in the upper right section of the page. (If you made some changes on an already published page, you will see an Update button instead).

In this section we will describe the creation of blog posts and all the available options for each post, setting up pages to display blog listings, as well as how to change the date format for your posts.

Blog Posts

To create a new blog post, go to Posts > Add New from your WordPress Dashboard. First, you need to enter a title for your blog post in the text field near the top of the screen. Then choose a format for your blog post in the Format section on the right side of the screen.


Blog Lists

Now let's create a blog page where all of the posts will be populated. To create a blog list, you first need to create a new page and add the RB Blog module. Customize the output with the following options:

Layout:
  • Default - select this option if you would like to apply the default blog layout which was set via Customizer
  • Large Images- select this option to display blog list with large images.
  • Small- select this option to display blog list with small images.
  • Two- select this option to display Masonry blog layout with two columns.
  • Three- select this option to display Masonry blog layout with three columns.
  • Four- select this option to display Masonry blog layout with four columns.
  • Category- choose a category of posts to display. It allows multiple categories to be selected.

By choosing one of the above options you will have set this page to automatically show a list of your blog posts in a needed format. All you need to do now is publish the page.


Date Format

If you wish to change the date format on blog posts, navigate to Settings > General > Date Format from your WordPress admin, and select your format of choice.

WPBakery Page Builder #back to top

In order to activate the WPBakery Page Builder, visual content editor, just click the Backend Editor button, which is located bellow your page title.

All our custom modules are located at the By RB tab:

With the help of the visual tools you can build your content. Just click the plus symbol and add any module you wish. As a result your page will look like this page section:

For basic WPBakery Page Builder usage please refer to the developer's help sections Getting Started

Widgets #back to top

In this section we will describe widgets and widget areas available in this theme.

Widgets are easy to manage and can be incredibly useful to have on your site.

We have developed custom widgets and widget areas in order to provide you with even more functionality.

Widgets

  • RB About - this widget will display about the author section.
  • RB Banner - use this widget to display your banners.
  • RB Recent Posts - will display the latest blog posts.

WooCommerce #back to top

In this section we will describe how to install and set up the WooCommerce plugin with OGO.

OGO comes with WooCommerce integration, which allows you to easily create an online shop. For more information on installing and configuring WooCommerce, please visit this page:

https://docs.woocommerce.com/documentation/plugins/woocommerce/getting-started/

In order to set up WooCommerce with the OGO theme, follow these steps:

  1. Navigate to Plugins > Add New from your WordPress Dashboard.

  2. Type “WooCommerce” in the search field.
  3. Locate "WooCommerce - excelling eCommerce" in the search results and click on Install Now.
  4. Once the installation has completed, click on Activate Plugin.

  5. You will now see a notice saying “Welcome to WooCommerce – You're almost ready to start selling :)". If you plan on importing demo content, click on Skip Setup. Otherwise, click Install Pages.
  6. See Importing Demo Content in the Getting Started section of this user guide and perform the process explained there.

RB FlatIcon #back to top

In this section we will describe how to install the RB FlatIcon plugin and how to add your own icons to your pages.

OGO supports RB FlatIcon plugin, making it possible to colorize your website with the help of your own specific icons. In order to setup it, please perform the following steps:

  1. You should have seen a notification at the top of the screen that required plugins need to be installed upon theme activation. Please make sure you've installed and activated all of the required plugins, since they are necessary for the theme to function properly. Navigate to Appearance > RB FlatIcons from your WordPress Dashboard.

  2. You should see an empty page, ready to import your icons.

  3. Open in a new tab or browser window this website flaticon.com and generate your icon library. You should use only "monocolor" icons in order to be compatible with the plugin.

  4. Click the "Download Collection" button, select "All formats" and wait till the collection finishes downloading. You should have it in .zip format.

  5. Navigate to your FlatIcon plugin and select the downloaded icon library. Click the "Import FlatIcons" button and wait for the import process to finish.
  6. Once the import is complete successfully, you should see the icons.

Help and Support #back to top

Please contact us in case you need any help or support.