Iter WP Theme Documentation

Getting started

Important!

Before update the theme, please make a full backup of your site.

In version 1.1.1 I've fixed an issue with tours dates translation: you need to reinsert all the tours "Departure Date" and "Return Date" in order to make the theme work properly.

General

First of all, thank you for purchasing Iter! Before you get started, please be sure to always search this Documentation that outline all kinds of good information and provide you with all the details you need to use Iter. This theme can only be used with WordPress and I assume that you already have WordPress installed and ready to go. If you do not, please follow this link to see how to install WordPress.

Requirements For Iter

To use Iter:

Check to ensure that your web host has the minimum requirements to run WordPress.
Always make sure they are running the latest version of WordPress.
You can download the latest release of WordPress from official WordPress website.
Always create secure passwords FTP and Database.

Recommended PHP Configuration Limits

Many issues you may run into such as: white screen, demo content fails when importing, empty page content and other similar issues are all related to low PHP configuration limits. The solution is to increase the PHP limits. You can do this on your own, or contact contact your web host and ask them to increase those limits to a minimum as follows:

max_execution_time 180
memory_limit 128M
post_max_size 32M
upload_max_filesize 32M

What you have purchased

The file you have downloaded contains several folders:

Documentation (that contains this very page)
Dummy Data, that contains several folders (Demo Video, Demo Slider, Demo Particles and Demo Map) each of which has:
- content.xml, the demo content taken from here
- widgets.txt that contains the info to import widgets as well, by using this plugin
- theme-options.json, that contains the demo theme options settings.
Languages that contains:
- iter.pot , the file you need to translate the theme in your language using Poedit
- tgmpa , the folder that contains all the translations for TGM Plugin.
Licensing, folder containing the licensing text files.
WordPress Theme that contains:
- a folder called "iter" you can upload via FTP
- and a ZIP file called "iter.zip" you can upload from the WordPress backend

How to install the theme

You have two options to install the theme (read above where the files are located):

by using an FTP client (FileZilla, Dreamweaver, FireFTP or similar) upload the folder called "iter" to
your_root / wp-content / themes
directly from the WordPress backend, go to "Appearance" → "Themes" → "Add new (theme)" and click the "Upload theme" button on the next page. With the browse button find the aforementioned "iter.zip" file, then click "Install now".

After you have installed the theme, you might see the following warning:

"Redux Framework has an embedded demo . Click here to activate the sample config file."

To properly configure the theme, please ignore the warning by clicking on the "X" to its side.

How to install plugins

Above the theme options panel you should see this message box:

That's the list of the required and recommended plugins. The required plugins provide a large part of the features of this theme.

The recommended plugins are not mandatory, you won't read warning messages or get blank pages without installing them, but they are necessary if you want to update the theme and import the demo content correctly. Otherwise you'll get some "failure" notices during the import process and your installation won't reflect the demo, just this.

Simply click the "Begin installing plugins" button then the "Install" button on each plugin to start installing them. After you’ve installed them, an "Activate" button will appear which you can click to start activating them.

If you want both to use WooCommerce plugin and to import the demo content you see here, then please delete the WooCommerce pages (Cart, Checkout, My Account and Shop) generated after the WooCommerce plugin initial setup. Otherwise, if you don't want to replicate the demo, leave the WooCommerce Pages generated after the plugin initial setup.

Theme initial setup

Update your permalink structure

Directly from the WordPress backend, go to "Settings" → "Permalinks" and change the Common Settings from "Default" to "Post name". Then click the button "Save Changes".

Setting up the Menu

Iter supports custom WordPress menus, with multiple levels of dropdown support. There are two areas of the theme where you can assign a menu:

Top Menu, which supports 2 levels of dropdown.

Overlay Menu, which supports 1 level of dropdown.

Once a menu is created and assigned to the location, it will show up on the site. There are also several options to customize the menu. Please see below for how to create a new menu and the available menu styles.

