Online Documentation - The up to date documentation
Table of contents:
- 1. Hosting Requirements
- 2. Theme Update Instructions
- 3. Theme Installation Instructions
- 4. Working with Theme Admin
- 5. Theme Options
- 6. Default Layout
- 7. Page Builder
- 8. Import / Export
- 9. Multilingual content - main settings
- 10. Multilingual content - translate website content
- 11. Multilingual content - translate Page Builder content
- 12. Elements
- 13. Shortcodes
- 14. Members post type
- 15. Partners post type
- 16. Portfolio post type
- 17. Services post type
- 18. Testimonials post type
- 19. Toggles post type
- 20. Facilities post type
- 21. Infopanels post type
- 22. Revolution Slider
1. Hosting Requirements
We always test our themes on most standard hosting set ups, however make sure your hosting match the following requirements:
- WordPress 3.7 or later
- PHP 5.3 version or later
- PHP Extensions:*
- GD/ImageMagick extension
- Reflection extension
- SPL extension
- PCRE extension
- ICONV extension
- PHP tokenizer
- in php.ini file on your server have set up values:
- memory_limit set up at least 96MB
- upload_max_filesize at least 20MB
- post_max_size at least 20MB, the best same value like upload_max_filesize
- displaying of Notices & Warnings turned off
- we recommend mod_rewrite enabled
- write permissions to wp-content/uploads folder
More information about permissions and how to change them you can find in WordPress Codex here.
* PHP extensions mentioned above are available on most common hostings
AIT Themes Requirements Checker
Before AIT Theme activation are checked all minimum requirements by our "AIT Themes Requirements Checker", to make you sure you'll have no problem use our theme!
If your server meet all necessary requirements theme with all necessary plugins is successfully activated.
If AIT Themes Requirements Checker screen with some warnings or errors appears, contact please immediately your hosting provider with shown message and ask to allow necessary extensions. They are available on most common hostings, but it's possible that server administrator turn them off.
If you are hosting site on your own server, allow please all necessary PHP extension or made necessary changes on your server configuration to meet all requirements displayed by AIT Requirements Checker.
If you solve all issues displayed in AIT Themes Requirements Checker screen, go back to WordPress Admin and activate theme again.
1. AIT Themes Requirements Checker display warnings
If you see during theme activation AIT Themes Requirements Checker with warnings, you can still activate theme and continue using theme, but keep in mind please that some theme functionality may be limited. In this case contact hosting provider to solve all these warnings and configure server to meet all basic requirements which theme require.
2. AIT Themes Requirements Checker display errors
If you see during theme activation AIT Themes Requirements Checker with errors, you can't activate theme because theme will not work properly. Contact please hosting provider immediately, to solve all basic requirements of theme. After solving these problems you can activate theme from WordPress admin.
Example of AIT Themes Requirements Checker screen with low 64MB memory_limit in php.ini
2. Theme Update Instructions
If new theme version is available you would update your theme as soon as you can, to have the most recent version with new features and fixed bugs which were in previous version.
New version of theme is still available on Themeforest and you can download it for free if you purchased theme. Go to "Downloads" tab in your account on Themeforest site and download package with theme again.
Update theme and plugins via FTP
To update theme via FTP you have to have login information from your hosting company to access website files over FTP.
- access via FTP your website installation and find folder with theme: ./wp-content/themes/theme-name
- delete folder with your theme
- upload folder with theme from downloaded package (make sure the folder of theme will not be changed, you have maybe renamed folder with theme - name of folder with theme must be the same like previously deleted folder)
- that's all:)
Do not forget update also Plugins which were installed with theme:
- AIT Languages - plugin to create multilingual website
- AIT Shortcodes plugin with all available shortcodes
- AIT Toolkit plugin with all available custom post types
- Revolution Slider standalone Revolution Slider plugin which is prepacked with theme
Update AIT Plugins
The best way to update plugins related to theme is do it via FTP directly on server. Wordpress do not allow manually install new version of plugin over currently existing (installed) plugin.
- access via FTP your website installation - information how to access your website via ftp you would already have from your hosting company
- delete folders with plugins:
./wp-content/plugins/ait-languages
./wp-content/plugins/ait-shortcodes
./wp-content/plugins/ait-toolkit
./wp-content/plugins/revslider - from downloaded package with theme unpack new versions of plugins which are in theme folder ./ait-theme/plugins/
- upload all folders with plugins over ftp to folder: ./wp-content/plugins/
- after this all plugins are updated
New versions of plugins are inside theme folder: ./ait-theme/plugins/
[rule type="basic"]
Update theme and plugins simply with zip file upload via Admin
The most simplest solution for update of theme and plugins might be uploading of theme and plugins zip files via Admin. Helpful might be plugin Easy Theme and Plugin Upgrades.
Update Theme using Easy Theme and Plugin Upgrades plugin
- navigate to Appearance > Themes > Add New
- upload zip file with latest theme version
- select "Yes" from the "Upgrade existing theme?" option
- click the "Install Now" button
- theme is updated to latest version
Update Plugins using Easy Theme and Plugin Upgrades plugin
- unpack package with downloaded theme in your computer
- navigate to Plugins > Add New > Upload Plugin
- upload package with plugin (you have to repeat these steps for each one plugin attached to theme - AIT Languages, AIT Shortcodes, AIT Toolkit, Revolution Slider)
- select "Yes" from the "Upgrade existing plugin?" option
- click the "Install Now" button
- plugin is updated, go to update next plugin attached to theme
3. Theme Installation Instructions
Installation instructions via standard WordPress admin panel
- navigate to Appearance > Themes in main WordPress menu
- click on Add New button
- click on Upload link
- choose zip file with Theme from your computer, and click "Install now" button
- after successful installation of new theme click on Activate link
Full process of installation you can see in video tutorial.
[rule type="basic"]
AIT Plugins automatically installed with theme
With successfully theme activation are also installed and activated our plugins which contain shortcodes, custom post types and other plugins which are packed with theme. You can find them in WordPress Plugins page:
- AIT Languages - plugin to create multilingual website
- AIT Shortcodes - plugin with all available shortcodes
- AIT Toolkit - plugin with all available custom post types
- Revolution Slider - standalone revolution Slider plugin which is prepacked with theme
Because WordPress do not provide way automatically remove plugins with theme deactivation, these plugins must be manually deactivated after theme deactivation.
[rule type="basic"]
Child Theme
Downloaded theme zip file include also ready to use child theme. If you prefer using child theme for your modifications, just install child theme from themeName-child.zip file the same way like standard parent theme. Zip file with Child theme is inside root directory of downloaded parent theme.
Child theme contains following files:
- style.css - main css file of the child theme
- custom.css - in this file you can write your own custom css styles
You can copy any templates files from parent theme to child theme folder and modify them as you need.
It's not necessary install child theme just because of own styling modification. There are two ways how you can modify theme css with own styles:
- write own styles directly in Theme Options - Custom CSS section
- in theme root directory create file custom.css - in this file you can write your own custom css styles, theme load that file automatically without necessary child theme installed
Installation instructions via FTP client
Theme may be uploaded via FTP as well, open your favorite FTP client and upload unpacked theme folder into ./wp-content/themes/
Image below shows the screen of FileZilla FTP client.
Make sure please that you copied on FTP directly theme folder only with theme files inside.
Theme path must be ./wp-content/themes/ThemeName/theme_files_and_folders_here
During classic theme installation are automatically installed necessary plugins attached to theme. If you are installing theme via FTP, you have to install these plugins manually or upload them via FTP into plugins folder ./wp-content/plugins/
Plugins are packed in theme folder: ./ait-theme/plugins/:
- ait-languages.zip - plugin which allows you create multilingual website
- ait-shortcodes.zip - plugin which allows you use theme shortcodes
- ait-toolkit.zip - plugin which allows you use theme custom post types
- revslider.zip - Revolution Slider plugin
Demo Content Import
Demo content importing is not necessary to run theme, but for faster site development and familiarization with theme we recommend you to import demo content because it shows you all pages layouts, shortcodes and other post types which you received with theme.
- navigate to Theme Admin > Import / Export options
- select option Import Demo Content and click on the button with the same title Import Demo Content
- after click on button, demo content will be automatically uploaded
Note: be careful please, if you are working on the site where is some existing content, demo content replace all existing content. We recommend upload demo content on fresh empty WordPress installation.
[rule type="empty"]
Set up your Homepage and Blog page
In default WordPress settings you can select which page will be used as your Homepage and Blog page.
From main WordPress menu navigate to Settings > Reading, choose there Front page and Posts page from selections.
- page selected as Front page will be used as your homepage.
- page selected as Posts page will display all blog posts like standard blog page.
Video Tutorial - Theme Installation
4. Working with Theme Admin
All options related to Theme are available from main left-side Wordpress panel:
- Theme Admin menu
- Page Builder
- Custom Post Types provided by theme and options for plugins installed with theme
[rule type="empty"]
Theme Admin
Theme Admin options contain all necessary settings to manage look of your site, specific settings for your pages and options to import or backup data of your site.
Options available in Theme Admin:
- Theme Options
- manage main site settings and appearance of site - Default Layout
- manage layout of all pages - Import / Export
- import and export data from your site - Languages
- languages options to manage multilingual website (installed as standalone AIT plugin)
[rule type="empty"]
Page Builder
Using Page Builder you can create own layout for each standard page or single pages of posts, just drag and drop sortable elements from right side to receive wanted layout of page.
Find more information about Elements and Page Builder on appropriate documentation pages.
[rule type="empty"]
Custom Post Types and plugins options
Custom post types and options for plugins are available below Theme Admin options. You can manage from there all theme custom post types and features provided by plugins which were installed with theme.
Custom post types are installed with theme as separated AIT Toolkit plugin.
Packages with plugins related to theme you can find them in theme folder: ./ait-theme/plugins/:
- ait-languages.zip - plugin which allows create multilingual website
- ait-shortcodes.zip - plugin which allows you use theme shortcodes
- ait-toolkit.zip - plugin which allows you use theme custom post types
- revslider.zip - Revolution Slider plugin
[rule type="basic"]
Image is for presentation purposes, options displayed on your screen depends on installed theme.
5. Theme Options
!!! Note, not all options must be present within current theme !!!
Depends on installed theme which options are available in your theme admin.
In Theme Options you can change appearance and manage settings for whole site. Change look of your site using simple colorpickers, customize appearance of header, content parts and footer from one place.
Available are options:
Look of Theme Options screen:
- 1. Theme Options main menu
on the left side of screen is available main menu to switch between options - 2. Reset buttons
buttons to reset options:
Reset Theme Options - revert all settings in Theme Options to default values (values set up right after theme installation)
Reset All Options - revert all options in Theme Admin to default values (values set up right after theme installation) - 3. Save Options button
button to save changes
Note: some settings mentioned in documentation below are not included in each theme. In some of themes these settings are not necessary.
[rule]
General
Change main layout and colors of your site easily using available colorpickers and other control elements which are very easy to use.
Layout Type - select Wide or Narrow type of layout
See differences between available layouts on example images:
Wide Layout type
Narrow Layout type
Website Width - option to specify the width of website
Left Sidebar Width - option to specify the percentage width of left sidebar
Right Sidebar Width - option to specify the percentage width of right sidebar
Progressive Page Loading - turn on or off progressive page loading, this feature provide option to load content of pages progressively when you scroll down the page, it allows you to see all loading animations of all elements on your pages
Main Theme Colors and Backgrounds section
Use colorpickers to customize website colors and look of background. Change color of titles, main text and links used on your site. Decorative color used on more elements keep nice and uniform design of your site.
Favicon - select your favicon image
Website Background - color of entry site background, available are options to set up background image as well.
You can set up all main parameters for background image like Repeat, Position and Scroll
Theme Color - main color of theme design (option is not used in all themes)
Page Background - background color for page content
Titles - color of main titles used on site
Text - color of simple text used on site
Links - color of links used on site
Links Hover - color of links with mouse cursor over
Decoration - decorative color used on more elements on site
Lines - decorative color of lines used on site
Lighter Objects - decorative color and opacity of some lighter objects
Darker Objects - decorative color and opacity of some darker objects
[rule_top]
Header
Customize header of site and main menu with own logo image and colors.
Header Type - themes provide option to use more layouts of header, choose header with the best menu, logo and social icons position
Website Logo - URL of image used as logo on site
Background - change color of header using colorpicker or set up background image for header with all main parameters for image background like Repeat, Position and Scroll
Sticky Menu - feature with which menu will scroll down through site sticked on the top of screen
Main Menu Colors and Backgrounds section
Use colorpickers to manage colors of Main Menu on your site. You can change color of menu background, text color of menu items (pages titles) and color of active menu item.
Background - background color and opacity of main menu bar
Menu Items - color for pages titles used in main menu
Active Menu Item - color for pages titles used in main menu with mouse cursor over menu item
[rule_top]
Footer
Customize footer of your site with own colors for footer widgets area and footer bar as well. You can change colors of text these sections and look of footer widgets area background.
Footer Widgets Area section
Background - change color of footer widgets area using colorpicker or set up background image for footer section with all main parameters for image background like Repeat, Position and Scroll
Using available colorpickers simply set up colors of titles, main text and links used in this section. Decorative color used on more elements in this section keep nice and uniform design of your site.
Titles - color of widget titles
Text - color of simple text used in footer section
Links - color of links used in footer section
Decoration - decorative color used on more elements in footer section
Footer Bar section
Change width of Text Area and Menu Area to achieve wanted result of footer text and footer menu position.
Colorpickers and editor for Text Area meet all your needs to create nice footer simply and fast.
Text Area Width - percentage width of footer text area with your own custom text
Menu Area Width - percentage width of footer menu area with menu created for footer
Background - color and opacity of footer bar with text and menu area
Text - color simple text used in footer bar
Links - color of links in footer bar
Links Hover - color of links in footer bar with mouse cursor over
Text Area - editor to write text displayed in footer text area
Custom JavaScript Code section
JavaScript Code - place for your own scripts which will be included in website footer
[rule_top]
Typography
Options to select font on your site.
Available are Theme Default Font and System font options now.
[rule_top]
Breadcrumbs
Show user's position in structure of pages created on your site with breadcrumbs.
Separator - separator used between names of pages in breadcrumbs. You can change it from default "»" to anything you want
Breadcrumbs Text - default text "You are here: " may be replaced with any other phrase
Text for "Home" - default text "Home" may be replaced with any other phrase. It is first page in breadcrumbs which return user back to homepage
Website Title - if you are running Wordpress Multisite you can decide if you would like to show title of currently opened website or not
[rule_top]
Sidebars & Widget Areas
From these options you can easily manage your own widget areas for sidebar and footer.
Create new widgets areas
You can add new widget area by simple click on + Add New Item link and write Name for new sidebar or footer widget area.
To remove existing widget area simply click on the red cross on the right side of each created area.
For footer widget areas you can also specify the percentage width of each area to achieve wanted position of widgets.
Order of all created sidebars and widgets areas may be changed with simple drag&drop way...
Insert widgets into new widget areas
Your new widget areas are available in default Wordpress options Appearance > Widgets, you can add your widgets into these areas and show them on pages.
[rule_top]
Google theme option provide two simple fields to insert information for Google Analytics.
Google Analytics Tracking ID - paste just your Tracking Code ID in form UA-XXXXX-YY
[rule_top]
Social Icons
Display - use switcher to show/hide social icons on your site
Background - color and opacity of social icons background
Open In New Window - set up opening of social icon links in new window or tab
You can add new Social Icons by click on "Add new Item" and fill fields for Icon Title, Icon Image and Link.
To remove social icons you can click on "Remove All Items", remove all social icons or just some of them by clicking on the red cross on the right side of each Social Icon Item.
[rule_top]
Custom CSS
Write your own Custom CSS styling into box inside these options if you want modify default styling of theme or add styling for your own site content.
[rule_top]
Admin branding
Customize your Wordpress Login Screen to meet look of your site, all necessary options are available.
Admin Title - title of Theme options in main Wordpress menu
Login Screen Logo - logo image displayed in login screen
Login Screen Logo Link - link for logo image in login screen
Login Screen Logo Tooltip - tooltip displayed when mouse cursor is over logo image in login screen
Custom CSS for Login Screen - place for custom styling to modify look of Wordpress login screen
Small Admin Menu Icon (16x16) - small icon visible in Admin screen
Admin Footer Text - text displayed in footer of Admin screen
[rule_top]
Administrator settings
Settings to turn on or off development mode on your site.
Development mode - switcher to turn on or off development mode
Developer's IP address - IP address of developer
[rule_top]
6. Default Layout
Default Layout settings provide options to build main layout of your site which will be used on all your pages.
You can specify which widget area will be displayed on the left side or the right side of your pages. Available are options to turn on or off footer widget area and breadcrumbs.
With options in default layout might be enabled or disabled sidebars, footer widgets or breadcrumbs in a few clicks for whole website.
Follow Elements documentation page to learn more about using elements.
7. Page Builder
Page Builder provide options to create unique layout for each page. Just select page and insert elements which you want show on this page. Settings made for page in Page Builder override options made in Default Layout where is layout specified globally for all pages on site.
In the header of Page Builder screen is available selection with all pages where you can select page which will have created specific layout with own local options.
Pages listed in selection are divided in two groups:
Special pages
Include pages like:
- blog page (page set up as Blog in default WordPress Settings > Reading section)
- 404 error page
- search results page
- categories, taxonomies, tags or authors pages
- attachments pages
- single posts pages
- single pages of all custom posts types received with theme
Normal pages
Include all classic pages properly created in WordPress Pages section.
Create local options of page
Local options of page are created after click on the title of page in header of Page Builder screen, where is available selection of pages.
In the header of Page Builder screen you will see the title of edited page and icons View, Edit and Delete.
View - open currently editing page in new window/tab to see your changes
Edit - open standard WordPress Edit Page of currently edited page in new window/tab
Delete - delete local options of currently edited page
If you create specific layout for some page, these settings overwrite settings made in Default Layout screen. So in page with own layout created in Page Builder screen you will see just elements added for this page, not elements used in Default Layout which are displayed on all pages which have not created own layout with Page Builder.
All information how to work with elements, put them into page and all their options you can find in Elements documentation page.
8. Import / Export
Settings include all options necessary to import or export data of your site.
Export
Export options allow you to download backup file, which may contain:
- All settings of your site also with content of pages, posts and custom post types, sidebars, widgets, menus and all options of theme and WordPress
- All theme settings - export file contains just specific theme settings from Theme Options, Default Layout and Page Builder
- WordPress settings - export file contains some default WordPress settings like menus, widgets and sidebars
- WordPress Content - export file contains pages, posts, custom post types and all related stuff like comments, custom fields, terms, taxonomies and navigation menus.
Import
With import options you can upload file created from theme Export options.
Available are the same options like Export options, so you can import just specific file with backup what you need.
Important!: Import of data will delete all entries in database for selected option
Import Demo Content
Information about Demo Content you can find in Theme Installation Instructions documentation page
9. Multilingual content - main settings
With installed plugin AIT Languages which you received with your theme you can find all main options related to multilingual settings in main left-side WordPress panel via Theme Admin > Languages menu.
Video tutorial
[video src="106372962" width="100%" height="350px" border="no" type="vimeo"]
You can find there options:
If plugin AIT Languages is correctly installed and activated, you can find in the WordPress top bar new buttons related to translations:
1. Filter button is intended to filter content displayed on the admin page, for example in the Pages screen filter just pages created for selected language, or show options related just for this selected language.
With selected option Show All Languages you can display theme options related to all languages at once, for example options for Breadcrumbs in each language:
2. Theme Admin button on the right side set up language of WordPress Admin according to selected language.
[rule]
Languages
In Languages settings you can set up all languages in which your site will be translated.
Just select language from "Choose a language" selection and click "Add new language", new language will be added between currently used languages.
List of currently used translations is displayed on the right side of screen in table:
How to add new Language which is not included in theme?
[rule]
String translation
String translation options provide way to translate default WordPress strings and strings used in WordPress General Settings like Site Title, Tagline, Date Format etc...
[rule]
Settings
In Settings option you can set up all main options for your translation.
Available is only one options to set up Default language.
If some of your content isn't assigned to any language, you'll see the following message in Settings screen:
There are posts, pages, categories or tags without language set. Do you want to set them all to default language ?
If you select this option all content without selected language will be assigned to Default language.
Do not ignore please this message, you would have assigned all content to some language for correct translation.
[rule]
How to add new Language which is not included in theme
If you want to use also language which is not currently included in theme, you have to create translation from .POT files which are attached to theme.
As theme include also plugins, you need to translate separately words from:
- Theme admin
- Theme frontend
- AIT-Languages plugin
- AIT-Shortcodes plugin
- AIT-Toolkit plugin
- Revolution Slider plugin
- + download translation for Wordpress itself, to have translated general Wordpress Admin too
Theme and each plugin will include own translation .po and .mo files, so for example if you do not need to have translated Revolution Slider plugin, it's not necessary to create translation files for this plugin.
To have your new language available in selection of languages inside Languages options, you need to allow this new language in file of AIT-Languages plugin:
./wp-content/plugins/ait-languages/admin/languages.php
Just find line with your language and delete // from the start of line, for example to allow Serbian language you need to do this:
Now you can find your new language in theme Languages options, in selection where you can select language which will be used on your site.
New language is allowed, but you need to have translation files for Wordpress, Theme and Plugins. So nothing is translated now in your new language.
Continue in reading to learn how to get translation files to have translated Wordpress Admin, Theme Admin, Theme Frontend and Plugins.
1. Translate Wordpress Admin
The best way to get translation files for Wordpress Admin is direct download of Wordpress in your language.
With downloaded Wordpress you'll download also po and mo files inside folder ./wp-content/languages
Copy these Wordpress translation files into folder (you'll create this folder manually) for your new language in AIT-Languages plugin: ./wp-content/plugins/ait-languages/wp-languages/your-new-folder
Name of this folder must be in the locale format which consists from Language Code and Country Code, for example for Serbia folder like: ./wp-content/plugins/ait-languages/wp-languages/sr_RS
So path of this new folder is: ./wp-content/plugins/ait-languages/wp-languages/LanguageCode_CountryCode
After this will be translated only Wordpress Admin. Theme Admin, Theme frontend and Plugins are not translated yet, because you need to create translation .po and .mo files from POT files included in theme and plugins, as is mentioned above.
Continue in reading to learn how to create new translation files for your new language.
2. Translate Theme and Plugins
For translation in new language you have to create translation .po and .mo files from existing POT files.
Theme and each plugin include own POT file in folders:
(example of paths for Langwitch theme)
- Theme Admin - ./wp-content/themes/langwitch/ait-theme/languages/admin-langwitch.pot
- Theme Frontend - ./wp-content/themes/langwitch/ait-theme/languages/langwitch.pot
- AIT-Languages plugin - ./wp-content/plugins/ait-languages/languages/ait-languages.pot
- AIT-Shortcodes plugin - ./wp-content/plugins/ait-shortcodes/languages/ait-shortcodes.pot
- AIT-Toolkit plugin - ./wp-content/plugins/ait-toolkit/languages/ait-toolkit.pot
- Revolution Slider plugin - ./wp-content/plugins/revslider/languages/revslider.pot
Each .po and .mo file must be saved in correct locale format which consists from Language Code and Country Code.
Correct locale formats for .po and .mo files names (both .po and .mo files using the same name):
- Theme Admin - admin-LanguageCode_CountryCode.po
example: admin-sr_RS.po - Theme Frontend - LanguageCode_CountryCode.po
example: sr_RS.po - AIT-Languages plugin - ait-languages-LanguageCode_CountryCode.po
example: ait-languages-sr_RS.po - AIT-Shortcodes plugin - ait-shortcodes-LanguageCode_CountryCode.po
example: ait-shortcodes-sr_RS.po - AIT-Toolkit plugin - ait-toolkit-LanguageCode_CountryCode.po
example: ait-toolkit-sr_RS.po - Revolution Slider plugin - revslider-LanguageCode_CountryCode.po
example: revslider-sr_RS.po
To create these files we recommend Poedit tool.
After installation, go to preferences of Poedit via menu File > Preferences and in Editor tab of options select "Automatically compile .mo file on save" to automatically create .mo file during saving .po file.
After this, you can start translation and create *.po and *.mo files.
1. start with click on the button Create new translation:
2. window to select POT file appears.
Navigate to POT file from which you'll create .po and .mo files. So for example, if you are going to translate Theme Admin now, open POT file for theme admin: ./wp-content/themes/langwitch/ait-theme/languages/admin-langwitch.pot
3. after opening POT file, "Translation Language" selection appears, here choose your new language, for example Serbia in our example.
4. now you can start translate words included in this POT file to your new language:
5. if you're done with translation click Save button to save .po and .mo files.
Don't forget to write the correct name of file in locale format mentioned above.
6. repeat these steps with each POT file if you want translate also Theme Frontend and Plugins.
10. Multilingual content - translate website content
Translation of main content which consists from posts, pages and custom post types is managed from the edit page of post type which you want translate.
For example you can manage all translations of pages from list of your created pages, where you can see all translations for each page:
[rule]
Pages Translation
1. Create new page
If you create new page, page is automatically assigned to the language selected in the top WordPress bar, or you can manually select language of page from sidebar:
2. Create translation of existing page
There are two ways how create translation of some page in another language:
1. you can click on the "+" button under flag in the row of page for which you want create translation:
2. you can create translation of any page directly from the edit screen of page for which you are going to create translation:
After this when you click to create new translation of page you are going to "Add New Page" screen where you are creating translation of page.
Fill out all information about page in another language and publish this new page.
In the list of your pages you can see present translation of page marked with pencil icon image, with click on this pencil icon you can edit translation of page:
Posts and Custom Post Types Translation
Steps to translate content of Posts and Custom Post Types are the same as translation of Pages content described in previous part about pages translation.
Additionally for Posts and Custom Post Types you may need translate into each language also Taxonomies (categories to which are posts or custom post types assigned) and Tags.
1. Translate posts Categories
Translation of categories is very similar to translation of pages, you can see all translations of categories in the admin Categories page where are listed categories.
Steps to translate categories of standard WordPress Posts and categories of Custom Post Types are the same, example below describe translation for standard WordPress Post type.
You can add new translation of category with click on plus (+) icon for specific language in the list of all categories, or you can create translation through Edit screen while you are editing some category:
When you've created new category in another language, you can specify in edit screen of this new category which category from another language is translation of currently edited category:
2. Translate Posts
If you have created post categories for each language, post created for specific language may be assigned to categories created for the same language.
Examples how the post in two languages may be assigned to categories in two languages created in previous example:
[rule]
WordPress Menus Translation
For each language version of your website you can create also specific menu.
In main WordPress Menus options you can create for each language new menu. Each created menu may be assigned to Theme Location in another language:
[rule]
Widgets and Widget Areas Translations
In main Theme Options you can modify names of each created Widget Area or Sidebar, these names of widget areas will be used according to selected WordPress language.
For each widget you can specify language in which this widget will be displayed:
11. Multilingual content - translate Page Builder content
Using our Page Builder you can build unique layout for each created page.
In the selection of pages available in the top of Page Builder screen are listed all pages from all languages. Select page for which you want create unique layout, doesn't matter what is the language of the page, you can edit each page separately and use for them elements what you want.
On the images below are visible differences between translation of English and German versions of page. You can see the flags which indicate the language of currently edited page.
All elements use information created for language of page which is currently edited. For example Posts Element provide selection of categories which were created for specific language.
Examples of editing page available in two languages
12. Elements
!!! Note, not all elements must be present within current theme !!!
Depends on installed theme which Elements are available in your theme admin.
Using elements you can build easily professional look of your pages in a few minutes, simply drag and drop element to the place and order them to achieve wanted look of page.
More information about adding elements to your pages find please in Default Layout and Page Builder documentation page.
Settings of elements are divided to Basic and Advanced options, find please more information about Advanced options under list of elements below.
Sticked unsortable elements
Elements with fixed position on page, their positions can't be changed.
Sortable elements
Elements which you can drag and drop to order them and achieve wanted layout of page.
- Advertisements
- Columns
- Comments
- Contact Form
- Content
- Countdown
- Counters
- Easy Slider
- Events
- FAQ
- Google Map
- Horizontal Rule
- Job Offers
- Member
- Members
- Mixcloud
- Opening Hours
- Partners
- Portfolio
- Posts
- Price Table
- Services
- Sitemap
- SoundCloud
- Testimonials
- Text
- Toggles
- Video
Insert elements
On the right side of Default Layout screen you can find all available elements which may be added to your pages. Simply drag and drop element into section with Sortable Elements.
Available elements are divided in sections:
- Fullwidth Elements
- elements can't be used inside Columns element - Fullwidth or Columnable Elements
- elements may be used also in columns of Columns element
With simple click on element you can open and edit Basic or Advanced options of element.
Name your Elements
For better clarity in a heap of elements you can write name for each of them, so you can still find in a few seconds element which needs to be modified.
Advanced options of element
More elements provide options to edit Basic and Advanced options.
Basic options of elements are described below, for each element separately.
In Advanced options you can find:
If you are editing element in Page Builder screen, so you're going to made specific settings for element just on specific page, you can enable or disable using of Advanced options with selection Enable.
If you select Yes, used will be settings which you made for this element in Page Builder screen.
If you select No, for this element will be loaded settings from Default Layout options where you set up some settings for element globally for whole site. Every time you select "No", values set up for this element in Page Builder screen will be overwritten with values set up for this element in Default Layout options.
Other advanced options available for elements are:
Custom Class - write your own class or more classes, you will be able easily add your own custom css styling for elements through your own classes
If you are interesting write your own styling, use please child theme which you received with theme. This child theme contains also custom.css file where you can write own styling. If your child theme doesn't have custom.css file, simply create this file in root directory of child theme - styles from tis file will be loaded automatically.
Title - title text displayed above element
Description - description text displayed above element
Alignment - select alignment for title and description text
Element Background section
Background - set up background color for element section, you can set up as background image with all positioning options like Repeat, Position and Scroll
Spaces around Element section
Top Margin - space above element
Top Padding - top space inside element
Bottom Padding - bottom space inside element
Bottom Margin - space below element
Other settings available in Advanced options of specific element are related to currently edited element and these options are explained below, for each element separately.
[rule_top]
Advertisements
Advertisements element display on your site Advertisements in selected time period. You must have created Advertisements items in settings of Advertisements Custom Post Type available from main WordPress menu.
Element provide options:
Category - select which category of advertisements will be displayed
Order By - select order of displayed advertisements, available are options:
- Creation Date: order by date when advertisements were created
- Item Order: order of displayed advertisements depends on the number in Order field for each advertisement, order number may be changed in edit screen of each advertisement
- Random: advertisements will be displayed in random order
Order - select Ascending or Descending order
Open In New Window - decide if advertisement link will be opened after click in the new browser window
Time - set the time visibility of each advertisement
Advanced options
Border Color - color of the border around advertisements
Background - color of the advertisements background
[rule_top]
Columns
Using Columns element you can divide Columnable Elements into columns layout.
Available are more layouts. In one row, you may have from one to six columns and select the size of them as well. Order of used columns may be changed easily, simply drag&drop the column to wanted position.
Check out following images:
After click on the element inside columns are displayed all settings of this element below the columns:
[rule_top]
Comments
Comments element display WordPress Comments section which is usually below the page content. With this element you can display Comments section anywhere you want in page layout.
Element provide just option to show or hide comments on page and default Advanced options like other elements.
[rule_top]
Contact Form
Contact Form element create the form on your page, with all inputs specified directly in the options of this element.
Provided options are:
Email Address - type an email address which receive the message sent from this form
Email Subject - type the text which will be displayed as the subject of received form
Email Content - type the content of received mail. To get values from inputs used in the form, use please "Name" value used for input.
Example of email content: your form will include the text field with name "sender-name".
Then in the field Email Content you can write text "This message was sent by {sender-name}".
Placeholder {sender-name} will be replaced with the text what visitor of your site write into that field.
Success Message - message displayed when the form was successfully sent
Error Message - message displayed when the sending of form failed
Warning Message - message displayed after unsuccessful validation of form inputs
Form Inputs
Label Width - specify the custom width for labels
Captcha - decide if you want use, or you do not want use the Captcha feature.
Captcha add into form the special field where visitor of your site must type the short string displayed on image. It prevent automated sending of spam messages through your form.
Captcha Label - text displayed as label for captcha
Captcha Text - text displayed beside captcha input, may be used as some help text for example
Reset Button - you may show in the form Reset Button as well, after click on this button the form inputs will be cleared.
Escape Form Inputs - escape special characters from values received in email. Turn option OFF if values of checkboxes, radio buttons or select are in Language which include special characters
By clicking on link "+ Add New Item" you can add new inputs to your form and specify:
Label - text displayed as label for input
Name - the unique name of input, string from this field may be used in the Email Content message in the form {name-of-input} - see an example above, please.
Input Type - select type of this input, available are:
- Checkbox Horizontal - display checkboxes horizontally
- Checkbox Vertical - display checkboxes vertically
- Date - date input
- Email - email input
- Hidden - hidden input
- Radio Horizontal - display radio buttons horizontally
- Radio Vertical - display radio buttons vertically
- Select - select input
- Text - simple text input
- Textarea - textarea input
- URL - URL input
Value - value of input which will be written in the text fields when form loads. In case of input types which may include more values (checkboxes, radio buttons, select input), use semicolon separator to specify more values.
Examples:
checkbox 1;checkbox 2;checkbox 3; ... checkbox n
radio button 1;radio button 2;radio button 3; ... radio button n
select value 1;select value 2;select value 3; ... select value n
Placeholder - text used in the text field as placeholder
Size - size of the input, available are:
- Full Size: input over full width of contact form section
- Half Size: input over half size of contact form section
- Half Size - one per row: input over half size of contact form, floated inputs are displayed side by side
Required - input will be marked as required
Advanced options
Label Width - specify the custom width of form labels
Using drag&drop system you can easily change order of inputs inside contact form. Just drag and drop input to position you want.
[rule_top]
Content
Content element display the content created for page. You can edit default content of page directly in editor which is included in this element while you edit layout of page in Page Builder, or you can edit page content in classic WordPress way, through default WordPress Edit page.
[rule_top]
Countdown
Countdown element display the counter, which count down the time to specified date.
Size - value in px specify diameter of the countdown circles
Line Width - value in px specify thickness of the countdown circles
Date From - date which specify the start of counting, is used to calculate the remainder time
Date To - date which specify the end of counting, is used to calculate the remainder time
Finished Text Screen - editor where you can write some simple text or another content which appears when the countdown will end
Advanced options
Bottom Color - base color of countdown circles
Top Color - color which shows the current value on countdown circles
[rule_top]
Counters
Counters element provide option to display one or more counters on page in some specific shape.
Available are options:
Type - you can select from three types of counter:
- Gauge: counter in the shape of circle
- Line: counter in the shape of line
- Text: counter which show numbers, counts from 0 to specified number
Dimension - specify dimension of counter in px
Thickness - specify thickness of counter in px
By clicking on link "+ Add New Item" you can add new counters and specify their values:
Current Value - the value which will be shown by counter. For types Gauge and Line use the number from 0 to 100, in case of Text type you can use bigger number.
Title - text displayed as title of counter
Description - text displayed as description with counter
Advanced options
Bottom Color - base color of counter
Top Color - color which shows the current value on counter
Using drag&drop system you can easily change order of created counters if you need. Just drag and drop each counter to position you want.
[rule_top]
Easy Slider
Easy slider element allows you to create simple slider presentation of images anywhere on your pages.
Available are options:
Animation - option to select animation effect of transitions between slides, available are animation:
- Slide Horizontal: slides are moved from right side to left
- Fade: slides appears and disappears in place with fade effect
Autoplay - decide if slider starts switch between slides automatically after page load
Size - size of slider, available are sizes:
- Content Size: width of slider depends on content width
- Fullwidth Size: width of slider depends on browser window width, images are visible through full width of screen
Image Format - select format of images used in slider
Navigation - select type of navigation, available are navigations:
- Bullets: navigate through slides by clicking on bullets
- Thumbnails: navigate through slides by clicking on thumbnail of each slide
- None: do not show navigation
Description Animation - select animation effect for description box
By clicking on link "+ Add New Item" you can add new slides and specify their values:
Link - URL of link used for image in slide
Image - URL of image displayed in slide
Title - text displayed as title in description box
Description - main text displayed description box
Button Text - text displayed on button in description box
Text Alignment - select alignment for text in description box
Position of Description - select position of description box in slide
Description Width - specify the width of description box
Advanced options
Slider Layout section
Slider Border - specify the color of border around slider
Autoplay Pause - set up time in seconds between each auto transition
Navigation Position - select position of navigation, available is Outside or Inside position
Thumbnail Border - specify the color of border around thumbnails
Slider Descriptions Layout section
Width - specify the width of description box globally for all created slides
Vertical Offset - set up top and bottom offset of description boxes
Horizontal Offset - set up left and right offset of description boxes
Background - specify the background color and opacity of description boxes
Title - color of titles in description boxes
Title Size - font size of titles in description boxes
Text - color of main text in description boxes
Button Color - color of buttons in description boxes
Button Text - color of text on buttons in description boxes
Button Opacity - specify opacity of buttons in description boxes
Using drag&drop system you can easily change order of created slides. Just drag and drop each slide to position you want.
[rule_top]
Events
Events element display events created in settings of Events Custom Post Type available from main WordPress menu.
You can display all events or just some from specific category.
Category - select which category of events will be displayed
Order By - select order of displayed events, available are options:
- Creation Date: order by date when events were created
- Item Order: order of displayed events depends on the number in Order field for each event, order number may be changed in edit screen of each event
- Random: events will be displayed in random order
Order - select Ascending or Descending order
Count - number of displayed events
Layout - select Box or List layout of displayed events
Text Rows - specify the number of rows for description text displayed with each event
Advanced Info - decide if you want display post information with events
Box Layout settings section
Columns - select the number of events displayed in one row
Text Alignment - select Left, Center or Right alignment for text
Carousel - decide if you want use the carousel feature for displayed events
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
Image Format - select format of images displayed with events
List Layout settings section
Columns - select the number of events displayed in one row
Carousel - decide if you want use the carousel feature for displayed events
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
Image Format - select format of images displayed with events
[rule_top]
Facebook element create the Facebook box on your page. Available are all options which default Facebook box accept:
Type - select type of created box, available is Likebox and Comments box
Color scheme - select light or dark color scheme for box
Likebox settingssection
Facebook Page URL - URL of Facebook page which will be displayed in box
Height - height of created Facebook box
Show Faces - decide if you want show or hide faces in your Facebook box
Show Stream - decide if you want show or hide the stream of latest posts in your Facebook box
Show Header - display or hide the header of Facebook box
Comments settings section
Number of Posts - specify the count of latest posts which will be displayed in Facebook box
[rule_top]
FAQ
FAQ element provide options to display questions and answers created in FAQ Custom Post Type options available from main WordPress menu.
You can show all created questions or just some from specific category.
Category - select which category of FAQs will be displayed on page
Count - specify count of displayed FAQs
Order By - select order of displayed FAQs, available are options:
- Alphabetically: displayed FAQs will be ordered by alphabet
- Item Order: order of displayed FAQs depends on the number in Order field for each FAQ, order number may be changed in edit screen of each FAQ
- Random: FAQs will be displayed in random order
Order - select Ascending or Descending order
Category Data - show or hide information from selected FAQ category, name and description written for category in FAQ Categories options
[rule_top]
Google Map
Google Map element provide basic options to create Google Map, but available are also many options to style created Google Map in Advanced options!
Type - select the type of Google Map, available is Normal Map, Satellite Map and Hybrid Map type
Size - you can select two types of map size:
- Content Size: width of map depends on the width of content section or column in case you have map inside Columns element
- Fullwidth Size: width of map is set up to full width of screen
Height - specify the height of created Google Map
Address - specify the position displayed on map when it loads
Zoom - specify the zoom level of map right after loading
Markers
By clicking on "+ Add New Item" link you can add markers to your map, and set up for them:
Title - title displayed inside infobox shown after click on marker
Link - link used inside infobox shown after click on marker
Description - description text displayed inside infobox shown after click on marker
Icon Image - image used as icon on the map instead default marker
Address - address which specify the exact position of marker on map
Advanced options
Advanced options include options to style map and change colors of map sections:
Map General Colors section
Map's Border - color of the border around map
Map's Hue - hue color of map
Map's Saturation - saturation level of map
Map's Brightness - brightness level of map
Map Object Colors section
Saturation - saturation level of objects on map
Brightness - brightness level of objects on map
Landscape Hue - hue color of landscape
Administrative Hue - hue color of administrative areas
Roads Hue - hue color of roads
Water Hue - hue color of water
POI Hue - hue color of Points Of Interest (POI)
MouseWheel Zoom - enable or disable zooming of map using MouseWheel
Using drag&drop system you can easily change order of created markers if you need. Just drag and drop markers to position you want.
[rule_top]
Horizontal Rule
Horizontal rule element create the line on page, usually is used as the separator between sections on page. Available is also option to use "top" button on the rule. After click on this button the page scrolls up to the top.
Type - select type of the rule, available is Simple Line, Bold Line, Dashed and Shadowed type or the rule
Size - you can select from two types of the rule size:
- Fullwidth Size: the rule goes over full width of screen
- Content Size: width of the rule depends on the width of content section
Slide Up Button - decide if you want to show "top" button on the rule
Advanced options
Color - specify color of the rule
Top Padding - space above the rule
Bottom Padding - space below the rule
[rule_top]
Job Offers
Job Offers element provide options to display offers created in Job Offers Custom Post Type options available from main WordPress menu.
You can show all created offers or just some of them from specific category.
Category - select which category of job offers will be displayed
Order By - select order of displayed job offers, available are options:
- Creation Date: order by date when job offers were created
- Item Order: order of displayed job offers depends on the number in Order field for each job offer, order number may be changed in edit screen of each job offer
- Random: job offers will be displayed in random order
Order - select Ascending or Descending order
Count - number of displayed job offers
Layout - select Box or List layout of displayed job offers
Text Rows - specify the number of rows for description text displayed with each job offer
Advanced Info - decide if you want display post information with listed job offers
Box Layout settings section
Columns - select the number of job offers displayed in one row
Text Alignment - select Left, Center or Right alignment for text
Carousel - decide if you want use the carousel feature for displayed job offers
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
List Layout settings section
Columns - select the number of job offers displayed in one row
Carousel - decide if you want use the carousel feature for displayed job offers
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
[rule_top]
Member
Member element provide option to display specific member which was created in Members Custom Post Type options available from main WordPress menu.
Member - select which one member will be displayed
Image Format - select format of image displayed with selected member
Text Rows - specify the number of rows for description text displayed with member
Collapsible Rows - option to hide the rows which exceeds the number of visible rows. With turned on "Collapsible Rows" option, rows which exceed the number of visible rows may be shown after click on "Read more" text
[rule_top]
Members
Members element display members created in Members Custom Post Type options available from main WordPress menu.
You can display all of them or just some from specific category.
Category - select which category of members will be displayed
Order By - select order of displayed members, available are options:
- Alphabetically: displayed members will be ordered by alphabet
- Item Order: order of displayed members depends on the number in Order field for each member, order number may be changed in edit screen of each member
- Random: members will be displayed in random order
Order - select Ascending or Descending order
Count - number of displayed members
Layout - select Box or List layout of displayed members
Text Rows - specify the number of rows for description text displayed with each member
Box Layout settings section
Columns - select the number of members displayed in one row
Carousel - decide if you want use the carousel feature for displayed members
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
Image Format - select format of images displayed with members
List Layout settings section
Columns - select the number of members displayed in one row
Carousel - decide if you want use the carousel feature for displayed members
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
Image Format - select format of images displayed with members
[rule_top]
Mixcloud
Mixcloud element create the player with specified song on your page.
Link - enter the link of song from Mixcloud
Height - specify the height of player
Artwork - display or hide artwork in the player
Advanced options
Color - set up decorative color for player
Border Color - set up color for border around player
[rule_top]
Opening Hours
Opening Hours element display opening hours for specified days on page.
Available are text fields for each day from Monday to Sunday, you can write any text for each of them.
Empty Days - decide if you want, or do not want display empty days
Note - text displayed with opening hours
[rule_top]
Page Title
Page Title element display the title of page, you can decide if you want show or hide page title on page.
Available is option to write description which is displayed with page title.
[rule_top]
Partners
Partners element display partners on page. You must have created Partner items in settings of Partners Custom Post Type available from main WordPress menu.
You can show all created partners or just some from specific category.
Category - specify which category of partners will be displayed
Order By - select order of displayed partners, available are options:
- Alphabetically: displayed partners will be ordered by alphabet
- Item Order: order of displayed partners depends on the number in Order field for each partner, order number may be changed in edit screen of each partner
- Random: partners will be displayed in random order
Order - select Ascending or Descending order
Custom Spaces - change default spaces between displayed partners
[rule_top]
Portfolio
Portfolio element display portfolio items created in Portfolio Custom Post Type settings available from main WordPress menu. You can show all portfolio items or just some from specific category.
Category - select category of portfolio items which will be displayed on page
Count - specify the number of displayed portfolio items
Columns - specify the number of columns in which portfolio items will be displayed
Text Rows - specify the number of rows for description text displayed with each portfolio item
Portfolio Layout section
Filter - decide if you want show or hide the filter above displayed portfolio
Item Display - select what will be displayed after click on portfolio item, available are values:
- Link to detail: after click will be displayed single page of portfolio item
- Open in popup: after click will be displayed large image in popup box, if portfolio item has selected Large Image type
Order By - select order of displayed portfolio items, available are options:
- Creation Date: order by date when portfolio items were created
- Item Order: order of displayed portfolio items depends on the number in Order field for each portfolio item, order number may be changed in edit screen of each portfolio item
- Random: portfolio items will be displayed in random order
Order - select Ascending or Descending order
Excerpt - decide if you want show or do not want show the text excerpt with portfolio images
Image Height - specify exact height for portfolio images, to set up height automatically leave this field with value auto or 0 (zero).
Image Offset - specify own offset between portfolio images if you do not want use default value of space between portfolio images
[rule_top]
Posts
Posts element display posts created in default WordPress Posts section.
You can display all posts or just some from specific category.
Category - select which category of posts will be displayed
Order By - select order of displayed posts, available are options:
- Creation Date: order by date when posts were created
- Random: posts will be displayed in random order
Order - select Ascending or Descending order
Count - number of displayed posts
Layout - select Box or List layout of displayed posts
Text Rows - specify the number of rows for description text displayed with each post
Advanced Info - decide if you want display post information with listed posts
Box Layout settings section
Columns - select the number of posts displayed in one row
Carousel - decide if you want use the carousel feature for displayed posts
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
Image Format - select format of images displayed with posts
List Layout settings section
Columns - select the number of posts displayed in one row
Carousel - decide if you want use the carousel feature for displayed posts
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
Image Format - select format of images displayed with posts
[rule_top]
Price Table
Price Table element display price table items created in Price Tables Custom Post Type settings available from main WordPress menu. You can show all price tables items or just some from specific category.
Layout - select the layout of displayed price tables, they can be displayed in Horizontal or Vertical layout
Category - select which category of price tables will be displayed
Order By - select order of displayed price tables, available are options:
- Alphabetically: displayed price tables will be ordered by alphabet
- Item Order: order of displayed price tables depends on the number in Order field for each price table, order number may be changed in edit screen of each price table
Order - select Ascending or Descending order
Standard Color - specify the color for standard price tables
Featured Color - specify color for featured price tables, in edit page of each price table you can specify if this table will be highlighted as featured
[rule_top]
Revolution Slider
Revolution Slider element display selected slider. All created sliders are managed via Revolution Slider options available from default left-side WordPress menu. Revolution Slider is standalone plugin which is installed with theme and provide own pages with options.
Options available in this element are:
Revolution Slider Alias - select alias of slider which will be displayed
Alternative Image - set up image which will be displayed in responsive layout instead of slider
Responsive Resolution - select resolution which will be used as breakpoint, when alternative image will be displayed instead of slider
[rule_top]
SEO
You can set up basic SEO directly from theme options, available options are:
Use - decide if you want to use SEO options for page
Keywords - write keywords for page
Description - write SEO description for page
[rule_top]
Services
Services element display services created in Services Custom Post Type options available from main WordPress menu.
You can display all of them or just some from specific category.
Category - select which category of services will be displayed
Order By - select order of displayed services, available are options:
- Alphabetically: displayed services will be ordered by alphabet
- Item Order: order of displayed services depends on the number in Order field for each service, order number may be changed in edit screen of each service
- Random: services will be displayed in random order
Order - select Ascending or Descending order
Count - number of displayed services
Layout - select Box or List layout of displayed services
Text Rows - specify the number of rows for description text displayed with each service
Box Layout settings section
Columns - select the number of services displayed in one row
Text Alignment - select Left, Center or Right alignment for text
Carousel - decide if you want use the carousel feature for displayed services
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel ows - select the number of rows used in carousel
Image Format - select format of images displayed with services
List Layout settings section
Columns - select the number of services displayed in one row
Carousel - decide if you want use the carousel feature for displayed services
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
Image Format - select format of images displayed with services
[rule_top]
Sitemap
Sitemap element display on page Posts or structure of your Pages. You can select what will be displayed.
Type - select if you want show posts or pages
Count - specify the number of displayed posts or pages, type 0 to show all posts or pages
Order - select Ascending or Descending order
Pages Parameters section
Order By - select order of displayed pages, available are options:
- Alphabetically: displayed pages will be ordered by alphabet
- Item Order: order of displayed pages depends on the number in Order field for each FAQ, order number may be changed in edit screen of each FAQ
Depth - specify the depth of pages structure which will be displayed
Posts Parameters section
Order By - select order of displayed posts, available are options:
- Alphabetically: displayed posts will be ordered by alphabet
- Creation Date: order by date when posts were created
Comments Count - decide if you want show with displayed posts also the number of comments for each post
Category - specify the category of posts which will be displayed
Author - if you want show posts created by some specific user, type User ID number, or more IDs separated by comma if you want show posts from more specific users
How to get an user ID? Go to edit page of user in Users > All Users - click on user name. In the URL of opened user edit page you can find user_id parameter, for example user_id=2 -> User ID of this user is 2
[rule_top]
SoundCloud
SoundCloud element create the player with specified song on your page.
Link - enter the link of song from SoundCloud
How to get the song link? Go to SoundCloud site and click Share button of song which you want show on your site. In the opened box you can find url of song in form http://api.soundcloud.com/tracks/SONG_ID - see following image:
Size - specify the Large or Small size of player
Artwork - display or hide artwork in the player
Autoplay - decide if the player starts playing automatically right after page load
Advanced options
Color - set up decorative color for player
[rule_top]
Testimonials
Testimonials element display on your site testimonials created in Testimonials Custom Post Type options available from main WordPress menu.
You can show all of them or just some from specific category.
Category - select which category of testimonials will be displayed
Order By - select order of displayed testimonials, available are options:
- Creation Date: order by date when testimonials were created
- Item Order: order of displayed testimonials depends on the number in Order field for each testimonial, order number may be changed in edit screen of each testimonial
- Random: testimonials will be displayed in random order
Order - select Ascending or Descending order
Count - specify number of testimonials listed on page
Layout - select Box or List layout of displayed testimonials
Advanced Info - decide if you want display post information with testimonials
Box Layout settings section
Columns - select the number of testimonials displayed in one row
Text Alignment - select Left, Center or Right alignment for text
Carousel - decide if you want use the carousel feature for displayed testimonials
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
Image Format - select format of images displayed with testimonials
List Layout settings section
Columns - select the number of testimonials displayed in one row
Carousel - decide if you want use the carousel feature for displayed events
Carousel Autoplay - turn on or off autoplay feature of carousel
Carousel Fading - turn on or off fading feature of carousel
Carousel Rows - select the number of rows used in carousel
Image Format - select format of images displayed with testimonials
[rule_top]
Text
Text element provide option to put text section anywhere on page. Available is visual editor with which you can easily create any content with shortcodes as well.
[rule_top]
Toggles
Toggles element display on your site toggles created in Toggles Custom Post Type options available from main WordPress menu.
You can show all of them or just some from specific category and select the type of displayed toggles.
Type - select type of toggles, available are types:
- Accordion: with accordion type is still opened just one toggle, after click on another toggle previously opened toggle will be closed
- Toggle: toggle type provide option open more toggles and leave them opened more at once time, toggle is opened and closed by clicking on it
- Horizontal Tabs: toggles are displayed in the horizontal tabs layout
- Vertical Tabs: toggles are displayed in the vertical tabs layout
Category - select category of toggles which will be displayed on page
Order By - select order of displayed toggles, available are options:
- Alphabetically: displayed toggles will be ordered by alphabet
- Item Order: order of displayed toggles depends on the number in Order field for each toggle, order number may be changed in edit screen of each toggle
- Random: toggles will be displayed in random order
Order - select Ascending or Descending order
[rule_top]
Twitter element display Twitter tweets on your page.
To use this element properly you must first create "Application" on Twitter Developers site: https://dev.twitter.com/apps/new
Steps to set up Application
- 1. Go to https://dev.twitter.com/apps/new. You will need to login with your twitter account. In case youre making site for someone else you should create separate account or ask your client to accomplish these steps.
- 2. Fill in required form fields. Use whatever values as these are not important for our element. Dont forget http:// prefix in URL address field. Submit form and create an application.
- 3. You will see your newly created application page.
This page include all necessary information for Twitter Element as Consumer key, Consumer secret, Access token and Access token secret (to get Access token and Access token secret click on "Create my access token" button):
Element options:
Username - twitter username
Count - number of displayed twitter posts
Twitter API Data section
Consumer key - copy from your twitter application page
Consumer secret - copy from your twitter application page
Access token - copy from your twitter application page
Access token secret - copy from your twitter application page
Date Format - specify the format for date, find out more information about date format characters here
Examples
format: j F Y
j - Day of the month without leading zeros
F - A full textual representation of a month, such as January or March
Y - A full numeric representation of a year, 4 digits
so the result time is for example: 1 December 2013
format: d.n.Y
d - Day of the month, 2 digits with leading zeros
n - Numeric representation of a month, without leading zeros
Y - A full numeric representation of a year, 4 digits
so the result time is for example: 1.12.2013
Escape Special Characters - escape special characters used in twitter posts
Clickable Links - use clickable links in twitter posts
Date - show or hide date of twitter posts
[rule_top]
Video
Video element display video from YouTube or Vimeo on page.
Type - select what type of video will be used, available is YouTube and Vimeo type.
Link - paste the url of video
Width - specify the width of player
Height - specify the height of player
Advanced options
Border Color - specify the color of border around player
[rule_top]
13. Shortcodes
Our themes provide more shortcodes which you can find via icon in visual editors:
To see the real look and results of shortcodes do not forget visit please our preview sites of themes!
Available are shortcodes:
[rule]
Button
With many options available for this shortcode you can easily render any button on your site.
Title - type the title displayed on button
Title Color - select the color for button title
Description - type the description text which is displayed with title on button
Description Color - select the color for description text
Text Alignment - select Center, Left or Right alignment for text on button
Width - specify the width of button
URL - type URL which will be opened after click on button
Button Color - select the color of button
Button Alignment - select Center, Left or Right alignment for button, or select None to do not align button in content
Icon - type URL of image which will be displayed in button as icon
Icon Position - select Left, Right, Top or Bottom position of icon on button
Top Margin - specify the space above button
Left Margin - specify the space on the left of button
Right Margin - specify the space on the right of button
Bottom Margin - specify the space below button
Example of Shortcode:
[raw][code][button width="41.2%" title="AIT Themes Button" description="Lorem Ipsum Dolor Sit Amet Consectetur"
iconurl="http://preview.ait-themes.com/theme/solitudo/wp-content/uploads/sites/2/2013/11/check-white.png"
iconalign="left" textalign="left" align="center"][/code][/raw]
[rule_top]
Lists
Lists shortcode create styled html list on your page.
Layout - select Fullwidth or Halfwidth layout of list
Style - select style for list
Lines - enable or disable showing of lines between list items
Example of Shortcode:
[raw][code][lists layout="half" style="style2"]
<ul>
<li>Lorem...</li>
<li>Ipsum...</li>
</ul>
[/lists][/code][/raw]
[rule_top]
Notification
Notification shortcode render on your page Warning, Success, Information or Attention box.
Available is just one option:
Type - select type of Notification box, available are Warning, Success, Information or Attention types
Example of Shortcode:
[raw][code][notification type="success"]Lorem ipsum dolor sit amet, consectetur adipisicing elit[/notification][/code][/raw]
[rule_top]
Raw
Raw shortcode prevent adding of WordPress autoformatting, for example automatic adding of <br> or <p> tags.
This shortcode have no any options.
Example of Shortcode:
[code][raw]...content...inside...shortcode...[/raw][/code]
[rule_top]
Horizontal rule
Shortcode render line in page content.
Available is just one option:
Type - select type of rule, available are options:
- Basic: basic line
- Top: line with button to move on the top of screen
- Empty Line: empty invisible line
- Clear Floated Only: clear floated elements
Example of Shortcode:
[raw][code][rule type="basic"]
[rule type="top"]
[rule type="empty"]
[rule type="clear"][/code][/raw]
[rule_top]
Modal Window Link
Modal Window Link shortcode create on your site link to content which will be opened in the popup after click.
As link may be used simple text, button or image as well.
Available are options:
Type - select type of modal window link, available is Simple text link or Button, to use image as link, simply put between shortcodes instead simple text html code of image
Link text - text which will be displayed as link
Modal Window Link name - name of the modal window link, this name must be the same as the name of modal window content!
Width - width of modal window
Height - height of modal window
Example of Shortcode:
[raw][code][modal-link type="button" content-name="my-modal-window" width="550" ]Open Modal Window[/modal-link][/code][/raw]
[rule_top]
Modal Window Content
Modal Window Content shortcode store the content of modal window.
Available are options:
Modal Window Content name - name of the modal window content, this name must be the same as the name of modal window link!
Content - type the content which will be displayed in modal window
Example of Shortcode:
[raw][code][modal-content name="my-modal-window"]Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.[/modal-content][/code][/raw]
[rule_top]
14. Members post type
Using Members post type you can display on your site profiles of peoples. You can create unlimited count of members and divide them to categories. Its just on you which category of members or one specific member will be displayed anywhere in page content
[rule type="empty"]
Create new Member
In main WordPress menu navigate to Members menu option where are available options:
- All Members - display all your Members posts
- Add New - page to add new Member
- Categories - page to manage categories of Members
[rule type="empty"]
Steps to add new Member
1. Click on Add New link in menu or button on page with all your Members to create new Member.
You will see the following screen:
2. On the top of Add New screen write title for your new member, below title field are available options to add member's photo, write member's position, some text about member and option to assign social icons for member.
Member's Additional Info
For each member are available options:
- Position
- About member
- Social Icons
Member's Photo
Option to select featured image for member.
By clicking "+ Add New Item" link you can create new social icon for member. For each social icon are available options like Title of social icon, Image which represent this social icon and link for social icon which will be opened after click on icon.
Number of social icons for member is not limited.
3. On the right side is place to assign new member to some category, so you can divide your members to more categories and decide then which category of members or one specific member will be displayed on page. In case you are creating multilingual website, select also language of currently created post.
4. Order field is used to order members displayed on page. Just write for your members numbers to order them like you want.
5. Click Publish button to submit and create your new Member
Check out our Members and Member Element to see how insert members into page using Page Builder.
[rule type="empty"]
Edit Member
To edit your existing members go to page with All Members and click on the title of member. In opened page you can change values set up for member in the same way as you did when you create new member. After editing click Update button on the right side of edit screen.
15. Partners post type
Using Partners post type you can display on your site section with partners images. You can create unlimited count of partners and divide them to categories. Its just on you which category of partners will be displayed anywhere in page content
[rule type="empty"]
Create new Partner
In main WordPress menu navigate to Partners menu option where are available options:
- All Partners - display all your Partners posts
- Add New - page to add new Partner
- Categories - page to manage categories of Partners
[rule type="empty"]
Steps to add new Partner
1. Click on Add New link in menu or button on page with all your Partners to create new Partner.
You will see the following screen:
2. On the top of Add New screen write title for your new partner, below title field are available options to add partner logo and link which will be opened after click on this logo.
3. On the right side is place to assign new partner to some category, so you can divide your partners to more categories and decide then which category of partners will be displayed on page. In case you are creating multilingual website, select also language of currently created post.
4. Order field is used to order partners displayed on page. Just write for your partners numbers to order them like you want.
5. Click Publish button to submit and create your new Partner
Check out our Partners Element to see how insert partners into page using Page Builder.
[rule type="empty"]
Edit Partner
To edit your existing partners go to page with All Partners and click on the title of partner. In opened page you can change values set up for partner in the same way as you did when you create new partner. After editing click Update button on the right side of edit screen.
16. Portfolio post type
Portfolio post type provide option to create set of portfolio items which are presented on the page in grid layout. Each portfolio item may represent some image which will be opened as in gallery, or another portfolio item may be used as the link to website or opens an video in lightbox.
[rule type="empty"]
Create new Portfolio
In main WordPress menu navigate to Portfolio menu option where are available options:
- All Portfolio Items - display all your Portfolio Items
- Add New - page to add new Portfolio Item
- Portfolios - page to manage categories of Portfolio Items
[rule type="empty"]
Steps to add new Portfolio Item
1. Click on Add New link in menu or button on page with all your Portfolio Items to create new Portfolio Item.
You will see the following screen:
2. On the top of Add New screen write title for your new portfolio item, below title field is available editor to write content for portfolio item which is visible on the single portfolio item page or directly in displayed portfolio in case you select show excerpt in portfolio and Excerpt field for portfolio item is empty.
Large Image
In Large Image section select featured image for portfolio item, this image will be displayed in portfolio for this item and on single portfolio item page.
Excerpt
Text written in excerpt field will be displayed on page with portfolio item directly in portfolio. If this field is empty, in the portfolio is created excerpt text from main content of portfolio item.
Portfolio Item Options
For each portfolio item you can set up:
- Type - select if this portfolio item open after click Large Image, Website or Video
- Crop From Position - select the position of cropping when it's necessary crop image uploaded for portfolio item
- Link To Website - option for Website type, URL of site which will be opened after click on portfolio item
- Link To Video - option for Video type, URL of video from YouTube or Vimeo which will be opened after click on portfolio item
- Title - displayed as title in one accordion
- Description - displayed as text content inside accordion
- Title - title displayed with gallery item
- Image - url of image displayed as gallery item
- Link - url of video (vimeo or youtube) displayed as gallery item
[rule type="empty"]
Information Section provide options to create styled accordion section at frontend with information about portfolio item
[rule type="empty"]
Item Gallery section provide option to assign more images or videos for one portfolio item
3. On the right side is place to assign portfolio item to some category, so you can divide your portfolio items to more categories and decide which category will be displayed on page
4. Order field is used to order portfolio items displayed on page. Just write for your portfolio items numbers to order them like you want.
5. Click Publish button to submit and create your new Portfolio Item
Check out our Portfolio Element to see how insert portfolio into page using Page Builder.
[rule type="empty"]
Edit Portfolio Item
To edit your existing portfolio items go to page with All Portfolio Items and click on the title of portfolio item. In opened page you can change values set up for portfolio item in the same way as you did when you create new portfolio item. After editing click Update button on the right side of edit screen.
17. Services post type
With Services post type you can create unlimited count of service boxes and show them in any place of page content. Services may be divided to categories so you can show another service boxes on another page.
[rule type="empty"]
Create new Service
In main WordPress menu navigate to Services menu option where are available options:
- All Services - display all your Services posts
- Add New - page to add new Service
- Categories - page to manage categories of Services
[rule type="empty"]
Steps to add new Service
1. Click on Add New link in menu or button on page with all your Services to create new Service.
You will see the following screen:
2. On the top of Add New screen write title for your new service, below title field are available options to specify for each service:
- Subtitle - text displayed with the main title of service
- Image - image displayed with service
- Hover Image - image displayed with mouse cursor over
- Description - main text displayed in service
- "Read more" text - text for button displayed in service
- Link - link used for button in service
3. On the right side is place to assign new service to some category, so you can divide your services to more categories and decide then which category of services will be displayed on page.
4. Order field is used to order services displayed on page. Just write for your services numbers to order them like you want.
5. Click Publish button to submit and create your new Service
Check out our Services Element to see how insert services into page using Page Builder.
[rule type="empty"]
Edit Service
To edit your existing services go to page with All Services and click on the title of service. In opened page you can change values set up for service in the same way as you did when you create new service. When you are done with editing, click Update button on the right side of edit screen.
18. Testimonials post type
Using Testimonials post type you can display section with all testimonials or just some of them from specific category.
[rule type="empty"]
Create new Testimonial
In main WordPress menu navigate to Testimonials menu option where are available options:
- All Testimonials - display all your Testimonials posts
- Add New - page to add new Testimonial
- Categories - page to manage categories of Testimonials
[rule type="empty"]
Steps to add new Testimonial
1. Click on Add New link in menu or button on page with all your Testimonials to create new Testimonial.
You will see the following screen:
2. On the top of Add New screen write title for your new Testimonial, below title field is available editor to write testimonial text.
Testimonial Options
For each testimonial are available options:
- Author - text displayed as author of testimonial
- Rating - rating value
Testimonial Icon
Option to select featured image for testimonials. This image will by displayed with testimonial on page.
3. On the right side is place to assign new testimonial to some category, so you can divide your testimonials to more categories and decide then which category of testimonials will be displayed on page.
4. Order field is used to order testimonials displayed on page. Just write for your testimonials numbers to order them like you want.
5. Click Publish button to submit and create your new Testimonial
Check out our Testimonials Element to see how insert testimonials into page using Page Builder.
[rule type="empty"]
Edit Testimonial
To edit your existing testimonials go to page with All Testimonials and click on the title of testimonial. In opened page you can change values set up for testimonial in the same way as you did when you create new testimonial. After editing click Update button on the right side of edit screen.
19. Toggles post type
Using Toggles post type you can display section with accordions, toggles or tabs anywhere in page content.
[rule type="empty"]
Create new Toggle
In main WordPress menu navigate to Toggles menu option where are available options:
- All Toggles - display all your Toggles posts
- Add New - page to add new Toggle
- Categories - page to manage categories of Toggles
[rule type="empty"]
Steps to add new Toggle
1. Click on Add New link in menu or button on page with all your Toggles to create new Toggle.
You will see the following screen:
2. On the top of Add New screen write title for your new Toggle, below title field is available editor to write content for new toggle.
3. On the right side is place to assign new toggle to some category, so you can divide your toggles to more categories and decide then which category of toggles will be displayed on page.
4. Order field is used to order toggles displayed on page. Just write for your toggles numbers to order them like you want.
5. Click Publish button to submit and create your new Toggle
Check out our Toggles Element to see how insert toggles into page using Page Builder.
[rule type="empty"]
Edit Toggle
To edit your existing toggles go to page with All Toggles and click on the title of toggle. In opened page you can change values set up for toggle in the same way as you did when you create new toggle. After editing click Update button on the right side of edit screen.
20. Facilities post type
With Facilities post type you can create unlimited count of facilities and show them in any place of page content. Facilities may be divided to categories so you can show another facilities on another page.
Create new Facility
In main WordPress menu navigate to Facilities menu option where are available options:
- All Facilities - display all your Facilities posts
- Add New - page to add new Facility
- Categories - page to manage categories of Facilities
Steps to add new Facility
1. Click on Add New link in menu or button on page with all your Facilities to create new Facility.
You will see the following screen:
2. On the top of Add New screen write title for your new facility, below title field are available options to specify for each facility:
- Icon - icon displayed with facility
- Icon Color - color for the facility icon
- Description - main text displayed in facility
- Link - link used for button in facility
3. On the right side is place to assign new facility to some category, so you can divide your facilities to more categories and decide then which category of facilities will be displayed on page.
4. Order field is used to order facilities displayed on page. Just write for your services numbers to order them like you want.
5. Click Publish button to submit and create your new Facility
To see how place Facilities to some page as Element, check out please Default Layout and Page Builder documentation page.
Edit Facility
To edit your existing facilities go to page with All Facilities and click on the title of facility. In opened page you can change values set up for facility in the same way as you did when you create new facility. When you are done with editing, click Update button on the right side of edit screen.
21. Infopanels post type
With Infopanels post type you can create unlimited count of infopanels and show them in any place of page content. Infopanels may be divided to categories so you can show another infopanels on another page.
Create new Infopanel
In main WordPress menu navigate to Infopanels menu option where are available options:
- All Infopanels - display all your Infopanels posts
- Add New - page to add new Infopanel
- Categories - page to manage categories of Infopanels
Steps to add new Infopanel
1. Click on Add New link in menu or button on page with all your Infopanels to create new Infopanel.
You will see the following screen:
2. On the top of Add New screen write title for your new infopanel, below title field are available options to specify for each infopanel:
- Title - title displayed with infopanel right side
- Description - text displayed in infopanel right side
- Data - additional data in infopanel right side
3. On the right side is place to assign new infopanel to some category, so you can divide your infopanels to more categories and decide then which category of infopanels will be displayed on page.
4. Order field is used to order infopanels displayed on page. Just write for your services numbers to order them like you want.
5. Click Publish button to submit and create your new Infopanel
To see how place Infopanels to some page as Element, check out please Default Layout and Page Builder documentation page.
Edit Infopanel
To edit your existing infopanels go to page with All Infopanels and click on the title of infopanel. In opened page you can change values set up for infopanel in the same way as you did when you create new infopanel. When you are done with editing, click Update button on the right side of edit screen.
22. Revolution Slider
Revolution Slider comes with features:
- Unlimited Slides
- Unlimited Caption Layers
- CSS Animation with a fallBack to jQuery
- Vimeo & YouTube video
- Drag and Drop layering
[rule type="empty"]
How to create new Revolution Slider
In main WordPress menu navigate to Revolution Slider. Opened screen shows all your created slides.
To add new slider click on the button Create New Slider.
Necessary options for each slider are:
- Slider Title - the title of slider
- Slider Alias - alias is the unique string which represent this slider, using alias you'll choose which slider will be displayed on page
Available are many other options which Revolution Slider plugin provide, you can find them in accordions on the right side of screen.
[rule type="empty"]
How to add/edit slides of Revolution Slider
When your slider is created, you can start create slides.
Click on "Edit Slides" button in the list of all your created sliders and add new slide by click on button "New Slide" or edit existing slide by click on "Edit Slide" button:
In edit page of slide you can see your created slide and edit each layer used in this slide.
You can edit General Settings for whole slide and also edit each layer separately through options:
- Layer General Parameters
- Layer Animation
- Layer Links & Advanced Params options
In Layer timing & Sorting options you can order layers and change times for each of them.
[rule type="basic"]
For more information follow please original documentation of Revolution Slider plugin.