First, thank you for purchasing our theme!
This guide provides instructions for installation, help on getting started and extensive documentation of features. It is recommended you read it thoroughly to fully leverage the Yellow Hats theme's capabilities. Please also make sure to check out our Video Tutorials as they explain everything covered in here in greater depth. We hope you enjoy building with Yellow Hats as much as we enjoyed developing it and continue to develop with new features!
Before beginning the installation and configuring of your new theme, you must first have WordPress already installed on a server.
If you are struggling, here is a very detailed guide at Wordpress Codex that will walk you through every step.
If you prefer something more visual, you can watch this video tutorial on how to install Wordpress by us
Once you have setup a copy of WordPress, there are two ways you can go about installing the theme:
Unzip the download and upload the theme directory /Yellow Hats/ into your WordPress themes directory /wp-content/themes/.
This is definitely the easier route for most. Simply navigate to Appearance > Themes > Add New > Upload Theme. Click the 'browse' button and locate the still zipped theme folder. The theme will be uploaded and installed in a matter of seconds.
Here is our video tutorial to help you through the process
(Please note the video shown is from our NUVO Restaurant theme, but the same process applies)
After you have installed the theme successfully, you can optionally import the supplied dummy data in order to get a feel for things. If you're interested in importing the data, please check the Demo Data section below
Once you have installed and activated our theme you will be prompted to install required and recommended plugins. Just click the link to Begin installing plugins.
Next, check boxes to select all the plugins you want to install, select the bulk action of install from the dropdown box and then click the button to apply.
Next, just click the link to Return to Required Plugins Installer.
Select the plugins you had installed, and then apply the bulk action to activate them.
Finally, you will got a confirmation notice that your plugins were activeded.
This is way simple, easy and quickly to you can import demo data because you only need perform it by One Click.
You can see video instruction in here:
Or You can perform follow instruction follows:
First of all, you must install all the required plugins after theme activation. Once all your plugins are installed, You go to Install Demo on the Tools menu:
Then You select a demo and click the “Import” button. it can take a few minutes to import everything. Please be patient and wait for it to complete
Finally, After the importation is finished, you click Save Changes and you are done.
NOTE: in few case, your site can import all image of theme, you can perform import image again by ways:
1. Go to Regen Thumbnails tab on the Tools in Dashboards
So you will get all the content on this preview site.
If you want to import the demo data manually, or You don't see the “one-click import” feature (yet), you can import the demo content the old fashion way using the WordPress Importer tool.
The steps to you can import demo data:
Before you import posttype of our theme for your site, You need import all content in file taxonomies.json before.
1. Go to Tools on the CPT UI menu -> click to "taxonomies" tab
2. You open file:
3. You can copy all content in file taxonomies.json and paste in here like image below.
4. Go to Tools on the CPT UI menu -> click to "posttype" tab then You copy all content in file post-type.json (link:
wp-content\themes\wp-yellow-hats\inc\demo-data\main-demo\post-type.json .) and paste in here
Step2: Import file XML
1. You need go to Plugin in Dashboard and perform deactivate plugin EF3 Import And Export.
2. In your admin panel, Go to Tools -> click "Import" -> choose the WordPress options:
3. You need upload two files with the path below:
Step 3: Import Slider
1. Go to Revolution Slider -> navigate to"Slider Revolution' tab -> click to "Import slider"
Step 4: Import all option for Theme option
On theme activation, all customizer mods are automatically set just like the demo. But if for some reason, you need to reset them, or if your theme includes different demos with different customizer mod sets, you
may want to import them. To do so:
1. Go to wp-yellow-hats on the Appearance menu
2. Navigate to the "Import from File "
3. Open file options.json on the the path: \wp-content\themes\wp-yellow-hats\inc\demo-data\main-demo\options.json
4. Copy all content of options.json file and then paste it into text area.
Step 5: Import Widgets
To import the widgets settings, you need:
1. Install and active plugin “Widget Importer & Exporter”: https://wordpress.org/plugins/widget-importer-exporter/
2. In your admin panel, go to “Tools” > “Widget Importer & Exporter”:
3. Select the widgets.wie file in wp-content\themes\wp-yellow-hats\inc\demo-data\main-demo\widgets.wie .
So All process import demo data by manual importing is complete. You can view your site in Front-end.
This is plugin required all our themes
This plugin provides an easy to use interface to create and administer custom post types and taxonomies in WordPress. This plugin is created for WordPress 4.x.
If you need dedicated support for this plugin, please visit: Custom Post Type UI
After installation, you will be suggested to install additional plugins. To install them and activate, please navigate to Plugins, you will see a list of required and optional plugins. We recommend that you install the following to get the best of our theme:
Visual Composer is the most popular drag and drop editor for wordpress.
If you need dedicated support for this component, please visit: Visual Composer on Code Canyon
Create a responsive (mobile friendly) or fullwidth slider with must-see-effects and meanwhile keep or build your SEO optimization (all content always readable for search engines). See the heaps of custom transitions/animations for each object on the page!
Customize this slider with our convenient drag & drop backend to your very needs. This plugin features tons of unique transition effects, an image preloader, video embedding, autoplay that stops on user interaction and lots of easy to set options to create your own effects.
For premium support with this plugin please visit: Revolution Slider on Code Canyon
Newsletter is a real newsletter system for your WordPress blog: perfect for list building, you can easily create, send and track e-mails, headache-free.
It just works out of box!
For detailed inforamtion and support on this plugin, please go to: Newsletter
Contact Form 7 is one of the most popular form builders for wordpress.
We have created styles ready for you to use within your Yellow Hats theme.
For detailed inforamtion and support on this plugin, please go to: Contact Form 7
Woo Commerce is one of the most popular shopping cart plugins for wordpress.
For detailed inforamtion and support on this plugin, please go to: WooCommerce
Flex Map is a wordpress map plugin that provides many features with different map types such as creating area mapping, polygone, polyline, circle, rectangle, single markers, street view markers.
With a simple visual map editor, It is extremely easy to make and place your map anywhere on your frontend wordpress site.
For detailed inforamtion and support on this plugin, please go to: Flex Map
This plugin converts all SoundCloud Shortcodes into embeddable SoundCloud players. It works for any SoundCloud track, playlist, user, or group.
Once you install this plugin, it works for any of your blog posts.
For detailed inforamtion and support on this plugin, please go to: SoundCloud Shortcode
With the Page Options specially built for our themes, you can easily customize General, Header, Page Title and Footer of every page.
Custom Page Title: Enable/Disable custom style mode.
You can give a Title and select layout for your Page Title here.
Show Sidebar: Enable/Disable custom style mode.
Show Sidebar Left - Default Sidebar Right: Enable/Disable custom style mode.
1. Enter row id
2. You can offset for one page
3.Click the arrow on the right of the item to reveal additional configuration options.
Set of attributes such as images below.
4. enable button one page
Portfolio and Pricing are created using Shortcodes. For more detailed instruction, please head to Shortcode > CMS Grid
Testimonials Client are created using Shortcodes. For more detailed instruction, please head to Shortcode > CMS Carousel
To Add Widget on Sidebar, please following these steps:
The options panel is home to all of the theme's extensive configuration options. To view the panel, click on Appearance > Yellow Hats Option in the left-hand menu. Here you have the ability to alter many core aspects that make up how your theme looks and behaves. Any of the options that have some ambiguity to them conviently have descriptions to explain their purpose.
With our built-in importer, you will be able to get your site ready in a flash. Simply select a layout and click Import now to start importing demo data.
You can select an image file in your library or upload a new file from your computer to set as logo. Follow the steps below to set up your logo:
Result for logo:
Your logo will appear on the Header as below:
Result for logo sticky:
On this section, Yellow Hats theme had some available fonts for you. If you want to set a special font for a special class, you only need to insert your class into Selector section, and choose the font that you want on the Font dropdown box. Finally, you click Save changes and see your result, all completed.
1. Copy class that you want to change.
2. Select Font Family, Font Weight & Style and paste class on Selector section.
Visual Composer is a powerful Wordpress page builder that allows you to create complex page layouts without touching a single line of code. To switch to Visual Composer's Backend Editor, click on this button:
When Visual Composer's editing pane comes up, click on either of these buttons to Add Element.
A shortcode selecting panel will show up, you can see all the shortcode available in the theme. Select the one you would like to use.
You will then encounter a setting panel for the shortcode (each shortcode has it own setting options), after a bit of configuration, it will show up nicely on your page.
CMS Google Map allows embedding a google map in Yellow-Hats style.
After creating pricing items, it's time to display them in a page using CMS Grid shortcode.
After creating project items, it's time to display them in a page using CMS Grid shortcode.
After creating posts items, it to display them in a page using CMS Grid shortcode.
After creating several member profile items, it's time to display them in a page using CMS Grid shortcode.
After creating services items, it's time to display them in a page using CMS Grid shortcode.
After creating testimonial items, it's time to display them in a page using CMS Carousel shortcode.
After creating client items, it's time to display them in a page using CMS Carousel shortcode.
Our themes are optimized by with H1, H2, H3, H4, H5 tags, clean code, HTML5 but if you want to get higher ranking on search engines, you must need some help from SEO plugins and Google Pagespeed Service:
You can update our theme using some ways bellow1. Update theme using Envato WordPress Toolkit
2. You can update manual theme
If you have any troubles while using auto update ( It is likely to be a permissions issue ) then you may want to manually update the theme via FTP or Cpanel.
Download the latest version of the theme on ThemeForest download page and simply replace with the old one via FTP or Cpanel.