Ninetheme

Theme Documentation

01Getting Started

Firstly, a huge thanks for purchasing this theme, your support is truly appreciated!

This document covers the installation and use of this theme and often reveals answers to common problems and issues - we encourage you to read this document thoroughly if you are experiencing any difficulties. If you have any questions that are beyond the scope of this document, feel free to pose them in the dedicated support forum.

02Theme Installation

02.1How To Install Your Theme

Now that you’ve downloaded this theme, there are two ways you can install the theme.

Important: One of the most common reasons people have issues is because they try uploading the full zip that includes sample data, documentation…etc which displays the “The package could not be installed. The theme is missing the style.css stylesheet.” error.

Please make sure you are uploading only the installable theme which is called theme-file-name.zip. When you download the theme from your ThemeForest downloads it will give you 2 choices one is to download the full zip which you will need to extract to locate the theme and the other one is just the installable theme. Please pay close attention to this.

Step 1: Make sure wordPress is up to date!

The theme is a powerful and makes use of all the latest WordPress functions to ensure the theme is coded as best as possible and is highly optimized, please make sure WordPress is fully up to date before installing the theme! You should ALWAYS be running the latest version of WordPress anyway, because otherwise you put your whole site at risk for potential threats. Never use an outdated version of WordPress!

Step 2: Install via WordPress or FTP

Now that you made sure WordPress is up to date you can go a head and install the theme and there are 2 methods for doing so: via WordPress or via FTP. If you are working with WordPress and buying themes you should pretty much know how to install a theme, but below are some screenshots just incase you don’t know how!

Install Via Cpanel

Install Via WordPress

Log into your WordPress website and browse to Appearance > Themes

Then click on the option to upload theme.

Install Via FTP

Your second installation option is to upload the theme via FTP. For this method first log into your site via FTP and browse to your folder located at wp-content/themes. Unzip the theme file you downloaded from Themeforest and upload only the extracted this themes folder to your server.

02.2Theme Installation Errors

This theme should be installed without any errors, although on some occasions people to encounter error so here are the most common error and the solution:

One of the most common reasons people have issues is because they try uploading the whole theme main zip file that includes sample data, documentation…etc which displays the “The package could not be installed. The theme is missing the style.css stylesheet.” error. Please make sure you are uploading only the installable theme which is called theme-file-name.zip. When you download the theme from your ThemeForest downloads it will give you 2 choices one is to download the full zip which you will need to extract to locate the theme and the other one is just the installable theme. Please pay close attention to this.

Are you sure you want to do this?

You might have face such an warning and this error typically happens for one of two reasons:

02.3.0Theme Demo Installer Wizard

If you can't use Demodata Wizard after theme activate please contact our support team or apply manual steps, we can help you free for demodata installations. If you accomplished to install the demo data with the help of Wizard installer panel, there is no longer need to read the entire installation sections provided in this documentation. You may directly post your questions us.

02.3.1Install and Activate Plugins

After activating this theme, you have to make sure that the theme required plugins are installed and activated in order to get the same demo data that you see on the live and to install the theme's required plugins

You can find the theme required plugins here : Appearance > Install Plugins and please also see the instructions provided below:

  1. Click Begin installing plugins
  2. Go to Bulk actions > Install
  3. Select all plugins
  4. And click Apply
  5. After a few minutes...That's it ! Now, you should activate the plugins for use them:

  6. Get your mouse over Plugins on the right bar
  7. Click Installed Plugins
  8. Go to Bulk actions > Activate
  9. Select all plugins
  10. And click Apply
NOTE : Please make sure that you've installed all of the required plugins before you import the demo data.

02.5Import XML Demodata

This is the second way of installing the demo data to your domain. In this option, you need to get the xml file, which you can see in the main theme file and then import the xml file with the use the WordPress Import plugin.

Please have a look at the following image in order to see how to import your xml demodata

Dashboard > Tool > Import > WordPress > Select your file.

02.6Setting Up Front and Blog Page

If you've already installed the demo data with the Migrate file, then you can disregard this section as your frontpage and Blog page will be automaticaly selected. However, if you decide to install the demo data with the XML file , then you need to select manually your frontpage and a Blog page for your posts.

To set your frontpage and Blog page, please see the following instructions

  1. Go to Settings > Reading
  2. Select A static page from Front page displays section
  3. Select Home for Front page
  4. Select Blog for Posts page
If you haven't applied these setting above, your frontpage sections will not be displayed.

