1. Theme installation
To install this theme you must have a working version of WordPress already installed. For information in regard to installing the WordPress platform, please see the WordPress Codex.
1.1 Upload theme via FTP application
- First you must unzip the file you downloaded from Themeforest.
- There you will find a file named
goliath.zip. Now unzip this file.
- You should see a folder named goliath
- Upload this folder to /wp-content/themes/ location in your WordPress installation.
1.2 Upload theme via WordPress admin panel
- Open your WordPress admin panel, go to Appearance and choose Add New
Click Upload Theme and choose the
goliath.zipYou can find the goliath.zip file by un-zipping the file you downloaded from ThemeForest.
Upload only the
goliath.zip file. If you have a "missing stylesheet" issue, then you have not un-zipped the original file and you are uploading the wrong one!
If you are seeing a "Are you sure you want to do this?" warning, then this usually means, that the theme file is too large for your server to upload using wp-admin. In this case you must use the FTP method instead.
Once upload has finished, activate your theme in Appearance / Themes in WordPress admin panel.
1.4 Install required plugins
Goliath relies on number of plugins for various theme features. Without out them you will not be able to use many of the theme features. See Installing required plugins.
1.5 Set up Home & Blog pages
Once activated Goliath will prompt you to create couple of default pages, among them - Blog and Homepage. If you click the link in prompt, these pages will be automatically created. They will be assigned as your new front page and posts pages. You can later edit these settings under Goliath > Visual editor > Static Front page.
1.6 Regenerate post thumbnails
If you are installing the theme on a WordPress site where you already have posts and pictures it is bly advised that you regenerate thumbnails! That can be achieved with Regenerate Thumbnails plugin which is already bundled with the theme. Once you have activated the plugin, go to Tools / Regenerate thumbnails in WordPress admin and run the regeneration process.
1.7 Import sample content (optional)
To make things easier with initial setup, we have provided you with sample content that you can import in your wordpress site. It is located in the folder you downloaded from Themeforest. There you will find 4 files -
everything.xml, galleries.xml, pages.xml and posts.xml. Everything.xml will hold all of the posts, pages, images, woocommerce products, bbpress forums etc. The other 3 will just contain posts, pages and galleries as indicated by their name. You can import it using wordpress admin. Go to Tools / Import. From the list select "Wordpress". Choose the aforementioned file and upload it.
Importing demo content will provide you with the same posts, pages etc as seen in the demo sites. You will still however have to setup menus and widgets.
If your site already has preexisting posts and pages, then importing sample content is not recommended.
2. Theme settings
Open admin section for your WordPress blog. You can find it by typing your domain name + /wp-admin/. Once you have opened the admin, you have to click on Goliath at the top left corner of screen. There you will find theme settings.
Theme settings have 7 sections:
- General settings - add logo, setup themes header, footer blog, post etc. settings.
- Visual editor - edit visual settings. This takes you to wordpress theme customiser that allows you to change various colors, fonts and images and see the results immediately.
- Advertisement - create and manage banners and google ads.
- Sidebar Manager - Create new sidebars and assign them to different locations.
- Google Fonts - select which Google Fonts should be made available for use in Visual Editor
- Backup & Reset - export your theme settings and import them into another instance of Goliath. This is handy when you are setting up the theme locally and publishing it later on a different server. Also allows you to reset theme settings to defaults.
- Help & Support - view theme documentation and Planetshine support contact info.
2.1 Setting up your custom logo
Go to theme settings and open the General tab. There you will find section called "Logo". It offers you two types of logos - textual and image.
If you enable Use logo image you will see an upload field and alt text field. Click on the "browse" button and select your logo from your computer. Click save on the bottom of page and that's it! You should also provide an ALT text which will be show if your image ever fails to load on the front page.
If you do NOT enable Use logo image the theme will display your site name as the logo.
3. Installing required plugins
Goliath relies on number of plugins for various theme features. Some are required - without them important theme features will not be available. For example, you need Attachments in order to have the galleries. Other plugins are just recommended - they provide extra functionality that the theme supports, but it is in no way essential. For example, if you don't need a shop, then you can avoid installing WooCommerce.Installing plugins is easy. Right after you activated the theme a prompt will appear asking you do this. Click the Begin installing plugins link (see images below).
Some of the plugins, like Visual Composer and Slider Revolution might offer you the option of registering them. This is not required to use them and you have to dismiss these options because plugins that where acquired via bundles can't be activated. This feature is reserved only for plugins that where bought separately. Regardless this will have no effect on the plugins functionality and you will be able to use all of the features.
5. Setting up homepage
If you used the auto page install feature after activating the theme, Goliath will have created and set up a homepage for you. This page will be called Homepage and you can find it and edit it under Pages in your wp-admin. To create a homepage like the one seen in theme demo, Visual Composer plugin must be enabled!
Homepage layout is made with Visual Composer plugin (also included with Goliath for free, but normally has to be bought seperately). It's a extremely powerful tool that allows you to build custom layouts by dragging and dropping elements. By default Goliath has already generated the content for you, but you can edit it easily using Visual Composer (learn more about it by checking out the Visual Composer documentation.)
If you allow the theme to automatically install the home and blog pages, then homepage will have the visual composer structure set by default. If you do this manually make sure you set the page template to Homepage. This can be done using the select box in left hand side of page editor in wp-admin.
5.1 Homepage Visual Composer Blocks
Full width homepage element. Display 5 posts arranged in a mosaic like arrangement. The elements features a "Load more stories" button that dynamically loads 5 more items. Content can by filtered by post categories and tags.
Full width homepage element. A slider with 4 posts in every slide. There is an optional (off by default) slide auto advance feature that can be turned on by entering "interval" value. Content can by filtered by post categories and tags.
Post List With Slider
2/3 width homepage element. Displays a list of posts that can be filtered by post categories and tags. Right next to it is a slider. This slider get's it's posts from the same data source as the post list, but it can be further filtered with an additional tag. For example it could only shows posts that have a tag "slider" etc. There is an optional (off by default) slide auto advance feature that can be turned on by entering "interval" value.
Post List With Heading
Variable width element (works best with less than 50% width). Displays a list of posts that can be filtered by post categories and tags. The featured image is selected by taking the first post from matching set of posts that is checked as "featured" in post settings. If no post is checked, then the newest post is displayed as featured.
Horizontal Post List
2/3 width homepage element. Displays a list of 3 elements that are positioned next to each other horizontally. List of posts can be filtered by post categories and tags.
Full width homepage element. A slider with 4 galleries in every slide. There is an optional (off by default) slide auto advance feature that can be turned on by entering "interval" value.
Always make sure that you have selected the "homepage" template for the page that you are building with Visual Composer
5.2 Homepage slider
There are 2 ways to set up the homepage slider - in regular and full width mode. Regular mode will require you to insert the slider just like any other visual composer element.
Unlike the regular slider, the full width slider will occupy 100% of your screen width. It's used in Goliath Fashion Demo. To set it up go to WordPress wp-admin page editor. Scroll down to the bottom of page and use the textbox "Full width Revolution Slider Shortcode (Optional)". There you must paste a full shortcode for the slider you wish to use. For example:
Revolution slider example shortcode
You can create or import new sliders by going to Revolution Slider in wp-admin menu.
6. Visual Composer elements for pages
Goliath has couple of powerful custom made Visual Composer elements that can be used to better display reviews, structure your posts etc.
6.1 Review Summary
This is an awesome tool for summarising your reviews - showing the main positives and negatives about the product. The positives and negatives have to entered in their respective text fields and each of the has to be in a separate line. The ratings are a bit more tricky. A Custom shortcode is used for this. For example to create a rating for design that's set as 1 out of 5 stars you have to enter this:
[rating title="Design" value="1" range="5"]
See the screenshots below for more info:
6.2 Gallery post embed
This VC element allows you to create a gallery embed item leading your visitors to a gallery. It is extremely easy to use - just select the gallery you want to embed in the select box and click to save the changes.
6.3 Text block with navigation
The theme offers you to create floating navigation bar for your posts and pages. This navigation will follow the browser window as you scroll and display in which section of page your currently are. It can also be click to jump to certain section. This block is what enables this.
To create this, you need to split your text into sections. This can be done by using "Text block with navigation" VC element. Use this to construct your post's content. See the image below:
For the navigation to appear on the page, you first have to enable it. This can be done by checking in the "Show navigation bar" at the bottom of page editor.
7. Setting up and using Ads
Goliath provides all the necessary features for displaying custom banner ads and google ads on your site. Ads can be managed by going to Goliath theme settings page in wp-admin, then clicking Advertisement in the sidebar. Goliath supports 4 different ad sizes - 728x90px, 468x60px, 300x250px and 150x125px (group of 4). For each of the sizes you can create as much ads as you want - there are no limits.
Advertisement section has two sub sections - Manage and Locations. The Mange section is used to create, update and delete ads. Locations section allows you to assign these ads to any one of the predefined theme locations. On top of that you can also insert banners ads in sidebars using widgets, or in pages using visual composer content blocks made especially for the Goliath.
Mange section is divided in sub sections according to ad sizes. For each of the ad sizes there is an existing default one that you can edit right away. You enable/disable individual ads, give them titles (useful when managing ad locations), upload banner image and set banner link. If you wish to use Google ad instead of regular banner, select "Type of ad" to be Google AdSense and then paste the Google AdSense code in the text field.
Location section list all the supported locations for ads in the theme. You can enable the location by checking it in. After that you also have to enable ads in by checking them in as well. If you have multiple ads check in a single location, they will be randomly rotated.
Below each banner size there is button Add new image banner or Google AdSense. Click this to add a new ad for this size.
The Ads section will not work if you have Ad Blocking plugins installed on your browser
Alternatively you can also include ads into pages using Visual Composer blocks proved by the theme.
8. Post features
8.1 Featured posts
Each post has a checkbox that allows it to be selected as featured. These featured posts can then be displayed in blog sections independently from any categories and tags they may have.
In theme settings, at the blog section you can choose how to select the posts that will be shown as featured. The default method is to use the checked in ones, but you can also optionally select them by custom category.
8.2 Popular posts
If you have installed and activated the Wordpress Popular Posts plugin (it came bundled with the theme), the Goliath will mark the 5 most read posts in the last 7 days as "hot". This works by counting the visits each posts gets and finding the most popular posts. This plugin also enables the functionality of "Popular" section of Goliath Post Tabs widget.
Goliath is very well suited for product review sites and it provides couple of special features that are specific to reviews. The most important feature is the ability to assign a one-to-five star rating to post. This rating will be displayed where ever the post get's displayed. You can do this by editing the post in question and selecting "Stars (for reviews)" value to anything other than "Disabled".
The theme will also automatically mark the review content in such a way, that will make it appear in Google search results as a review.
Goliath offers the possibility to create photo galleries. That can be achieved by going to Galleries section in wp-admin and clicking "Add new" button at the top of the page
First set a title and description just like you would for any regular post or page. Then scroll down to Gallery section right below the description text field. Note: plugin Attachments has to be installed and activated for this to work!
Click the Attach images button and add any number of images either by selecting them from your WordPress media library or uploading them from your computer. Once that's done you can adjust the order of images and add captions where necessary.
If you have enabled "pretty" wordpress permalinks, then you can view the gallery by going to http:// YOUR_SITE_URL + /gallery/.
In addition to numerous custom Visual Composer elements the theme has a text based shortcode that you can user in cases when you need styled list.
[button link="#"]Click me![/button]
[button text_color="#ff5732" background_color="#e7e7e7" icon="flag" link=""]Click me![/button]
[list type="check"] [list_item]One[/list_item] [list_item]Two[/list_item] [list_item]Three[/list_item] [/list]
Possible list types are:
10.2 Info box
[info_box title="Info box"][/info_box]
[info_box title="Info box" type="warning"][/info_box]
Possible box types are:
- regular (default)
11. Excerpts for posts with Visual Composer content
Excerpts are the first 20-50 words of post that are shown on homepage, blog, search pages etc. These are normally generated automatically and you don't need to worry about them. However when using Visual Composer to build the layout of posts (not pages) the excerpt may not get generated. In these cases you have to set it manually. This can be achieved by doing the following:
- 1) Click Screen Options in the top right corners of wp-admin.
- 2) Check in Excerpt
- 3) Close the Screen Options and scroll down till you see the Excerpt field
- 4) Enter the excerpt text for this post and save.
12. Updating the theme and bundled plugins
12.1 Updating theme
To update the theme, follow these steps:
- Head over to Appearance / Themes in your wp-admin
- Activate a different theme (for example twenty twelve)
- Delete the current version of Goliath
- Download the update from Themeforest and get the
goliath.zipfile. If you downloaded the “All Files & documentation” from Themeforest, then you need to unzip the archive file you received, the goliath.zipwill be inside of it
- Click on Install themes and upload the
- Activate it and install updates for bundled plugins where necessary.
If you get a “Are You Sure You Want To Do This” message when installing update, it means you have an upload file size limit. Install the theme via FTP if this happens, or increase the PHP file update size limit.
12.2 Updating plugins
WooCommerce, Contact Form 7 and other regular plugins can be updated using WP plugin section. However the premium plugins - Revolution Slider, Visual Composer, Ultimate Addons and Constellation Menu can only be updated together with the theme. After installing a theme update you will be presented with a notification message offering to install the updates. It will be very similar to the one you used to install the plugins when you first activated the theme.
13. Layout and Assets
This theme has a Responsive layout with one or two columns (varies for different sections). It's based on Bootstrap 3.3 and it's markup is structured according to bootstrap best practices. This theme has 3 different layout modes:
- Normal (for 970px and larger screens)
- Tablet (for 768px to 970px screens)
- Mobile (for screens smaller than 768px)
Adjust your browser window size to explore them closer. Goliath uses lots of HTML5 and CSS3 features, so it will NOT support legacy browsers such as Internet Explorer 6, 7 & 8.
13.2 CSS files
All the CSS files are located in theme/assets/css/ folder. Most of the theme's CSS is in
main.css, but mobile design is specified in mobile.css and tablet specific design is in tablet.css>. Additional stylesheets exist for the underlying bootstrap platform, but you should never edit these. Styling specific to WooCommerce is located in woocommerce.css; bbPress CSS is in bbpress.css file.
If you wish to edit the themes styling, it's best if you do this using WordPress child theme. That way you will simplify updating the theme in future.
theme.js and this is the only file you may ever need to edit.
It is comparatively easy to find what you need to edit in
theme.js. Just open the file and look for init function. It initialises all other functions which you can recognise by the name.
14. Translating the theme
Goliath can be translated using the same tools and methods as the rest of WordPress - using POT language files. The language file for this theme can be found in languages folder in theme files. There you will find a file called
Once you have the POT file, you’ll need to open it in a program like POEdit, and translate the English language into your preferred language. When complete, you’ll want to save the file twice, as two separate files – a .po file and a .mo file. When you save the files, you must name them according to your country and language code. For example, the language code for English is en_EN, so you would save the translated files as
en_EN.po first, then en_EN.mo. When that’s done, simply upload the files to your themes languages folder.
Finally head over to Settings > General in wp-admin and select your desired language using the "Site Language" option and save the changes.
You can read more in-depth guide on translating themes here.