Unitheme - WordPress Multipurpose Retina-Ready Premium Theme

# UNITHEME - WORDPRESS MULTIPURPOSE PREMIUM THEME

#### Table of contents

- Installation
- Import
- Customization
- Blog
- Portfolio
- Page
- Widgets
- Visual Composer
- WooCommerce
- WPML
- Ninzio Slider
- Separate Blog page and Front page
- Cross Browser/Platform Ninzio Slider Video
- Menu
- How to add portfolio archive pages to the menu?
- Translation
- WPML
- Optimization

## Installation

Unitheme theme contains:

- Help documentation
- Sample data (xml data for demo purposes)
- Theme itself

Theme is located in unitheme folder, you can upload it to your server via FTP, Install it from WordPress admin. Or if you are using local host, like WAMP, XAMPP or MAMP you can put unitheme folder direct to wp-content > themes folder and it will be available to you from WordPress admin.

###### Installation process

###### Regenerate Thumbnails

Download Regenerate Thumbnails Plugin Allows you to regenerate your thumbnails after changing theme. If you install unitheme theme on your existing wordpress installation, you need to regenerate your thumbnails to be compatible with unitheme theme thumbnails sizes, otherwise you need to resubmit all your images by hand.

###### Permalinks

Once you installed unitheme theme you need to change permalinks structure to enable portfolio and faq custom post types. To do that you need to go to your WordPress admin >> Settings >> Permalinks and change your permalinks to custom one: (/%category%/%postname%/). Do not forget to save changies.

## Import

Unitheme has 14 demos' data (xml and json) files. To import xml files follow these steps:

- Go to Wordpress dashboard >> Tools >> Import
- From list of options choose Wordpress (If you don't have wordpress importer installed, wordpress will ask you to install plugin, follow install steps)
- After you installed wordpress importer plugin, you can now import xml files
- Choose xml file you want to import, asign author and you are done!

To import options for theme use options.json file. Open that file with plain text editor (such as notepad), copy all data, go to theme options >> import/export >> Choose Import from file, paste copied code, and click Import, you are done!

## Customization

unitheme theme comes with a lot of customization options. Let us take a look at full list of customization options. All theme customization is located in "Theme Settings" submenu, found under "Appearance" menu. Here you can see all options are grouped into logical sections. Each customization option is descriptive by itself, however let us dive into some most important sections.

###### One page

You can have 2 types of one-page navigation - with bullets or header menu. If you choose header menu as one-page layout navigation, you can external links also, just pass menu ids in pne page menu filter. One page layout hash option is usefull if you want the url in browser window change with navigation. To have one page layout active, go to page extended options, found under udetor in page edit page and activate checkbox for one-page. And your page will have one-page layout.

###### Google analytics

Insert your Google Analytics tracking code here. Be careful when pasting tracking code: DO NOT PASTE YOUR CODE WITH
tag

This is WRONG :(

    <script>
    	var _gaq = _gaq || [];
    	_gaq.push(['_setAccount', 'UA-XXXXX-X']);
    	_gaq.push(['_trackPageview']);

    	(function() {
    	var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    	ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    	var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    	})();
    </script>

This is RIGHT :)

    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-XXXXX-X']);
    _gaq.push(['_trackPageview']);

    (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();

###### Header options

unitheme has advanced header customization options. You can control mobile header independently from desktop header. Also header can have 3 differet states: static, stucked and fixed. And all states can be controlled independently. Rememeber, whether you plan to use only stuck menu, or only static, we recommend to style all header states this way:

- Style static (main header state)
- Style mobile (if not styled some options will be inherited from static state)
- Style stuck state (if not styled some options will be inherited from static state)
- Style fixed state (if not styled some options will be inherited from static state)

Also remeber, you can switch menu state from static to stuck on each page independently, using page extended options, found in page edit page under editor. Blog, Portfolio and Shop also have this functionality. In Portfolio and Blog you can control header state for each post/project independently.

###### Typography

In typography we want to highlight custom font upload. All other options are descriptive. Upload custom fonts here (eot, woff,truetype, svg formats). in Custom @font-face CSS Styles place @font-face code

    @font-face{
    	font-family: 'MyWebFont';
    	src: url('http://yoursite/wp-content/uploads/WebFont.eot');
    	src: url('http://yoursite/wp-content/uploads/WebFont.eot?iefix') format('eot'),
    	     url('http://yoursite/wp-content/uploads/WebFont.woff') format('woff'),
    	     url('http://yoursite/wp-content/uploads/WebFont.ttf') format('truetype'),
    	     url('http://yoursite/wp-content/uploads/WebFont.svg#webfont') format('svg');
    }

Where MyWebFont is the name you give to ypur custom font. Url is the absolute path to uploaded font files.

To assign custom font to main font family paste this code in custom css styles (theme options >> styling >> custom css styles)

    body, button, input, pre, code, kbd, samp, dt,
    .widget_icl_lang_sel_widget a,
    .widget_tag_cloud .tagcloud a,
    .widget_product_tag_cloud .tagcloud a,
    .social-links a span,
    .woocommerce .quantity input[type="button"].minus,
    .woocommerce .quantity input[type="button"].plus,
    .widget_nav_menu ul li a,
    .nz-counter .count-title {
    	font-family:'MyWebFont';
    }

To assign custom font to headings font family paste this code in custom css styles (theme options >> styling >> custom css styles)

    h1,h2,h3,h4,h5,h6,
    .nz-pricing-table .column .title
    .nz-circle .title {
    	font-family:'MyWebFont';
    }

To assign custom font to buttons font family paste this code in custom css styles (theme options >> styling >> custom css styles)

    button,
    input[type="reset"],
    input[type="submit"],
    input[type="button"],
    .button {
    	font-family:'MyWebFont';
    }

###### Social options

This option group gives you control over social elements in your website. First option is recent tweets customization. To get configuration options you need to create a twitter app and get twitter API attributes. Don't panic, we are going to cover this process step by step.

- Visit the Twitter Developers Site http://dev.twitter.com
- Sign in with your Twitter Account
- Go to "My Applications"

Once you’re logged in, click on the downwards arrow to the right of your Twitter image and select “My Applications”. This is where all your registered Twitter apps will appear. Create a New Application. If you are new to the Developers site you won’t see any applications registered. wither way, it’s time to create our first application. To do this, click on the big “Create a new application” button.

Fill in your Application Details. It's been easy so far, but this screen often makes people confused. Don't worry, it's a lot easier than you think. First of all you need to give your app a unique name(one that no one else has used for their Twitter app). Since we're going to create app for personal use and not one that other people can register and use, just put your domain name in or perhaps even your name. You don't have to worry much about the description– you can change this later. Put your website in the website field– don't worry that it isn’t (as Twitter ask) your application's publicly accessible home page. However, this website will be where your app is hosted. Ignore the Callback URL field. Once you've done this, make sure you’ve read the "Developer Rules Of The Road" blurb, check the "Yes, I agree" box, fill in the CAPTCHA (don’t you just love them) and click the "create your Twitter Application" button. Hurrah!

If entered values are valid you will be taken to your oAuth settings page, were you can get your consumer key and consumer secret, ignore other information. We now need to authorise the Twitter app for your Twitter account. To do this, click the "Create my access token" button. This takes a few seconds, so if you don’t see the access tokens on the next screen, you may have to refresh the page a few times.

This access token will allow your Twitter application to read Twitter information. Once you've seen your access token and access token secret copy them and paste in appropriate text fields in option panel. The last two things that you need to do is provide twitter user ID to display tweets and numver of tweets to display. To get twitter user ID just copy username from url and paste it (example https://twitter.com/tutsplus copy tutsplus).

## Blog

Unitheme comes with 10 post format (Standard, Aside, Audio, Video, Image, Gallery, Link, Quote, Status, Chat). Also we prepared useful functionality to make your posting more flexible. We are not going to cover all post formats here, bacause they are simple to use, just like regular standard post format. We will just highlight special moments of some formats.

###### Chat format

Chat post format supports title, content, categories, tags. To display chat you need to enter in content area your chat with this pattern:

    Jain: hello, John, how are you?
    John: hello, Jain, i am ok, what about you?

Be sure not to format this pattern, just paste plain text, because regular expression that handles chat format works exactly for this pattern.

Also each post can have separate styling for single post page title section

## Portfolio

Unitheme theme comes with custom post type Portfolio. We created handy tools to make your portfolio look beautifull and professional. Portfolio supports 4 formats: image based portfolio (good, if your projects presentation best way are images), gallery (just like image format, only know you can have up to 5 images as featured per project), video (if you have video content to present) and audio (for audio projects). Also portfolio supports categories, tags, titile, content, and project details custom fields (Client, and Project Url).

Portfolio supports predefined portfolio layout and one per project based layout – solo layout, this one is used to create custom structure of project, using shortcodes. Is good, if you want your single project page look like project landing page. This options is controled via project extended options per project.

All extended options are simple and easy to use, that is why we will not cover all options. Also you can have different project page title look using extended options of page title styling (Rich header). If you want to have custom layout for each project, just activate Solo layout checkbox.

## Page

Unitheme theme provides you a good portion of handy options to manage each page individually. In this section we are going to cover them. By default unitheme theme supports title and editor for pages and also page attributes metabox. Also we created several additional custom options for pages that can be found under editor. Let us take a look at most important of them.

###### Full width

By default pages' content area is located in container with max-width limitation of content area - 1200px; If you activate full width option, there will be no max-width limitation for content area, it will be 100% of screen width. This option is very handy if you want your page layout to be constructed with full-width page sections.

###### Rich header styling

Each page rich header can be styled independently. You can set title, choose rich header background image, background color for rich header. Just make sure your image is large enough (in width and height). Because your uploaded image will cover rich header background area.

## Widgets

Unitheme theme comes with 8 widget areas and 7 custom widgets. Let's highlight most important customization of several custom widgets:

###### Facebook Like Box

Facebook like Box widget has its options:

- Title (Just like regular wordpress widgets title)
- Facebook page URL – enter the url of facebook fan page here, make sure it is valid url
- App Id from the App dashboard. Don't panic, we will explain how to get App Id.

Go to this links https://developers.facebook.com/apps/?action=create. You should see modal window with some fields.

- Give a unic name to your app
- Ignore app namespace
- Press continue
- Enter security code
- If everything is ok, you will be taken to app dashboard, here you can take App ID

- Show faces – Specifies whether to display profile photos of people who like the page.
- Show border – Specifies whether or not to show a border around the likebox.
- Show stream - Specifies whether to display a stream of the latest posts by the Page.
- Show facebook header - Specifies whether to display the Facebook header at the top of the likebox.

###### Photos from Flickr

Allows to display up to 10 photos from flickr. Just enter number of photos & flickr username (Flickr username or flickr id isn't actually the username you login with but rather a unique ID generated by Flickr. Its a slightly strange set of numbers at letter with an '@' symbol towards the end. For example12341234@N12

Finding it can sometimes be tricky, often its visible in the URL (take a look at the pic above) you see when you are browsing your photos, or there are numerous online tools that find it. Some useful online tools that will get your flickr id are:

- http://idgettr.com/
- http://www.adamwlewis.com
- http://flickrseek.com/

###### Mailchimp

To make mailchimp subscribe form work properly, you need some customization. Go to http://mailchimp.com/, sign in, go to lists >> Signup forms, select Embedded forms, and choose Super Slim, and from code give output action attribute from form and name attribute from input.

    <!-- Begin MailChimp Signup Form -->
    <link href="//cdn-images.mailchimp.com/embedcode/slim-081711.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    	#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
    	/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
    	   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
    </style>
    <div id="mc_embed_signup">
    <form action="//ninzio.us3.list-manage.com/subscribe/post?u=d4b8ae9364cc26cecfd46d335&id=23c55ddae5" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
        <div id="mc_embed_signup_scroll">
    	<label for="mce-EMAIL">Subscribe to our mailing list</label>
    	<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
        <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
        <div style="position: absolute; left: -5000px;"><input type="text" name="b_d4b8ae9364cc26cecfd46d335_23c55ddae5" tabindex="-1" value=""></div>
        <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
        </div>
    </form>
    </div>

    <!--End mc_embed_signup-->

action - //ninzio.us3.list-manage.com/subscribe/post?u=d4b8ae9364cc26cecfd46d335&id=23c55ddae5

name - b_d4b8ae9364cc26cecfd46d335_23c55ddae5

## Visual Composer

Unitheme theme supports Visual Composer. All VisualComposer settings are available with unitheme theme. Some modifications and improvements done to make unitheme theme and visual composer union stronger.

VIsual composer settings should be adjusted as follows

- Content types: pages
- Disable responsive content elements: OFF (don't disable)
- Unitheme theme comes with a lot of shortcodes. Almost all of them have been integrated with visual composer. Some of viual composer shortcodes have been modified to make 100% of use.

Here we are not going to cover all elements, integrated in VC, because they are simple and intuitive. But we will highlight some important elements with important customization.

###### Row

First and one of most importat elements in Row. And the most important setting is Full width option. Use these combinations of options:

- Page Full width active + Row Full width active = Row will have 100% background and the content will be aligned with main container 1200px
- Page Full width active + Row Full width inactive = Row will have 100% background and the content will be 100%

Second option is ID - give unique ID to row, if you want to have landing page with sections (one-page layout). Use that ID in your menu link to link to targeted row with one-page navigation.

###### Columns

We added animation options to columns and margin bottom toggle. Margin bottom toggle can be useful if for some reason you don't need native 25px margin-bottom of column.

###### Custom heading

Custom heading is native VC element, but it has some specific configuration. If you ever have problems with custom font-family select, this can fixed by activating file_get_contents() option from php.ini in your host. If it is local, you can activate it by yourself, if it is web server ask your provider to activate it.

###### Mailchimp

To make mailchimp subscribe form work properly, you need some customization. Go to http://mailchimp.com/, sign in, go to lists >> Signup forms, select Embedded forms, and choose Super Slim, and from code give output action attribute from form and name attribute from input.

    <!-- Begin MailChimp Signup Form -->
    <link href="//cdn-images.mailchimp.com/embedcode/slim-081711.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    	#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
    	/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
    	   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
    </style>
    <div id="mc_embed_signup">
    <form action="//ninzio.us3.list-manage.com/subscribe/post?u=d4b8ae9364cc26cecfd46d335&id=23c55ddae5" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
        <div id="mc_embed_signup_scroll">
    	<label for="mce-EMAIL">Subscribe to our mailing list</label>
    	<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
        <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
        <div style="position: absolute; left: -5000px;"><input type="text" name="b_d4b8ae9364cc26cecfd46d335_23c55ddae5" tabindex="-1" value=""></div>
        <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
        </div>
    </form>
    </div>

    <!--End mc_embed_signup-->

action - //ninzio.us3.list-manage.com/subscribe/post?u=d4b8ae9364cc26cecfd46d335&id=23c55ddae5

name - b_d4b8ae9364cc26cecfd46d335_23c55ddae5

All other elements are easy to use and intuitive to customize.

## WooCommerce

Unitheme theme supports wooCommerce. All wooCommerce settings are available with Unitheme theme. Some small additions are included and replaced to make wooComerce design compatible with Unitheme theme design.

- Enable Lightbox (WooCommerce >> Settings >> General) is replaced with Unitheme theme lightbox, so this option is OFF
- Enable enhanced country select boxes (WooCommerce >> Settings >> General) is removed to make select elements design compatible with Unitheme theme design.

All additional options for design and layout you can find in Unitheme theme settings (Apperiance >> Theme settings >> WooCommerce). Here you can style shop header (Rich header), change product columns, choose sidebar position.

## WPML

Unitheme theme supports WPML. All WPML settings are available with Unitheme theme. Some small additions are included and replaced to make WPML design compatible with Unitheme theme design. Language switcher styles are already included in design, you don't need to style language switcher by yourself.

## Ninzio Slider

Unitheme theme comes with lightweight powerful layered slider. In this section we will cover everything you need to know to create beautiful presentations. Slider settings can be found in theme settings >> Ninio slider

Go to Wordpress >> Ninzio Slider >> Order and you can change slide order . Just drag and drop slides to reorder them. Don't forget to correct slides order each time you create new slide.

To add new slide just click «Add new» submenu under Ninzio slider menu. Ninzio slider is created as custom post type that is why the interface should be familiar to you.

You can set slide background color, or upload slide background image or even set video background. Also you can activate parallax effect for background images. Ninzio slider comes with 5 layers per slide. This should be enough to create 99% of any presentation, that you need. Each layer is toggle, by default all layers with theirs panels are open, but you can toggle them, and wordpress will remember toggle state for each layer. Each layer has animation options and content area

###### How easily set cords?

If you save you created slide and preview it from right publish metabox, you will see your slide preview in cords grid, drag over given canvas area, and in the box, under canvas you will see x, and y cords. Use this preview tool to place layers with best practices.

## Separate Blog page and Front page

By default WordPress index (front) page shows blog latest posts. But if you want you can set separate pages for blog page and front page. To do this you need to create two pages.

- Go to pages
- Add new
- Name it Homepage/Home/Whatever
- Save it
- Add new page
- Name it Blog/Whatever
- Save it
- Go to settings > reading
- Choose "Front page displays" a static page and from dropdown menu bellow (Front page) select your created homepage
- Right after that in second dropdown menu (Posts page) select your second created page "Blog"
- Click Save changes button and that is all

## Cross Browser/Platform Ninzio Slider Video

Ninzio slider supports html5 video formats (mp4/m4v, ogg/ogv, webm). But all these video formats are no supported among all devices and browsers. That is why, to make html5 video cross-browser and cross-device compatible you need to follow these steps

- Download http://www.mirovideoconverter.com/ video converter and install it. It has very intuitive and simple interface
- Convert your video to all formats (mp4/m4v, ogg/ogv, webm)
- Converter will generate ready to use html index page, you don't need that page, you need only videos
- You can find it in html5video of generated folder
- Upload these video files ot your website and give the links to Ninio video background video
- Open your .htaccess file (your wordpress installation root) in notepad or similar editor and paste this code

    AddType video/ogg .ogv
    AddType video/mp4 .mp4
    AddType video/mp4 .m4v
    AddType video/webm .webm

Save it. That is all. Now you will have html5 video, that supports google chrome, firefox, ie9 and above, safari, opera, ipad, iphone, android

## Menu

In wordpress menus are created from Apperiance >> Menus options. If you have already created menu, you need to assign your menu to Unitheme theme menu location. To do so go to Manage Locations tab from Menu options, and select your menu from dropdown list to assign to Header menu (Unitheme theme comes with 3 menu locations – Header menu, Footer menu and One page bullets). Click Save changes. If you don't have any menu yet click “create a new menu”, enter menu name click “Create Menu”, add menu items and manage menu location at “Manage Locations” tab.

To create megamenu you need to follow instructions:

- Enable CSS Classes for menu (Apperiance >> Menues >> Screen Options >> Check CSS Classes)
- For top-level menu css classes field add class "megamenu". Make sure you add "megamenu" class to top-levle menu. It will work only for top-level.
- Specify megamenu columns. By default megamenu is 3 column, but it can have 2 and 4 columns. To make megamenu 4 column add to megamenu menu item (the same with megamenu class) class columns-4, for column 2 add class columns-2
- Style megamenu from theme options >> header

To add icons for menu items follow these steps:

- Enable CSS Classes for menu (Apperiance >> Menues >> Screen Options >> Check CSS Classes)
- For menu items css classes field enter icon name (icon list can be found in icomoon folder, see help)

## How to add portfolio archive pages to the menu?

Portfolio is a custom post type in wordpress. To add archive page go to links (apperiance >> menu), in the url field enter url like this – http://www.mysite.com/portfolio, enter link text and click add to menu, and save menu

## Translation

Need to translate the theme into another language? No problem, it's fully localized and translation ready. Follow the simple steps below

- Download and install PoEdit. (PoEdit is a free software and its available for Mac, Windows and Linux. Download PoEdit from http://www.poedit.net/download.php)
- Create a new catalog (the local language file)
- Start PoEdit and click on the File menu and select the option New catalog from POT file.
- This will open the file dialog box. Go to the languages folder of the theme. Select All Files from the file dialog box, and open the en_US.po file in the languages folder.
- Now PoEdit will ask you for various configuration options. The most important thing here is to choose the correct country and language you are translating to.
- In the remaining fields of the configuration window, fill the required information or just leave them empty.
- Now click on the Paths tab and change the path variable to the place where your theme files are located.
- Then press OK.

Now PoEdit will ask you to name the file. Its very important to name the file correctly. The naming convention for these files is languageCode_countryCode. The language code must be in lower case while the country code should be in upper case. So, if you are translating the theme for UK English, the file name will be en_UK. Similarly, for translation to french, it will be fr_FR and so on. You can find a list of language codes and country codes here http://www.w3.org/WAI/ER/IG/ert/iso639.htm.

###### Translate the Theme:

This is the step where we will actually translate the theme. After Step 2 above, you'll see the standard interface of PoEdit where the left panel contain the strings in the original language and the right panel containing the translations. The right panel will be empty as we haven't started the translation yet.

Start translating each string one by one. Click on the first string and press Tab button. This will take you to the translation box in the bottom. Type the translation here. Your change will reflect immediately in the right panel. Once you are done with this string, press Enter and move on to the second string. Repeat this procedure until all the strings are translated. After the translation is done, save the file.

Then open wp-config.php located in the root of your WordPress installation and change line 72 to reflect your new language file.

###### Upload The Files To Your Server

When you save the catalog file in Step 3 above, PoEdit will create two files, a .po file and a .mo file. Upload both these files to the languages directory of your theme. Also upload wp-config.php to the root of your WordPress installation and you'll be good to go.

## WPML

First, you need to to purchase a recent version of WPML, including the String Translation and Translation Management modules.

###### Initial Setup

Install and activate the core WPML plugins (WPML Multilingual CMS, WPML String Translation, WPML Translation Management), and then other WPML plugins that may depend on them.

Set up WPML from WPML->Languages. See WPML Getting Started Guide for complete reference, but the initial simple three-step setup is self-explanatory, asking you to choose your default language, a set of active languages, and a language selector.

###### Translating Pages, Posts and other post types

To translate a page you need to go to Wp admin – Pages and in the list you will see columns for each active language, with a pencil icon (for ‘edit translation’) or a ‘+’ icon (for ‘add translation’) next to each page. Go ahead and edit or add the translated page for ‘Home Default′. Right now you just need to translate your page into the new language. Read this to easily duplicate your existing content.

###### Translating custom post types and taxonomies

Unitheme comes with extra custom post types such as portfolios and testimonials, and custom taxonomies. In order to get a similar interface for translation/duplication as for posts and pages, you need to go to WPML->Translation Management, and select the tab ‘Multilingual Content Setup’.

###### Translating Menus and Language Switcher in Header

WPML can synchronize menus for you. This means that if some entries, for example some pages, posts or categories, are in the English menu, WPML can generate and keep in synch menus for other languages pointing to the translated versions of these pages, posts or categories.

From WordPress Appearance->Menus you can see your existing menus and add menu translations and synchronize menus across translations.

To show the language switcher in the header you need to activate it from Theme options – Header options.

###### Translating theme texts and other strings in your site

To translate strings you need to follow the procedure for Theme and Plugin Localization. Go to WPML->Theme and Plugin Localization, and click on ‘Scan the theme for strings’ and you will see theme strings and which ones are translated or not.

## Optimization

If you want to optimize and speed-up micron theme follow these simple steps:

###### Minify CSS

(Go to micron >> style.css, copy all the styles under title section)

Don't remove this comment, this is required to tell wordpress theme params. Go to http://www.freeformatter.com/css-minifier.html and paste the styles, minify and replace the styles with minified. You will reduce style size up to 25%. There are also ninzio-slider.css found in micron >> css. But this css file is small, so you don't need to minify it.

###### Minify JS

main js files, that we recommend to minify are: controller.js, jquery.ninzio-slider.js and jquery.contentcarousel.js. These files can be found in micron >> js. To minify js files go to http://closure-compiler.appspot.com/home copy all code from js file paste into the the textarea, press compile, replace existing code with minified. Do it for all js files. You will reduce file size up to 70%.