02.7 Theme Partials

In our theme, we tried to make it easier the customizability providing much options in the theme partials section. You can find both menu and logo in the header area, while you can find the social icons, widgets in the footer area and also you're able to find the sidebar options in the theme options. In this section, we're going to show you how to add these options providing images to make it more understandable.

02.11 Widgets

Adding widgets is simple. Browser to Appearance > Widgets and drag and drop your widgets into your footer Columns. The default Footer is composed of Widgets which you can add via Appearance > Widgets. You can also completely style and select your options for your footer via the Customizer. Look at the following images.

NOTE : You should in keep mind that you can add your contact form. What you need to do is copy-paste the shortcode of the contact form and drap-drop the ' text 'into the related area as already shown in the images provided below.

02.13Page Templates

Custom Page Template Type

This template gives you a lot of functions that you can use on your website including the header and footer areas.Once you select this template type, you'll see many options at the bottom of that page and on the right side of that page and with the use of this options, you can easly customize your header and footer areas.

Default Template Type

This template type just give you the option to create a page with a full sidebar option. Unlike the Custom Page Template, you can not add a custol logo or set the footer or header area.

Note : Some settings for these customizable pages are in the metabox area at the bottom of these pages, which will help you build different pages.

04.1Adding a Contact Form

The first thing you need to do is to go to Pages, where you want to use the contact form . Then, copy the shortcode of the contact form and paste into the related arae in the contact shortcode.

Or, you can just directly select the any of the available contact form in the Contact Form 7 shortcode of WP Bakery like the sample provided in the image below:

In case of facing any kind of problems related to the contact form, please check the following contact form documentation carefully.

Click Here For The Contact Form 7 Documentation

05Post Formats

This theme makes use of all of WordPress' 10 post formats to give you plenty of ways to show content in the top section of your articles. You choose type by selecting format in the "Format" box on the right side when you edit or add a new post. Depending on which format you select, new options will appear below the large text field.

Here is how to use each one of the formats, and what each one does:

06Theme Settings ( Theme Options )

First, we should know that options are the main pillar of a theme. In other words, theme options are the backbone of a theme. You can find many options including Menu General colors, Logo, Menu, footer and so on. This is the section, where you have full control over your website and can customize as you wish and besides, you do not have to able to know about coding. The major groups of options you can set in the theme are the Theme Options. Here, in this theme, you have a variety of options regarding the theme including socials, widgetize options etc.

Note: If you dont see an option that you're looking for in the Theme Options, please do not hesitate to let our support team know so that we'll try to add that missed option for you.

02.14 Child Theme

Why You Should Be Using Child Themes

Creating a child theme when performing adjustments to your theme’s code can save you a lot of future headache. Child themes allow you to make changes without affecting the original theme’s code, which makes it easy to update your parent theme without erasing your changes. By creating a child theme, you create a separate set of files that you can use to customize the theme without affecting the original theme at all. Not only does this make updating easier, it also makes sure that you will never ruin your original theme as you are never actually modifying the files. You can always turn off your child theme and fall back on the original. Click Me To Create A Child Theme

07WooCommerce Options

After install WooCommerce plugin you need to set WooCommerce pages. WooCommerce page settings here : appereance - theme options. If you want to add WooCommerce widgets go here : appereance - widgets

08Translate Theme

9WPBakery Page Builder Shortcodes

Many parts of this theme have been created with the use of WP Bakery ( formerly as Visual Composer ), which makes you able to build something unique anything that you can imagine of without code knowledge is required. Since the usage of the shortcodes are really easy, we actually think a documentation for that wouldn't be necessary. However, in case you need any assistance regarding the shortcodes, please keep in mind that our support team is always ready to help you.

You may have a look at the following screen shot taking as an example

10How to Design Your Website

In this theme, you're able to modify your website using css codes. You can change/modify each of the available elements thanking to the css codes. Lets say, for example, that you would like to change the color one of your element, you can do it easly and also save your time as well. If you're not much more familiar with using css, please take a look deeply at the following link and video to learn how to design your website using css codes.

Click here for the link

Click here for the video

11Theme Icons

Icomoon

Font Awesome

Ionicons

IconsMind

In this theme, we have a variety of icons listed under the Font Awesome.You can use all icons after family prefix, example :fa fa-pencil , copy paste pencil name.

NOTE : Please keep in mind that you must use lowercase when writing the icon's name. For ex. fa fa-Twitter ( WRONG ), instead fa fa-twitter ( CORRECT )

