Theme documentation

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.

You have two options for uploading the theme - to use FTP application or upload tool in WordPress admin panel. Once you have uploaded the theme you must activate it.

1.1 Upload theme via FTP application

  • First you must unzip the file you downloaded from Themeforest.
  • There you will find a file named planetshine-polaris.zip. Now unzip this file.
  • You should see a folder named planetshine-polaris
  • 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 planetshine-polaris.zip You can find the planetshine-polaris.zip file by un-zipping the file you downloaded from ThemeForest.

Upload only the planetshine-polaris.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.

1.3 Activation

Once upload has finished, activate your theme in Appearance / Themes in WordPress admin panel.

1.4 Install required plugins

Polaris 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 or import full theme demo

Once activated Polaris 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 Polaris > Visual editor > Static Front page.

Alternatively you can import full theme demo using the Status & Import / Demo Import menu in Theme Settings. Read more about importing demo content.

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.

2. Check theme status

To ensure that Polaris will work great on your server, you should check Status Page immediately after the theme activation. It will show you if your Wordpress and hosting are set up appropriately for running Polaris. Status page can be accessed by accessing Polaris Theme Settings and selecting Status & Import.

2.1 Troubleshooting status page issues

There are 7 things that are checked in the status page:

2.1.1 Install and activate theme
If you see this message, you have already succeeded. Yay!

2.1.2 Install required plugins
See Installing required plugins.

2.1.3 Import or setup home and blog pages
See Creating homepage and blog pages and Importing theme demo.

2.1.4 Resize thumbnails for pre-existing posts
See Resize thumbnails for pre-existing posts.

2.1.5 Make the uploads directory writable
See Changing File Permissions.

2.1.6 Enable PHP file_put_contents and file_get_contents functions
To achieve this you have to edit your servers php.ini file. Chances are that this can be only done by your hosting administrator so you should contact them and ask for enable these two functions. For advanced users - this thread details how to disable functions in PHP. Enabling them is the exact reverse process.

2.1.7 Set PHP allocated memory limit to at least 128mb
This article details approaches that can be taken to achieve this: Increasing the WordPress Memory Limit.

2.1.8 Install PHP GD library on your server (used for image resizing)
Your hosting provider can help you with this, but if you have advanced system administration skills you can try following this article.

3. 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 Polaris at the top left corner of screen. There you will find theme settings.

There are 9 sections in the theme settings:

  • 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.
  • Register Theme allows you to insert all the necessary info to enable theme updates via WordPress admin
  • Status & Import see the theme setup checklist; import full theme demo or just couple of pages and load style presets.
  • Advertisement create and manage banners and google ads.
  • Product brands manage brands that are displayed in various places in the theme.
  • 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
  • Help & Support view theme documentation and Planetshine support contact info.

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 select Image logo 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 select a Textual logo the theme will display your site name as the logo.

4. Installing required plugins

Polaris 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 Visual Composer to use static home page or Slider Revolution in order to have the home page slider. Other plugins are just recommended - they provide extra functionality that the theme supports, but it is in no way essential.

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. Importing theme demo

If you are starting a brand new WordPress site you can take benefit of Polaris demo import feature. What this does it creates pages, posts, product menus etc. that you can see in the theme demo site. This can simplify taking the first steps towards customising the site to your needs.

To import theme demo go to Polaris / Status & Import / Demo Import in your sites wp-admin. Pick one of the demos and click import.

Please make sure you have installed and activated all the required plugins before importing the demo content. Also it's recommended to complete the WooCommerce setup wizard.

Once you have imported the demo you can also try any of the other ones. All you have to do is uninstall the current demo and pick another one.

Warning: uninstalling a demo will delete ALL the content that was created during the install even if you modified it afterwards.

An alternative for importing demo content is to use WordPress XML files. 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, pages.xml, posts.xml and products.xml. Everything.xml will hold all of the posts, pages, images, woocommerce products etc. The other 3 will just contain posts, pages and products 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.

Sample XML content method will not produce a fully working demo page since it only inserts the content but does not set up things like menus, sidebars, colors etc.

7. Setting up homepage

If you used the auto page install feature after activating the theme, Polaris 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 Polaris 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 Polaris 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.

7.1 Homepage Visual Composer Blocks

Product slider

Full width homepage element. Display 3 or 4 columns of products in a slider.

Product category live switcher

Full width homepage element. Select product categories to show. Your customers can use dropdown to switch between them dynamically.

Special product collection live switcher

Full width homepage element. Select product collection (for example, best sellers, recently added etc) to show. Your customers can use dropdown to switch between them dynamically.

Special offers

Full width homepage element. Display your special offers with image, description and call to action button.

Full width homepage element. Show the brands whose products your customers can purchase on your shop. Link each of them to product selections etc.

Contacts map

Full width homepage element. Display a Google Maps locations of your store. Overlay it with other contact details - phone numbers, address etc.

Welcome block

Display a text and an image welcoming customers to your site. You can use this block for quick introduction to what your site is about.

Title block

Add a Polaris style title above other Visual Composer elements

Post list

Display a blog post list on the homepage.

Product feature - for use in products, not homepage

Product description element. Show off your products amazing features. Each block has an image and description.

Always make sure that you have selected the "homepage" template for the page that you are building with Visual Composer

7.2 Setting Visual Composer elements to full screen width

By default all Visual Composer rows will be limited in width to 1170px - the size of content box. To have them be as wide as browser window you can add the CSS class "full-width".

7.3 Homepage slider

There are 2 ways to set up the homepage slider - in regular and full screen mode. Regular mode will require you to insert the slider just like any other visual composer element. Such a slider can be seen in Polaris Fashion Demo.