Navigate to "Appearance" → "Menus" section of your admin sidebar.
Enter the menu name then click the "Create Menu" button.
To add a menu item, select one of your created pages on the left hand side and click the "Add to Menu" button. You can also add all kinds of different links and categories from the left side.
To add a custom menu item, enter a custom name and link into the Links box.
Manage your menus by using the drag and drop functionality. To create a dropdown menu, simply drag a menu item below and slightly to the right of another menu item, and it will lock into place and create a dropdown section.
To display a label description after the menu item, as you can see here, simply insert your text into the "Description" box.
After setting up your menu, scroll down to the bottom of the page to assign the menu to the "Menu" location in the Theme Locations box.
Once its all done, make sure you click the "Save" button.

Choose the Template

Iter includes several page templates to choose from. For example, if you want a page to display your tours packages, then you would select the "Tours Grid" page template or the "Tours List". All of this is done in the Pages section of your WordPress admin.

Default Template – This is the template for all normal pages.
Blog Masonry – This is the Blog page template with masonry style.
Blog Standard – This is the Blog page template with standard style.
Contacts – This is the Contacts page template.
Tours Grid – This is the Tours page template with cards and masonry style.
Tours List – This is the Tours page template with list style.

For every page you can decide to display a sidebar or not and its position. To do it simply select the sidebar into the sidebar dropdown menu into the Page section of your WordPress admin.

Theme Customization

Iter Theme Options overview

With Iter Theme Options Panel you can choose from tons of options (Colors, Google-Fonts, Layouts etc.) to define the look of your site and preview changes in real time.

To begin your site customization:

from the WordPress backendgo to Theme Options
in the Theme Options panel choose the tab option you want to edit and when you're done making changes, click on the "Save Changes" button at top.
You can choose between the following options:
- Theme Layout, where you can choose between boxed and fullwidth layout and Top Bar options.
- Theme Settings, with Google Maps API key and theme currency dropdown list.
- Logo, where you can upload your logo and choose its position.
- Home Page, where you can define the position and the content of home page sections.
- Newsletter, where you can choose the content and location of the newsletter widget.
- Partners Gallery, where you can upload the logos of your partners and display them using "[gg_partners]" shortcode.
- Contacts Page, where you can change the icons of contacts page map and the details such email, phone, address and opening hours.
- Typography, where you can choose the perfect Google Font for your site.
- Colors, where you can decide your site colors from topbar to footer.
- Social Profiles, where you can insert your social media links.
- Footer, where you can change the footer text and background image.
- Custom Styles, to make changes to the main stylesheet of your theme (the custom rules you set here will not be overwritten when you next update the theme).
- Demo Importer, where you can choose the demo content you want to import.
- Import / Export, where you can import the demo options or export your site options.

If you make changes to the theme’s files (i.e. anything within the “/themes/iter/” directory), those changes are likely to be overwritten when you next update the theme.

A child theme allows you to set up a standalone directory in which you can make create copies of the theme’s files and tweak away, without fear of your work being overwritten by any future updates.

If you don’t know how to create a child theme, please follow this link.

Upload your logo

From the "Logo" section of Iter Theme Options panel you can upload a custom logo that will be visible on your main navigation.

If you do not upload a logo, the default Iter logo will be displayed instead.

With Iter you can choose between 2 different menu styles: a multi-level horizontal menu and a sliding hamburger menu. After you have set up the menu, as explained above, you need to follow these steps:

from the WordPress backend go to "Appearance" → "Menus" → "Manage Locations" and select a menu for the "Top Menu" location, leaving empty the Overalay Location, if you want to use the multi-level horizontal menu;
from the WordPress backend go to "Appearance" → "Menus" → "Manage Locations" and select a menu for the "Overlay Menu" location, leaving empty the Top Menu, if you want to use the sliding hamburger menu.

Wide or boxed layout

From the "Theme Layout" section of Iter "Theme Options" you can choose between wide and boxed layout.

With "boxed" layout you can set a background color or image which will be visible on the right and left borders of your site.

With "wide" layout, the right and left borders of your site will have the same color of your background.

Change colors

From the "Colors" section of Iter "Theme Options" you can choose between many options for your website.

Change Links Color

To change links color, go to the "Colors" section of Iter Theme Options and select your desired color palette, then click the "Save Changes" button.

Change Main Text Color

To change main text color, go to the "Typography" section of Iter Theme Options and select the font color you want for paragraphs.

Change Other Colors