12Theme Problems

1- Question : I keep getting this error ' LINK IS EXPIRED - TRY AGAIN WHEN UPLOADING THE THEME IN ADMIN PANEL ' How I can I solve this ?

There are two ways to solve this problem. Firstly, contact your web hosting service provider to increase your upload_max_filesize to 32M. Secondly, upload the extracted theme package via an FTP client to wp-content/themes directory.

2- Question : Why after I've upgraded to WordPress 5.0 and you are no longer able to use with the 5.0 version of Page Builder ?

Answer: If you've upgraded to WordPress 5.0 and you are no longer able to use the Page Builder, please follow: Update to Uncode 1.9.3 (or higher), update the required plugins and make sure you have selected the Disable Gutenberg Editor option in the WPBakery Page Builder > General Settings. When updating the theme don't forget to update Uncode Core and WPBakery Page Builder plugins as outlined in the Theme Update documentation. Alternatively, if you cannot update the theme, you can install the free Classic Editor plugin from the official WordPress repository and check the replace the Block Editor option.

3- Question : There are gaps in the page, why ?

4- Question : How to add a favicon to my website?

You can add a favicon here: Admin > Appearance > Customize > Site Identity > Upload image

5- Question : I did everything like in the documentation but menu is invisible?

Solution: Please make sure you've selected the Default Primary Menu on the right side of your pages in backend editor.

6- Problem : Where can I edit the footer area?

Solution: Go to appereance -> Theme Options -> Footer

7- Problem : I can not load the demodata or some images.

Solution: Some hosts settings might block the demodata. Please ask your hosting company to increase your server php settings. Click Here

8- Problem : How can I change the demo layout.

Solution: You can change in your WordPress panel here: Admin > Settings > Reading > Select your homepage

9- Problem : If I update my theme, will I lose my customization?

Solution: As long as you use a child theme, none of your customization will be lost.

10- Problem : How can I update the paid plugins such as WPBakery Page Builder and Revolution Slider?

Solution: You need to firstly deactive and delete those plugins and then you should re-install via Appearance > Install Plugins

11- Problem : I have a horizantal scroll bar under the browser.

solution: If you have a horizantal scroll bar under the browser,you can get rid of this problem by applying these settings.Update your theme via FTP or Wordpress Toolkit.

12- Problem : How can change the logo setting.

Solution: Please checkTheme Options > Header Logo Options

13- Problem : How can I add a section to a page

Solution: Thanks to the integration of WPBakery Page Builder, you can add any element whereever you want on your page. There are dozens of elements of WPBakery Page Builder that you can use.

14- Problem :I cannot edit the content of my pages anymore. Why ?

Solution: Please make sure that you have the latest version of WPBakery Page Builder

15- Problem : How can I edit my social icons, logo etc ?

Solution: Please go to Admin > Appearance > Theme Options

16- Problem : Even though, I have imported Demo Data, I still can not see my page in frontend just like the demo on the preview

Solution: Please make sure that you have select homapage for your frontpage and select Blog for your post in your static pages. If you haven't selected, then please go to Admin > Setting >Reading > Select Frontpage and Blog.

17- Problem : How can I add contact form into the footer area?

Solution: Please go to Appearance > Widgets. (Here, you should get the shortcode of your contact form on 'Contact' and put it into the widget)

18- Problem : How can I change the color of an element or dislay an element?

Solution: All you need to do is just get the name of the related class and coding the color and add to css area in Theme Options