Unlike the regular slider, the full page slider will occupy 100% of your screen height and will also change the style of header making it semi transparent and moving the dock to bottom of screen. It's used in Polaris Coffee Demo. To set it up go to WordPress wp-admin page editor. Scroll down to the bottom of page and use the select box to choose a slider. "Disabled" is the default option and if you do not yet have any sliders created, it's also the only option. You can create or import new sliders by going to Revolution Slider in wp-admin menu.

8. Setting up and using Ads

Polaris provides all the necessary features for displaying custom banner ads and google ads on your site. Ads can be managed by going to Polaris theme settings page in wp-admin, then clicking Advertisement in the sidebar. Polaris supports 3 different ad sizes - 728x90px, 468x60px and 300x250px. For each of the sizes you can create as much ads as you want - there are no limits.

The Ads section is used to create, update and delete ads. You can insert banners ads in sidebars using widgets, or in pages using visual composer content blocks made especially for the Polaris.

Mange section (see image below) 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.

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

9. Using brands

Brands are basically image banners that can be linked freely to any page in your site. Usually you might want to link them to category, tag archive page with the products that this brand applies to. You can add brands carousel to your pages using a Visual Composer element or by enabling this in the Polaris / Footer settings in wp-admin.

To create the brands go to Polaris / Product Brands in your wp-admin. There you will find a form that allows you to upload and image and assign it a link. Once you have added your brands, you can change their order by dragging and dropping them.

To add the brands to a page, such as homepage, open the page edit in visual composer and click the large plus button. Select Polaris section and choose "brand carousel".

10. Shortocdes

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.

Default usage:

[list type="check"]
	[list_item]One[/list_item]
	[list_item]Two[/list_item]
	[list_item]Three[/list_item]
[/list]
					

Possible list types are:

  • check
  • slash
  • check
  • circle

11. Google maps

Polaris allows you to add a specially styled Google Maps element to your homepage, but doing this requires you to first get an API key from google. Once you have it, you have to paste it in the Polaris theme settings in wp-admin under the section "Google Maps". You can find exact instructions for obtaining an API key here. This will require you to have a Google account.

12. 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.

13. Updating the theme and bundled plugins

13.1 Automatic theme update

To update the theme automatically, follow these steps:

  • Head over to Polaris / Register Theme in your wp-admin
  • Follow the instructions there to register your theme
  • Go to Appearance / Themes and update your theme by clicking the update link

13.2 Updating theme manually

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 Polaris
  • Download the update from Themeforest and get the planetshine-polaris.zip file. If you downloaded the “All Files & documentation” from Themeforest, then you need to unzip the archive file you received, the planetshine-polaris.zip will be inside of it
  • Click on Install themes and upload the planetshine-polaris.zip file.
  • 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.

13.3 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.

See Installing required plugins.

14. Layout and Assets

14.1 Layout

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 4 different layout modes:

  • Large (for 1170px or wider screens)
  • Medium (for 970px to 1170px screens)
  • Tablet (for 768px to 970px screens)
  • Mobile (for screens smaller than 768px)

Adjust your browser window size to explore them closer. Polaris uses lots of HTML5 and CSS3 features, so it will NOT support legacy browsers such as Internet Explorer 6, 7 & 8.

14.2 LESS & CSS files

Polaris stylesheets are created using LESS technology. LESS files are located in /theme/assets/less folder. After editing LESS files theme will automatically compile them in one CSS file. There is also a /theme/assets/css folder, but these files are only used as a backup in cases where because of problems with server configuration it's impossible to compile LESS.

The main LESS files are:

  • polaris.less
  • polaris-woo.less
  • polaris-medium.less
  • polaris-small.less
  • polaris-extra-small.less

polaris.less and polaris.woo contain styling for the largest screensizes, while the others deal with responsive behaviour for small laptops, tablets and smartphones.

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.

14.3 Javascript files

All the Javascript files are located in theme/assets/js/ folder. This theme uses jQuery Javascript library and many plugins and custom built scripts. All the theme specific behaviour is written in theme/assets/js/theme.js.

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.

All of the third party Javascript files used by the theme are located in theme/assets/js/vendor/ folder. These you should avoid modifying in any way.

15. Translating the theme

Polaris 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 default.pot

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.

16. Where to find my API key?

Login to Themeforest, go to your dashboard and click on My Settings. The API Keys screen allows you to generate a free API key. Give it a title and click the Generate API key button. Themeforest will now generate a sequence of letters and digits that you can now copy and paste in the theme settings page to enable auto updates.

17. Setting up newsletter

We are using MailChimp to configure our newsletter form, but there are a lot of services and plugins you can use. Follow these steps:

  • Go to http://mailchimp.com
  • Register and account if you do not already have one, and log in.
  • Go to section "lists" and click on "create list"
  • Fill in all nedded fields and click on Save at the bottom of the page.

  • Now open your new list and select the "Signup forms" tab. Click on "Embeded forms".
  • In the page that opens, click on "Naked" tab.

  • Copy the code found at the bottom of page and paste it into text editor like notepad.
  • In the text, find a line that' similar to this one "<form action="http://planetshine.us7.list-manage1.com/subscribe/post?u=c908dbcccecb685633e7e0458&id=314fef872f">"
  • Copy the action value (it will be similar, but NOT the same as in the example above). To clarify. Action value is only this part: http://planetshine.us7.list-manage1.com/subscribe/post?u=c908dbcccecb685633e7e0458&id=314fef872f
  • Now open your wp-admin, and go to Appearance > Widgets. Insert "Polaris Footer Menu & Newsletter" into "Footer".
  • Now move on to Theme settings and open "Footer" section. Paste the form action value into the "Newsletter form action" field.
  • Select form action value "Post"
  • Enter "email field name" value "EMAIL"
  • Click save

Thank you so much for purchasing this theme!