If you have any questions that are beyond the scope of the following Formation Theme Instructions, please feel free to post support question on the Formation Theme support forum.

Table of Contents

1. Installation
2. Custom Menu
3. Customizing sidebar with widgets
4. Custom Header
5. Homepage Layout
6. Set Up Homepage Slider
7. Additional Layouts
8. Customizer Options
9. Recommended Image Sizes
10. WPML Compatibility

1) Installation

a) Through Dashboard

Log in to the WordPress Dashboard.
Go to Appearance->Themes.
Click on Install Themes.
Click on Upload
Browse the zip file of Formation
Then Click on Install Now to install the theme.

b) Manual Installation using FTP

Download the Formation theme from WordPress.org
Unzip formation.zip to your Desktop.
Using an FTP client to access your host web server. Go to /wp-content/themes/
Upload Formation theme to /wp-content/themes/.
Go to Appearance->Themes and activate Formation theme from Dashboard.

back to top

2) Custom Menus

Formation supports custom menu and you can set it by using the following steps.

Go to Appearance->Menus.
Give your menu a name and build as you require.
You can add pages, categories or custom URL’s.
Now simply select the theme location(Primary Menu in our case) for your newly created menus using a widget on the left. Afterwards, click Save.
See Menu Help for more information.

back to top

3) Customizing sidebar with widgets

After installing the theme, your sidebars will be empty or have default widgets. These can be populated using the following steps:

Go to Appearance > Widgets.
You can drag and drop widgets in each of the positions.
See Widget Help  for more information.
Note: This theme has some extra widget areas in the footer and the left-sidebar template. These can be populated using the same steps as above.

back to top

4) Custom Header

Formation supports Custom Header Feature.

Go to Appearance->Header.
Browse image from your computer and upload the image. Look at number 9 for recommended image sizes.
Crop the Image to suit.
Click on Crop and Publish.
Your website’s Header Image is now set.

back to top

5) Homepage Layout

The Homepage layout can be set by making a page and selecting “Custom Home Page” from the Template options.

– The 3 feature boxes (below slider) can be edited in Appearance > Customize
– The featured text area below the three feature boxes can be edited in Appearance > Customize.
– Recent Posts. The latest 4 posts are picked up and displayed under the recent posts section.
– Homepage slider instructions are below.

back to top

6) Set Up Homepage Slider

A post category called “Featured” and with the slug “featured” will have to be added to your post categories. The slider will pick up the latest 3 posts from this category and the image if you have set a featured image. Look at number 9 for recommended image sizes. The slider will appear on whatever you have set as your homepage – static or blog.

back to top

7) Additional Layouts

As well as the Homepage Layout Template detailed above and the default right sidebar layout you also have the option to use other layouts:

Full-Width
A full-width layout can be set by making or editing a page and selecting “Full Width” from the Template options.

Contributors
The Contributors template displays your website authors details. This can be activated by selecting the “Display Authors” Template when making or editing a page.

Left Sidebar
A left sidebar layout can be set by making or editing a page and selecting “Left Sidebar” from the Template options.

Full Width Blog
A full width blog layout can be set by making or editing a page and selecting “Blog Full-Width” from the Template options.

Grid Layout Blog
A grid layout blog can be set by making or editing a page and selecting “Blog Grid” from the Template options.

back to top

8) Customizer options

You can set various options through the wordpress admin customizer options. Appearance > Customize

Logo Upload
– Drop a file into the box or click “select a file” and browse to the image want to use as your logo. A preview of your logo will appear on the web page. Click save when happy.
Feature text boxes
– Images, links and text can be added to the 3 feature boxes. These will appear below the slider.
Feature text area
– Enter your featured text here. This will display directly below the feature text boxes.
Contact Details
– Enter your email address or phone number in this field for it to appear at the top left of your website.
Social Media Links
– Enter the full url’s of your social media pages for the icons to appear at the top right of your website.

back to top

9) Recommended Image Sizes

Logo = 300px width 70px height
Slider images = at least 960px width. will look best at either a 3:1 or 4:1 width-to-height ratio. The Formation demo site images are 2000px width and 500px height.
Header = same as slider images

These are just recommendations and there is some flexibility with sizes.

back to top

10) WPML Compatibility

WPML public test site for Formation: http://theme-testing.wpml.org/formation/
WPML add-ons: – http://wpml.org/purchase/

Installing & activating both WPML & the theme:
– WPML getting started guide http://wpml.org/documentation/getting-started-guide/

How to set and translate main features of the theme:
– Using translation management http://wpml.org/documentation/translating-your-contents/using-the-translation-editor/
– Translation Management & Features – http://wpml.org/documentation/translating-your-contents/using-the-translation-editor/translation-management-features/
– Translating URL slugs – http://wpml.org/documentation/getting-started-guide/translating-page-slugs/

An example of how the client can translate strings coming from the theme:
– How to scan strings coming from the theme – http://wpml.org/documentation/getting-started-guide/theme-localization/
– How to translate strings using String Translation – http://wpml.org/documentation/getting-started-guide/string-translation/

If adjustment is needed for WPML language switcher please also add this:
http://wpml.org/documentation/getting-started-guide/language-setup/custom-language-switcher/