For Example:your-class-name { color:#fffff; display:none; }

19- problem : Why I cannot see my content of the sections at frontend?

Solution: Plz make sure that you've filled all the related field in shortcodes on Admin > Pages

20- Problem : I use the 3rd demo but would like to use the second header. How can I do that?

Solution: You can use any header you want. There area five types of header in the shortcodes named Fronpage Header 1, Fronpage Header 2, Fronpage Header 3, Fronpage Header 4 and Fronpage Header 5. You can replace any of this within your theme.

13Additional Information

Extra information that you may find useful.

Font Awesome and other font (icon) issues?

If you have trouble with Font Awesome showing strange characters instead of icons, you are most likely using a CDN or external host in some way for the font files. Certain browsers may have issues with that, as they follow certain web standards. (Also make sure that your font files were uploaded correctly, and empty caches)

This can be fixed with for example this sample .htaccess file from MaxCDN. If you wish to read more about this, it relates to CORS headers.

Useful plugins

Many common problems or missing features can usually be solved with plugins. Here is a list of some great ones.

Recommended theme editing software

Link Resources

Learn more and ask about WordPress' standard features. WordPress is in itself an extremely well-documented open platform. It is recommended to search for answers via Google / DuckDuckGo first if you have questions – it almost always give useful information or at least point you in the right direction.

13.1Troubleshooting 101

Do you have a problem with your theme? This quick troubleshooting guide should be the first thing to check through - it will help you find the root cause of the issue.

A WordPress website issue can come from mainly one of 4 areas:

Lets find out where your issue is coming from!

Step 1: Check your plugins

The first thing to do is to see if you have any plugins installed. Do you? If so, go to your admin panel and disable all of them. Now, go back to your site and see if the issue remains. If the problem is gone, then re-activate your plugins one-by-one and check the site between each activation. This way you will directly find the plugin(s) that cause problems.

If your issue remains even with all plugins disabled, go on to the next step.

Step 2: Check your customizations

Have you customized your theme in any way before you noticed the issue? If so, go to the theme demo website of the theme and see if you find the same issue there. If you can not see the issue there, you need to take a look at your customized code and find what may be wrong.

Step 3: Is the issue admin panel related?

If you have problems with media uploads, errors in the WordPress dashboard or other access issues, the likely cause is either an incorrectly setup server or a broken WordPress install.

To see if your problem is related to a broken WordPress install or an incorrect server setup, simply activate a WordPress default theme such as Twenty Twelve. Does the issue remain? Then your issue is not theme related. If the issue goes away with a default theme active, then it's most likely theme related.

Note: Remember cache!

If you apply/repair code to fix issues but see no changes on your website when you save it, check if your website has any cache plugin activated. If so, make sure to empty all caches. Also force-refresh the page when viewing it by pressing F5.

13.2Learn WordPress

As you can already imagine that it's becoming an obligatory to have the cotroll over the modification in your theme. So in this regard, if you would like to be able to understand the way how the WordPress work, you better to have a look at the following link.

You can read description on this plugin. Click Me here to learn WordPress

NOTE : Almost all of our customer keep asking us to make some modification including changing color, which may not be provided in the theme options so for these kind of problem, using the chrome css editor is the greatest way to make any change you wish. Here, all you need to do is just take the name of the element you want to change and paste the code in the custom css area provided in the theme options. You can also take a look at the following video to get the point well.

  • Click Me to Learn How to Use Chrome Css Editor
  • NOTE : In the following video, you'll learn how to add google font into your website

  • Click Me to Learn How to Add Fonts into Your Website
  • NOTE : In the following video, you'll learn how to add Revolution Slider into your website

  • Click Me to Learn How to Add Revolution Slider into Your Website
  • NOTE : In the following video, you'll learn how to add WooCommerce plugin into your website

  • Click Me to Learn How to Add WooCommerce plugin into Your Website
  • If this is your first-time install or if you use the WordPress.org version of the theme, you can skip this step.

    It is a good idea to keep your theme up to date with the latest version, as it often includes important bugfixes or new neat features. If a new version of the theme is available, do the following steps to update it:

    1. Download the latest version.
    2. Locate the theme-file-name.zip file to upload.
    3. Go to Appearance > Themes in the WordPress menu
    4. Activate a default theme temporarily, such as Twenty Twelve (to be able to delete your current theme)
    5. Click on the theme you wish to update, and press the red delete link bottom right. Your admin panel options should remain saved.
    6. Upload the new theme-file-name.zip, as you did on first-time install, and activate it.
    7. Learn more how to use child themes here.

    You are now running the latest and best version of the theme!

    Important: If you haven't used a child theme for your theme customizations, you must do the following steps before each update:

    • Backup your custom.css file if you have used it, it will be overwritten and needs to be re-added after the update.
    • Backup your additional language files if you have created/modified any, they will be removed and need to be re-added after the update.
    • Backup any other custom code.

    13.3How To Use Plugins

    In our theme, we've used a broad of plugins, which are used commonly and makes you able to customize your website in a simple way and looks nice as well. You can find the plugins that we used within our theme at the following list.

    14Ninetheme Support Center

    Again, thank you for purchasing this theme. If you need some help, or support please use email or contact form via themeforest profile site. Hope you happy with the theme, all the best with your business.

    You can ask your question on: Ninetheme Support & Contact

    If you want to rate it: Themeforest Download Page