“Petro - Industrial WordPress Theme” Documentation by “TemeGUM” v1.2.0



“Petro - Industrial WordPress Theme”

Created: 25/06/2017
Last Change: 12/05/2020
By: TemeGUM
Email: support@themegum.com

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!


Table of Contents

  1. About Petro - Industrial WordPress Theme
  2. Requirements
  3. Installation
  4. Install Theme Extension ( Plugins )
  5. How To
    1. Configuring Logo
    2. Configuring Social Link
    3. Configuring Top Bar Height
    4. Configuring Top Bar Layout
    5. Setting Main Menu as Sticky
    6. Configuring Heading Info Icons
    7. Arrange Info Icons Position
    8. Configuring Heading Style
    9. Configuring Footer Area
    10. Configuring Blog
    11. Configuring Sidebar Width
    12. Configuring Slide Banner
    13. WooCommerce Shop
    14. Translating The Theme
    15. Importing Demo Content
    16. Updating Theme
    17. Adding Google Analytics
    18. Importing Elementor Template
    19. Migrating to Elementor Page Builder
  6. Sources and Credits

A) About Petro - Industrial WordPress Theme - top

Petro is a stunning, clean and fresh WordPress theme. This theme easily fits for any kind of website demographics. Aside from just looking beautifully polished and clean, it comes packed with features and options, powerful Redux Framework.

Features

Compatibility


B) Requirements - top

This theme does not require anything except only version of WordPress 3.7 or higher.

You can update your WordPress version by downloading at WordPress Official


C) Installation - top

It is easy to install, just the same as other themes. No problem, i will give you some guide as below:

  1. Go to Dashboard > Themes > Click on 'Add New'

  2. Click on 'Upload Theme'

    Browse for the theme you've have downloaded. Click on 'install'

  3. And Activate the theme

    After install the theme finished, from themes manager click "Activate" link on "Petro" row


D) Install Theme Extension ( Plugins ) - top

In order for the theme to work properly and all features can appear, it will take some extensionzd installed. Do not worry, you'll get notifications on admin dashboard. If you don't get notification you can see all extensions by follow Dashboard > Appearance > Install Plugins

The extensions