To change Top Bar / Menu / Footer Colors, as for links color, go to the "Colors" section of Iter Theme Options and select your desired color through the pickers.

Change header image

To change the Header Image of your pages, simply upload or select your desired "Featured Image" for that page into the "Edit Page" section.

Change font

To edit the Fonts of your site, go to the "Typography" tab of Iter Theme Options, check the boxes and begin typing the font family you want to use.

Change footer text

To change the text displayed in footer, go to the "Footer" tab of Iter Theme Options, and type your custom text into the "Footer Text" section.

Widgets and Sidebars

All widgets are accessed in the "Widgets" section of the WordPress admin. Widgets can be added to any sidebar.

There are various fields and settings to choose for each individual widget; all are self explanatory.

You can put as many widgets as you want inside of a sidebar.

This theme supports 3 widgets areas: main sidebar, shop sidebar and footer sidebar. Check out the demo to see how they are used.

Add contents

Add the Homepage

After you've created an homepage, from the WordPress Dashboard, go to "Settings" → "Reading" and select the "A Static Page" option which is under the heading "Front Page Displays". Then Select the page that you created from the "Front Page" drop down . eg: Home.

Select the "Your latest posts" option if you want to use the theme default homepage sections displayed into the demos.

To change the homepage layout go to "Theme Options" → "Home Page" → "Homepage Layout" and drag & drop the sections you want to display, then select the panel of each section to customoze its content.

When you're done making changes, press the "Save Changes" button.

Add new Tour

Directly from the WordPress backend, go to "Tours" → "Add New", fill in the fields like the example below then click the "Publish" button.

Some fields are mandatory (Address, Departure Date and Return Date) and you have to fill them in order to use all functions of the theme, such as homepage map and tours search/filter.

Add new Service

Directly from the WordPress backend, go to "Services" → "Add New", fill in the fields like the example below then click the "Publish" button.

Add new Testimonial

Directly from the WordPress backend, go to "Testimonials" → "Add New", fill in the fields like the example below then click the "Publish" button. Remember that the testimonial featured image should be a square with the same width and height.

The testimonials you add here will be visible only if you select the "Testimonial Section" into "Theme Options" → "Homepage Layout".

Add new Team Member

Directly from the WordPress backend, go to "Team" → "Add New", fill in the fields like the example below then click the "Publish" button.

The team members you add here will be visible only if use one of the team shortcodes:

[gg_team columns="2"]

[gg_team columns="4"]

[gg_team columns="3-hover"]

Shortcodes Overview

Tours List

[gg-tours country="your-country-name"]

Tours list by specific countries slugs, comma separated, or:

[gg-tours country="all"]

to display all the tours.

Output

Team Members

[gg_team columns="2"]

[gg_team columns="4"]

[gg_team columns="3-hover"]

Output

Gallery

[gg-gallery size="large" link="none" ids="106,107,67,60"]

Possible attributes:

size:"thumbnail/medium/large/full";

link="file/none";

ids = images ids.

Output

Partners Gallery

[gg_partners]

Display the partners logos you inserted into "Theme Options" → "Partners Gallery" section.

Output

List Types

[gg_list type="list-1"]
											[gg_li]Duis autem vel eum iriure dolor.[/gg_li]
											[gg_li]Ut wisi enim ad minim veniam.[/gg_li]
											[gg_li]Nam liber tempor cum soluta.[/gg_li]
										[/gg_list]

[gg_list type="list-2"]
											[gg_li]Duis autem vel eum iriure dolor.[/gg_li]
											[gg_li]Ut wisi enim ad minim veniam.[/gg_li]
											[gg_li]Nam liber tempor cum soluta.[/gg_li]
										[/gg_list]

[gg_list type="list-3"]
											[gg_li]Duis autem vel eum iriure dolor.[/gg_li]
											[gg_li]Ut wisi enim ad minim veniam.[/gg_li]
											[gg_li]Nam liber tempor cum soluta.[/gg_li]
										[/gg_list]

[gg_list type="list-4"]
											[gg_li]Duis autem vel eum iriure dolor.[/gg_li]
											[gg_li]Ut wisi enim ad minim veniam.[/gg_li]
											[gg_li]Nam liber tempor cum soluta.[/gg_li]
										[/gg_list]

[gg_list type="list-5"]
											[gg_li]Duis autem vel eum iriure dolor.[/gg_li]
											[gg_li]Ut wisi enim ad minim veniam.[/gg_li]
											[gg_li]Nam liber tempor cum soluta.[/gg_li]
										[/gg_list]

Output

Counters

[gg_counter title="Earnings" symbol="$" color="#323c46"]322,430[/gg_counter]

Output

Messages

[gg_message color="alert-info"]Information: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco quat.[/gg_message]

[gg_message color="alert-success"]Success: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco quat.[/gg_message]

[gg_message color="alert-warning"]Warning: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco quat.[/gg_message]

[gg_message color="alert-danger"]Danger: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco quat.[/gg_message]

Output

Buttons

[gg_button size="btn-small"]Read More[/gg_button]

[gg_button color="red" size="btn-large"]Read More[/gg_button]

Possible sizes: btn-small, btn-large.

Insert your button url link into the href parameter:

[gg_button href="https://www.google.com"]Read More[/gg_button]

Output

Columns

[gg_row]
											[gg_column width="1/2" align="text-left"] Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco quat.[/gg_column]
											[gg_column width="1/2" align="text-right"] Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco quat.[/gg_column]
										[/gg_row]

Possible widths: 1/1, 1/2, 1/3, 2/3, 1/4.

Possible alignments: text-left, text-right, text-center.

Output

Tabs and Accordion

[gg_accordion]
											[gg_panel title="1 Panel"] Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.[/gg_panel]
											[gg_panel title="2 Panel"]Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.[/gg_panel]
											[gg_panel title="3 Panel"] Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna. [/gg_panel]
										[/gg_accordion]

[gg_tabs direction ="tabs-left"]
											[gg_tab title="1 Tab"] Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.[/gg_tab]
											[gg_tab title="2 Tab"]Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.[/gg_tab]
											[gg_tab title="3 Tab"] Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna.[/gg_tab]
										[/gg_tabs]

[gg_tabs direction ="tabs-right"]
											[gg_tab title="First Tab"] Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.[/gg_tab]
											[gg_tab title="Second Tab"]Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.[/gg_tab]
											[gg_tab title="Third Tab"] Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna. [/gg_tab]
										[/gg_tabs]

[gg_tabs]
											[gg_tab title="First Accordion"] Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.[/gg_tab]
											[gg_tab title="Second Accordion"]Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.[/gg_tab]
											[gg_tab title="Third Accordion"] Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna. [/gg_tab]
										[/gg_tabs]

Possible directions: tabs-right, tabs-left.

You can also add a custom title for every tab.

Output

Pricing Planes

[gg_pricing_plan title="Plan One" period="week" price="$ 80"]
											[gg_li_pricing]Feature One[/gg_li_pricing]
											[gg_li_pricing]Feature Two[/gg_li_pricing]
											[gg_li_pricing]Feature Three[/gg_li_pricing]
											[gg_li_pricing][gg_button href="#"]Buy Now[/gg_button][/gg_li_pricing]
										[/gg_pricing_plan]

[gg_pricing_plan title="Plan Two" price="$ 40" image="your_image_url" period="month" highlighted="yes"]
											[gg_li_pricing]Feature One[/gg_li_pricing]
											[gg_li_pricing]Feature Two[/gg_li_pricing]
											[gg_li_pricing]Feature Three[/gg_li_pricing]
											[gg_li_pricing][gg_button color="#e74c3c" href="#"]Buy Now[/gg_button][/gg_li_pricing]
										[/gg_pricing_plan]

[gg_pricing_plan title="Plan Three" price="$ 60"]
											[gg_li_pricing]Feature One[/gg_li_pricing]
											[gg_li_pricing]Feature Two[/gg_li_pricing]
											[gg_li_pricing]Feature Three[/gg_li_pricing]
											[gg_li_pricing][gg_button href="#"]Buy Now[/gg_button][/gg_li_pricing]
										[/gg_pricing_plan]

Output

Sections

[gg_video_section image="your_image_url"]
											Your content here.
										[/gg_video_section]

[gg_section text_color="#fff" image="your_image_url"]
											Your content here.
										[/gg_section]