E) How To - top

  1. Configuring Logo - To top

    Uploading a Logo

    Go to Dashboard > Appearance > Theme Options > Site Identity > Image Logo, Click "Upload" button.

  2. Configuring Social Link - To top

    Social Icon On Top Bar

    In addition to showing or hidden the social link just put url or leave blank fielad. If field has link the social icon automaticaly will diwplay at right top bar

    Dashboard > Appearance > Theme Options > Social Link, Fill the fields then click Save Changes.

    Displaying Social Icon On Bottom/Footer/Sidebar

    To display social icon at bottom/sidebar can using Petro Social Icon Widget.

    Dashboard > Appearance > Widgets. Drag "Show Social Icon" to widget area ( Sidebar or Bottom ).

  3. Configuring Top Bar Height - To top

    In addition to change top bar height, you can control from Go to Dashboard > Appearance > Theme Options > Header > Top Bar, Put your height value in px then click Save Changes button.


  4. Configuring Top Bar Layout - To top

    Top bar layout can arrange as many posibility, place menu, custom text and social icon at left side or right or both. Just drag those element and bring to the holder.

    In addition to change top bar height, you can control from Go to Dashboard > Appearance > Theme Options > Header > Top Bar.

  5. Setting Main Menu as Sticky - To top

    In addition to change top bar height, you can control from Go to Dashboard > Appearance > Theme Options > Header > Top Bar, On field Sticky Menu click "Yes" to set sticky top bar or "No" to normal position then click Save Changes button.


  6. Configuring Heading Info Icons - To top

    Heading info icon when heading style on default mode.

    In addition to adding/remove/order icon info, you can control from Go to Dashboard > Appearance > Theme Options > Header > Icons Bar, Click "Add More" btn to add more info, or remove the info. Once finish Save Changes button.

  7. Arrange Info Icons Position - To top

    The position of info info section can arranges as you want.

    From Go to Dashboard > Appearance > Theme Options > Header > Icons Bar Layout, Move up/down for module ordering. Once finish Save Changes button.

  8. Configuring Heading Style - To top

    Go to Dashboard > Appearance > Theme Options > Header > Heading > Heading Banner

    In addition heading setting, you can adding heading image and set different heading image for single page, single post and general page.

  9. Configuring Footer - To top

    Footer area have 4 sub-area. Icon boxes, widget area, footer text and footer copyright.

    Configure icon boxes

    In addition to showing or hidden the widget area an footer, you can control from Go to Dashboard > Appearance > Theme Options > Footer > Icon Boxes, Click on or off to enable and disable.


    Disable / enable Footer Widget Area

    In addition to showing or hidden the widget area an footer, you can control from Go to Dashboard > Appearance > Theme Options > Footer > Widget Area, Click on or off to enable and disable.


    Change Column Footer Widget Area

    In addition to define how split bottom widget area into several colum, you can control from Go to Dashboard > Appearance > Theme Options > Footer > Widget Area > Footer Widget Columns, tick on radio option then click Save Changes.

  10. Configuring Blog - To top

    Front page & Posts page Blog

    This is general setting for blog. Go to Dashboard > Appearance > Theme Options > Blog, tick on radio option then click Save Changes.

  11. Configuring Sidebar Width - To top

    Since version 1.1.0 Petro WP have ability to control sidebar width. This option give more experiance for each user.

    Go to Dashboard > Appearance > Theme Options > Blog > Sidebar > Sidebar Width, select width then Save Changes.

  12. Configuring Slide Banner - To top

    Petro WP have native slide show. This feature give user solution displaying beautiful slideshow without 3rd party plugin needed. Petro WP using jQuery Superslides by Nic Aitch as slideshow engine.

    Configuring Slide

    Go to Dashboard > Appearance > Theme Options > Slides.

    Displaying Slide

    To display slideshow can using "nuno element".

  13. WooCommerce Shop - To top

    Since version 1.1.0 Petro WP have WoocCommerce layout with many option available.

    Shop Settings

    Go to Dashboard > Appearance > Theme Options > Shop Settins.

  14. Translating The Theme> - To top

    Petro is localized and you can easily translate it to any language you like. Please make sure that the font that you are using on your website is supporting your language characters. For example Cyrillic characters.

    In order to translate the theme to any other language, follow the steps below:

    Step 1 – Open po editor such as poedit

    Step 2 – Open .po file identified to language code used in /languages directory. Example if you need Bahasa will named id_ID.po then go Step 4 if .po file not found you must create .po file from .pot file or copying from other language code ( go Step 3 ).

    Step 3 - Creating .po file.

    1. .po file can creating from copy other file than rename it to your language code for example duplicate id_ID.po and rename to ru_RU.po ( if want Russsian language )
    2. .po file creating from .pot file. From Poedit menu, open Create new translation and select petro.pot file then select translation language then save with name ru_RU.pot ( if want Russsian language )

    Step 4 – Search for string you want to translate into, then save it.

    Step 5 – Once you’ve done with steps above, navigate to Settings > General > Site Language. Select your language from select option.

  15. Importing Demo Content - To top

    Demo content packaged as .xml and .json file as WordPress standard. Make sure the website have WordPress Importer Plugin installed add WP Options Importer. These plugin is bundling with theme using TGM Activation

    Importing Posts/pages Content

    Step 1 – Make sure the WordPress Importer Plugin installed and activated

    Step 2 – Importing proccess

    1. Before importing proccess, make sure the demo_content.xml file availbale. You can get the demo content in Demo Content folder file where this file is included in downloaded zip file.

    2. From Admin Panel : Tools > Import > WordPress, click choose file button and then select corresponding file from demo_content.xml. Continue with Upload File and Import.

    Importing Widgets

    Step 1 – Make sure the WP Options Importer Plugin installed and activated

    Step 2 – Importing proccess

    1. Before importing proccess, make sure the options.json file availbale. You can get the demo content in Demo Content folder file where this file is included in downloaded zip file.

    2. From Admin Panel : Tools > Import > Options, click "Run Importer" link and choose file button and then select corresponding file from options.json. Continue with Upload File and Import.

      Select "All Options" or Specific options ( if you known what option want imported) and tick Override existing options option.

    Importing Theme Options

    Step 1 – Get Settings

    Before importing proccess, make sure the theme_options_OPEN_USING_TEXT_EDITOR_PUT_CONTENT_AND_PASTE_IN_THEME_OPTIONS.json file availbale. You can get the demo content in Demo Content folder file where this file is included in downloaded zip file. Open the file using text editor, copied all content.

    Step 2 - Paste settings

    Go to Dashboard > Appearance > Theme Options > Import/Export > Import Options, select Impport from File button then paste copied settings then click Import button and Save Changes.

  16. Updating Theme - To top

    Petro have theme update notification. Your active website will get notification each update released.

    To activate update notification you must put valid Purchase Number from your download item. Go to Dashboard > Appearance > Theme Options > Advanced > Item Purchase Number, then enter Save button.

  17. Adding Google Analytics - To top

    Analytic code can embed using "Javascript Code" field.

    Go to Dashboard > Appearance > Theme Options > Advanced > Javascript Code, only javascript code only allowed, without tag.

    <javascript>Only code from here</javascript>

    Using Old analytic code.

    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
    
      ga('create', 'YOUR_UA_NUMBER_HERE', 'auto');
      ga('send', 'pageview');
    

    Using Global Site Tag.

    var gtagscript = document.createElement('script');
    
    gtagscript.setAttribute('src','https://www.googletagmanager.com/gtag/js?id=YOUR_UA_NUMBER_HERE');
    document.head.appendChild(gtagscript);
    
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
    
      gtag('config', 'YOUR_UA_NUMBER_HERE');
    
    
  18. Importing Elementor Template - To top

    For importing elementor template, please using elementor importing for best result.

    Follow this step, Go to Templates > Saved Templates > Import Templates

    Choose the file ( zip file )

    Zip file included in package: Demo Content folder

    The result:

    If no "Petro_Elementor_Templates.zip" file on your download, download latest zip file here

  19. Migrating to Elementor Page Builder - To top

    Petro Theme always continues to be developed according of time adapted to new technology. Since version 4.0 petro theme got upgraded to Elementor page builder. Old builder still work well without change anything, but for Elementor user must do less step below:

    After all demo pages imported, Go to Dashboard > Pages

    1. Click edit link/button

    2. Click "edit with elementor" button

    3. Remove "nuno builder shortcode content"

    4. Insert new template from library by click folder ico

    5. Click "My Template" tab on popup

    6. Find and select template you want then click "insert" button

    7. And finally click "update" button to save


F) Sources and Credits - top

Special thanks to:


Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

TemeGUM

Go To Table of Contents