[gg_section text_color="#fff" parallax="no" image="your_image_url"]
											Your content here.
										[/gg_section]

[gg_section text_color="#fff" parallax="no" background_color="#00BCD4"]
											Your content here.
										[/gg_section]

[gg_slice fullwidth="no" image="your_image_url"]
											Your content here.
										[/gg_slice]

[gg_slice fullwidth="no" parallax="no" image="your_image_url"]
											Your content here.
										[/gg_slice]

Possible parameters: video(your video url, only for gg_video_section), image (your image url), background_color (the background color for your section), text_color (the color for the text of your section), fullwidth (yes/no), parallax (yes/no).

Output

Import Demo Contents

When you first install Iter theme, it will not contain all the extra content that you might have seen in the live demo. To import the Iter demo content you can choose one of the two different procedures: auto import demo contents or manual import demo contents.

Auto import demo contents

From the WordPress backend, go to "Theme Options" → "Demo Importer" and press "Import Demo" button, as pointed in screen shot below. Now wait, It can take few minutes as images are fetched from remote server. Once done click the "Save Changes" button. Now you can visit your site.

Manual import demo contents

To manual import the Iter demo contents you need to follow these steps (remember that you do not need to follow this section if you have already imported demo contents using auto import demo contents feature explained above):

from the WordPress backend go to "Pages" → "All Pages" and delete all the default pages;
delete all the default widgets inside the sidebars;
install and activate the WordPress Importer plugin;
upload the file contents.xml contained in the folder called "Dummy Data". To do that, in the WordPress backend, go to "Tools" → "Import";
choose "WordPress" from the importer system list;

select the file you want to import (contents.xml);
click the "Upload file and import " button;
import or assign author;
if you want to import the file attachments you see in the demo, check the "Download and import file attachments" box then click the "Submit" button.

To import the demo widgets, install and activate the Widget Importer & Exporter plugin, from the WordPress backend, go to "Tools" → "Widget Importer & Exporter" and into the "Import Widgets" section upload the file called widgets.txt.

To import the demo theme settings, make sure to have installed and activated the "Redux Framework" plugin:

from the WordPress backend, go to "Theme Options";
click the "Import / Export" tab;
click "Import from File" button;
type the content of the theme-options.json file into the textarea;
click the "Import" button;
click the "Save Changes" button;

After this procedure, your site should look like the demo.

Update theme and plugins

You can update the theme by activating a different theme for a while, deleting Iter from the theme list and upload it again via the WordPress backend.

As an alternative you can upload a new version via FTP and override all the old files.

Using the Envato Market Plugin

Download the Envato Market Plugin.
Upload the plugin .zip via the Plugins > Add New section of the WordPress admin dashboard.
Click Install Now and then Activate Plugin.
Now head to the Envato Market plugin page and click on the Generate a personal token link.
Next give your token a name and check the box that you have read and agree to the terms. Click the Create Token button to generate your token.
Copy your token that’s been generated and head back to your WordPress setup in the plugin page to paste it in the token field. This should allow Iter to show up as one of your themes within the plugin – from here on you gain the benefit of quicker updates & update notifcations.

Iter

Can't Find What You Need?

Getting started

General

Requirements For Iter

Recommended PHP Configuration Limits

What you have purchased

How to install the theme

How to install plugins

Theme initial setup

Update your permalink structure

Setting up the Menu

Choose the Template

Theme Customization

Iter Theme Options overview

Upload your logo

Choose menu styles

Wide or boxed layout

Change colors

Change Links Color

Change Main Text Color

Change Other Colors

Change header image

Change font

Change footer text

Widgets and Sidebars

Add contents

Add the Homepage

Add new Tour

Add new Service

Add new Testimonial

Add new Team Member

Shortcodes Overview

Tours List

Output

Team Members

Output

Gallery

Output

Partners Gallery

Output

List Types

Output

Counters

Output

Messages

Output

Buttons

Output

Columns

Output

Tabs and Accordion

Output

Pricing Planes

Output

Sections

Output

Import Demo Contents

Auto import demo contents

Manual import demo contents

Update theme and plugins

Using the Envato Market Plugin