Theme installation

After you have purchased the theme, go to “Downloads” menu in your Themeforest account and download the theme package to your computer.

Extract it and find installable “” in the root folder of the theme package. Log in your domain, where you have previously installed WordPress. Go to Appearance>Themes>Add new>Upload theme and upload installable archive. Activate the theme and begin installing and activating plugins. If you want to import demo data, go to Appearance>Import demo data section and click “Import demo data” button.

install-second After that don’t do anything. Simply wait till the import process is completed and you see “Import is completed” messages.


IMPORTANT NOTE! If you are going to customize theme files, we strongly recommend to install child theme at once. Child theme is located in “Child Theme” folder of theme archive. More information about child theme you can find in this documentation article.

Child theme. How do I use it?

It is very important to install child theme in case you are going to modify theme files according to your needs.

The greatest advantage of the child theme is that you can store the modified theme files in it and they will never be lost after you update the parent theme.


Because child theme doesn’t require updates.

How to get started with the child theme?

The principle of work of the child theme is the same for all themes. So let’s review only Secondtouch theme as an example.

First of all you have to install the parent theme, as described in “Theme installation” article. You can find it either in the Documentation file of the theme package or in our online documentation.

Find “secondtouch-child” zip archive in theme package.



Install it the same way as the parent theme over Appearance>Themes>Add new. Activate it.

How to upload modified files to the child theme?

Child theme fully inherits functionality of the parent theme. So you don’t have to copy all files from the parent theme. You have to copy only those files you have modified. The modified file has to have the same path as this file in the parent theme.

For instance, if you want to modify the top panel of the theme, you need to edit section-panel.php file that is stored in “templates” folder. After you have modified this file, you have to upload it to the child theme in the same folder, as it is stored in the parent theme. Example “templates/section-panel.php”.




How to add my custom CSS to the child theme?

You can insert your custom CSS codes directly to the style.css file, that is stored in child theme folder by default or to

  • Theme Options>Advanced Options>CSS Code (Onetouch, Atlantis, Embrace, Ultron)
  • Theme Options>Main Options>Custom CSS (Maestro, Glider, Secondtouch)




If you choose the second way, don’t worry – custom CSS won’t be lost after you update the parent theme.

Getting theme updates

There are two ways to update the theme to its latest version:

  • manually;
  • automatically.


In order to update the theme manually, you need to perform the following steps:

  1. Log in your Themeforest account;
  2. Go to ‘Downloads‘ section;
  3. Click on the button in from of the theme name;
  4. Select “Installable WordPress file only” option from the dropdown menu and download the zip archive.o-update1
  5. Unzip ‘‘ archive and upload folder ‘secondtouch‘ via FTP to ‘wp-content/themes‘ directory replacing the old files.
  6. After that go to Appearance>Install Plugins section and update the required plugins. If there is no such section in your admin dashboard, it means that all plugins are up-to-date and there are no new versions available.


In order to activate auto update function, you need to enter your theme purchase code in Theme Options>Main Options>Item Purchase Code field.



Once done, you will receive notifications about the available versions in the Updates section of the admin dashboard.



In order to update the theme:

  1. Go to Updates section and perform an update from there.
  2. After that go to Appearance>Install Plugins and update the required plugins from there.  If there is no such section in your admin dashboard, it means that all plugins are up-to-date and there are no new versions available.

If you encounter any problem while updating automatically, please, update manually.

Google map activation

In order to make Google Map work on your site, it is required to activate your Google Map API Key in theme options of the theme.

Please, follow the next steps:

  1. Generate your Google Map API Key by following instructions in this tutorial.
  2. Go to Options > Additional settings section and find Map api key field there.
  3. Insert your API key and save settings. google-api-second
  4. When you are ready, you can add map on your pages via Metro Visual builder or Visual Composer editors.

Posts.Post galleries

Posts are created in Posts>Add new.


They can be made in three formats: standard, gallery, video.



To make a post in a standard format, type any text in the text field of classic editor



Add image by clicking on ‘Add media’. Select image from media library and click ‘Insert into post’.


If you make a gallery post, switch to format ‘gallery’. Click ‘add media’, ‘create gallery’, select some images you need and click ‘create a new gallery’



You can reorder the images the way you want by dragging and dropping. In gallery settings select, which post type images will be linked to and select number of columns, in which they will be displayed on post.

When the settings are adjusted, click ‘Insert gallery’.



To make a video post switch to video format. There will appear section ‘Post video’ on page



Add youtube or vimeo video ids, or upload self hosted videos from your computer location in format mp4 or webM.


In the section ‘featured image’ set a featured image to your post



Link your post to one or several categories from the list. To create a new category click on ‘add new category’ under category list.



Additional post settings you can adjust in options>posts list options





Simple portfolio. Portfolio slider

Portfolio is created in Portfolio>Add new


After you have entered the title of your portfolio item, you can start adding images. In the section ‘Images gallery’, click ‘Add gallery images’ and select a number of images by holding CTRL button. Click ‘Add to gallery’.



After the images are added, you can reorder them by dragging and dropping to another place.



It is important to set featured image to your portfolio item, which will be displayed on slider or main portfolio page.



You can link your portfolio items to one or several categories.



If you want to create a new category, click on ‘Add new portfolio category’ under the list of existing categories.


To add video item to your portfolio, add the link to the video to the field oEmbed in the section ‘Portfolio Video’



or upload videos in the mp4 or webM format from your computer location.


You can also add description to your portfolio item in the text field of classic editor



By default in portfolio item will be activated additional portfolio fields: Skills and Clients, which you will be able to edit or to delete in section Custom fields>custom fields.



Additional settings for portfolio you will be able to adjust in the section Options>portfolio options




Portfolio fields

Install Advanced Custom Fields plugin…-custom-fields/

Create a new custom field in the section Custom fields>custom fields

Give title to your custom fields and click “Add field”.

Create a field “Skills” with values shown on screenshot

Click “Add Field” again and create “Clients” custom field with values shown on screenshot

After that go down to “Location” section and set it up as in the screenshot

And in the section “Options” select options as in the screenshot

After that click “Publish”.


Metro Visual Builder

The new Metro Visual Builder is a powerful tool for creating your pages. It includes more that 30 modules, each of which has its own settings. The modules are divided in four sections:

  • content modules

  • presentation modules

  • video modules

  • custom content modules

How does Metro Visual Builder work?

You create a page in section Pages>Add new

Metro Visual Builder is activated by default. That’s how it looks

You can use both blue bars for adding sections to your page. The only difference between them is, that the first one adds sections to the top, above other sections, and the second one – to the bottom, below other sections.

When you click ‘add section’ you have to select number of columns, which will be used in your section.

When the columns are selected you can start to add modules. For this click on ‘add module’ button

and start choosing modules for each column.

Each module has its settings, that you will adjust on your own way.

If you want to delete one section, click on ‘delete section’ button.

If you want to delete all sections from your page, simply click on ‘delete all blocks’

Metro Visual Builder makes it possible to move your modules to other sections. Simply drag and drop them to the row or columns you need.

Each section has its own row settings

It gives you possibility to set a background color or a background image to each row of your page.

In the background options you can also select type of background repeat, background attachment and to set row paddings, which you need.

If you want your page to have sidebars, you can select another page template instead of default template in the section ‘page attributes’.

Depending on the page template you select with right, left or both sidebars, there will be displayed default sidebars left or right, which are located in Appearance>Widgets.

If you want to display your custom sidebars, which you will create in Appearance>Sidebar Generator (will be described in the tutorial ‘Sidebar Generator’), select them in the section ‘Select custom sidebar’.

Each page on your site can be displayed in the Page Slider. Add a featured image, which will be displayed in the slider.


Sections are placeholders for a row of Modules. Each Section contains a number of Modules, which are distributed horizontally in the page. For each new row of Modules you must create a new Section.

In your WordPress Administration, edit a Page, Post or Custom Post Type, and scroll to the Custom Meta Boxes, right below the main Content Editor, and look for the Metro Builder.

  • Click “Add Section” on the right hand side.
  • In the popup window, choose a predefined layout; the new Section is now added to the first row of the Metro Builder.
  • At this point you can Add new Modules to the Section
  • if you have several Sections, you can change their position by dragging them vertically and dropping them into the desired position.
  • If you want to delete a Section (and all the Modules in it), click the Delete Section button on the right hand side.

Here is a video demonstration:


After you have added a new Section (see previous Chapter), you can freely add Modules to it.

Click on the Add Module button on the left hand side and choose a Module from the popup window.

Important note:

The Metro Content Builder will completely override the default Content of the Page/Post!

If you add new Sections and Modules to a particular page, you must add the Content Module to display the default Content in the Website.

With this Module, you can display the default Content anywhere within the Sections of the Content Builder.

Here is a video demonstration:


Timeline feature is the best tool to display chronology of your events in the theme.


Timeline is created in the section ‘Time Line’ of your admin dashboard. Go to Timeline>Add new



Create your timeline post using Metro Visual Builder or the shortcode from Metro Visual Builder, which you can paste to the text field of the classic editor. Timeline can be also built using only classic editor if needed.


In the section ‘Attributes’ put the order, in which your timeline will be displayed in the list with other timeline posts.



All your created timeline posts you can display on your pages using Metro Visual Builder module.




Metro Visual Builder Shortcodes

This is a list of Metro Visual Builder shortcodes. You can add them to any post type you need.

The shortcodes will work on pages, where Metro Visual Builder is turned off. If it is turned on, the shortcodes won’t be shown on your page.

First of all, make sure that Metro Visual Builder is turned off.

Add shortcodes only to text tab of the classic editor.

If you add shortcode of the module, that can have some elements, like tiles module and testimonials, you have to duplicate shortcode inside the outer shortcode. Example:

Most of shortcodes contain sample information, like text, titles etc, that must be changed manually.


Content modules


  1. Recent portfolio items – this module displays the latest portflio works. You can display works from one or several categories.

[mvb_recent_works main_title=”Recent projects” categories=”” show_meta=”1″][/mvb_recent_works]


  1. Portfolio items + description – this is a ist of your recent portfolio works with a description.

[mvb_recent_works_desc main_title=”Recent projects” link_url=”” page_id=”888″ read_more=”1″ read_more_text=”Read more”]Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis[/mvb_recent_works_desc]


  1. Recent post row – this module shows latest works from your posts.

[mvb_recent_news main_title=”Recent news” categories=”” no_of_posts=”4″ all_of_posts=”8″ excerpt=”0″ excerpt_length=”12″ unique_id=”mvbacc_52206913ef0fc”][/mvb_recent_news]


  1. Featured post – with this module you can show one or several featured posts on your page.

[mvb_featured_news main_title=”” categories=”9″ no_of_posts=”1″ link_label=”” excerpt_length=”20″ link_url=”” page_id=””][/mvb_featured_news]


  1. Last three posts – displays 3 posts from a particular category.

[mvb_3_posts main_title=”My wishes” categories=”1″ offset=”2″][/mvb_3_posts]


  1. Last four posts – displays 4 posts from a particular category.

[mvb_4_posts main_title=”On the air” categories=”6,9″ offset=”1″][/mvb_4_posts]


  1. Post carousel – displays posts as a carousel. You can choose number of items and categories to display.

[mvb_posts_carousel main_title=”Post carusel” no_of_posts=”5″ categories=”” unique_id=”mvbacc_520b3347b3bea”][/mvb_posts_carousel]


  1. Text module – you can add any text you need to this module.

[mvb_text main_title=”” effects=”fadeIn” css=”padding-top-90″]Looks like One touchBut it is not one touchLorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerciLorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diamnonummy nibh euismod tincidunt ut laoreet dolore magna aliquam eratvolutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation[/mvb_text]


  1. Testimonials module – show testimonials of your clients with this module.

[mvb_testimonials main_title=”Testimonials” effects=”fadeInDown” unique_id=”mvbacc_521330146d76e”][mvb_testimonial_user image=”3793″ main_title=”Sandy Rivers” client_job=”Microhard main developer” sh_keys=”image,main_title,client_job,content”]Just wanted to say hi and tell the world that this theme is by far the most advanced theme that we have purchased from Themeforest. It looks great and it feels that everything has been sorted out well.[/mvb_testimonial_user][/mvb_testimonials]


  1. Blog posts module – this module is for displaying your blog posts

[mvb_blog_posts main_title=”Recent works” categories=”” no_of_posts=”5″ excerpt=”0″ excerpt_length=”25″ thumbnail=”1″ show_meta=”0″ show_data=”1″][/mvb_blog_posts]


  1. Blog posts right image – posts are shown as the list with featured images to the right

[mvb_blog_posts_1 main_title=”Recent works” categories=”” no_of_posts=”5″ excerpt_length=”20″ show_meta=”0″][/mvb_blog_posts_1]


  1. Tiny post list – this module is for displaying your blog posts in mini format.

[mvb_blog_posts_2 main_title=”” categories=”1,8,9″ no_of_posts=”3″ show_meta=”1″][/mvb_blog_posts_2]


  1. Blog posts big image – with this module you can show latest posts from some categories with large image.

[mvb_blog_posts_3 main_title=”Recent works” categories=”6,1,9″ no_of_posts=”1″ excerpt_length=”25″ show_meta=”1″ box_align=”horizontal”][/mvb_blog_posts_3]


Presentation modules


  1. Promo row – you can put any promo to this module.

[mvb_promo_row image=”3561″ main_title=”” effects=””]<h2>Hey people! My name is Crumina and let me introduce my new Metro Theme – “Second <span class=”normal”> touch”</span></h2><br class=”mvb_break”><h6>COMRADES! WE MUST INCREASE THE EFFICIENCY AND QUALITY OF WORK IN EVERY WORKPLACE!</h6>[/mvb_promo_row]


  1. Our team – this module serves to display information about your team members.

[mvb_our_team main_title=”Our Team” presentation_box=”” css=””][mvb_presentation_box image=”3789″ image_flip=”3790″ main_title=”Connor Gibson” sub_title=”Interface Designer” tw_link=”1″ fb_link=”1″ li_link=”1″ gp_link=”1″ in_link=”” vi_link=”1″ lf_link=”” vk_link=”” yt_link=”” de_link=”” pi_link=”” pt_link=”1″ wp_link=”” db_link=”” sh_keys=”image,image_flip,separator11,main_title,sub_title,content,separator0,tw_link,fb_link,li_link,gp_link,in_link,vi_link,lf_link,vk_link,yt_link,de_link,pi_link,pt_link,wp_link,db_link,separator-effects,effects,css”]Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Maecenas faucibus mollis interdum. Curabitur blandit tempus porttitor. [/mvb_presentation_box][/mvb_our_team]


  1. Pie chart module – this module enables you to put a circular chart divided into sectors, illustrating numerical proportion.

[mvb_charts main_title=”” presentation_box=”” unique_id=”mvbtab_52319c748c703″ css=””][mvb_presentation_box main_title=”Amazing visual editor” sub_title=”and a small subtitle for typography” icon=”linecon-params” item_size=”normal” percent=”30″ chart_main=”” chart_bg=”” link_url=”#” page_id=”” sh_keys=”main_title,sub_title,icon,item_size,percent,separator,chart_main,chart_bg,separator2,link_url,page_id,content,separator-effects,effects,css”]Touch is fully responsive. And when we say responsive, we mean it won’t only work on mobile devices; it’ll look damn good too![/mvb_presentation_box][/mvb_charts]


  1. Tiles module – it enables you to create metro tiles in the theme.

[mvb_tiles main_title=”” tab=”” effects=”fadeIn” css=”padding-top-90″][mvb_tab image=”” tab_title=”Multilingual” color=”36bae2″ color_hover=”ff6565″ icon=”linecon-globe” link_url=”” page_id=”3365″ tile_content=”” sh_keys=”image,tab_title,color,color_hover,separator,icon,link_url,page_id,tile_content”][/mvb_tab][/mvb_tiles]


  1. Horizontal skills – this module adds skills diagram to your page

[mvb_horizontal_skills main_title=”Our skills” start_label=”Minimal skills” finish_label=”God mode” skill=””][mvb_skill skill_title=”Cooking” skill_subtitle=”we cooking really bad” skill_percent=”21″ skill_color=”left” skill_position=”top” sh_keys=”skill_title,skill_subtitle,skill_percent,skill_color,skill_position”][/mvb_skill][/mvb_horizontal_skills]


  1. Timeline – this module enables you to show some events in chronological order

[mvb_timeline main_title=”Our company timeline”][/mvb_timeline]


  1. Personal skills – this module serves to display personal skills diagram

[mvb_skills main_title=”My skills” image=”3793″ name=”Pearce Frye” client_job=”Interface Designer” description=”We are happy to represent you our new extraordinary, ultramodern, multifunctional theme Glider! It is really a joy to create a site with the theme, as it is so easy to use.” skill=”” effects=”0″ css=””][mvb_skill skill_title=”Design Sense” skill_percent=”74″ sh_keys=”skill_title,skill_percent”][/mvb_skill][/mvb_skills]


  1. Tabs module – you can put some information to tabs sections

[mvb_tabs main_title=”” heading=”h3″ heading_color=”1e2382″ tab=”” unique_id=”mvbtab_525fe0f5b7fd0″][mvb_tab tab_title=”Tab1″ tab_selected=”0″ sh_keys=”tab_title,tab_selected,content”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eget ante eget tortor malesuada ultricies placerat suscipit odio. Nulla aliquet, risus et placerat euismod, enim leo auctor justo, at ultrices nulla augue vel nunc. Duis odio lectus, convallis in convallis quis, euismod vitae mi.[/mvb_tab][/mvb_tabs]


  1. Vertical tabs – you can put some information to vertical tabs sections

[mvb_tabs_list main_title=”” tab=”” unique_id=”mvbtab_525fe075164b3″][mvb_tab tab_title=”” icon=”linecon-lightbulb” sh_keys=”tab_title,icon,separator,content”]Proin adipiscing cursus odio, nec vehicula diam iaculis quis. Nulla rutrum dapibus lorem ut ornare. Maecenas in libero sagittis, dapibus quam vel, bibendum mi. Ut dictum nunc sit amet auctor sagittis. Nam imperdiet mattis massa, a viverra purus condimentum cursus.[/mvb_tab][/mvb_tabs_list]


  1. Accordion module – you can put some information to accordion sections

[mvb_accordion main_title=”” accordion_panel=”” unique_id=”mvbacc_525fdb1ebd20c”][mvb_accordion_panel panel_title=”” icon=”linecon-cloud” sh_keys=”panel_title,icon,content”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eget ante eget tortor malesuada ultricies placerat suscipit odio. Nulla aliquet, risus et placerat euismod, enim leo auctor justo, at ultrices nulla augue vel nunc. Duis odio lectus, convallis in convallis quis, euismod vitae mi. Nulla non tortor erat. [/mvb_accordion_panel][mvb_accordion_panel panel_title=”” icon=”” sh_keys=”panel_title,icon,content”][/mvb_accordion_panel][/mvb_accordion]


  1. Google maps – with help of this module you can display google maps on your site

[mvb_gmaps main_title=”On the map” address=”Ukraine, Kiev” height=”282″ zoom=”14″ effects=”0″ css=”” unique_id=”mvbtab_520b741354005″]<p><strong>Development Park</strong></p><br class=”mvb_break”><p>Marbella Bussiness center Marbella, 12345, Spain</p><br class=”mvb_break”><p>Phone: +34 012 345 678<br /></p><br class=”mvb_break”><p> </p><br class=”mvb_break”><p><strong>Design Department</strong></p><br class=”mvb_break”><p>Artstudio Street 45 Marbella, 12345, Spain</p><br class=”mvb_break”><p>Phone: +34 012 345 678<br /></p>[/mvb_gmaps]


  1. Image module – you can put a single image to this module

[mvb_image image=”3582″ main_title=”About our company”][/mvb_image]


  1. Call to action – you can put some call to action text to this module

[mvb_call_to_action button_text=”Buy this theme” icon=”linecon-pencil” new_tab=”1″ link_url=”” page_id=”3365″ description=”COMRADES! WE MUST INCREASE THE EFFICIENCY AND QUALITY OF WORK IN EVERY WORKPLACE!” effects=””]Hey people! My name is Crumina and let me introduce my new Metro Theme – “Second touch”[/mvb_call_to_action]


  1. Client logos carousel – this module enables you to show logos of your clients/partners

[mvb_clients main_title=”Our clients” single_client=”” effects=”flipInX” css=”” new_tab=”1″ unique_id=”mvbacc_51ff9703f01e3″ description=”Droin facilisis varius nunc. Curabitur eros risus, ultrices et dui ut, luctus accumsan nibh. Fusce convallis sapien placerat tellus suscipit vehicula. Cras vitae diam ut justo elementum faucibus eget a diam. Etiam sodales a sem vitae fermentum. Lorem ipsum dolor sit amet, consectetur adipiscing elit.”][mvb_single_client image=”3569″ main_title=”Client1″ client_url=”#” sh_keys=”image,main_title,client_url”][/mvb_single_client][/mvb_clients]


  1. Presentation box – you can add any information to this module. It will be displayed with the square tile and text under it. You can choose color and icon displayed on tile.

[mvb_presentation_boxes main_title=””] [mvb_presentation_box image=”3562″ main_title=”Excellent Metro UI style” sub_title=”Great metro interface” color=”” icon=”linecon-sound” alignment=”1″ link_url=”#” page_id=”” read_more=”1″ read_more_text=”Read more” effects=”” disable_flip=”0″ sh_keys=”image,main_title,sub_title,separator,color,icon,alignment,separator1,link_url,page_id,content,read_more,read_more_text,separator-effects,effects,disable_flip,css”]The colorful and stylish metro UI interface will win your attention from the first sight.[/mvb_presentation_box] [/mvb_presentation_boxes]


  1. Presentation vertical – this module builds your presentation elements vertically on page.

[mvb_presentation_boxes_vertical main_title=”” presentation_box=”” effects=”fadeInLeft” css=”padding-top-53″][mvb_presentation_box image=”” main_title=”Excellent Metro UI style” sub_title=”EXCELLENT METRO UI STYLE” link_url=”#” page_id=”” icon=”moon-king” icon_color=”ff6565″ icon_hover_color=”36bae2″ icon_size=”75” sh_keys=”image,main_title,sub_title,separator1,link_url,page_id,separator,icon,separator01,icon_color,icon_hover_color,icon_size,content,css”]We are happy to represent you our new extraordinary, ultramodern, multifunctional theme Second Touch! It is really a joy to create a site with the theme![/mvb_presentation_box][/mvb_presentation_boxes_vertical]


  1. Presentation big icon – this module is represented by a big ion and some text under it.

[mvb_presentation_boxes_icon main_title=”Our features” presentation_box=””][mvb_presentation_box main_title=”Unbelievable options” sub_title=”Great possibilities” icon=”moon-pencil-3″ icon_color=”36bae2″ icon_hover_color=”ff6565″ icon_size=”80″ link_url=”#” page_id=”” read_more=”0″ read_more_text=”” sh_keys=”main_title,sub_title,separator,icon,separator01,icon_color,icon_hover_color,icon_size,separator00,link_url,page_id,content,read_more,read_more_text,separator-effects,effects,css”]Rich options provide flexibility in customizing each post type or a section of your layout.[/mvb_presentation_box][/mvb_presentation_boxes_icon]


  1. Presentation image – use this module to show some information with large images with title and subtitle on them

[mvb_presentation_boxes_img main_title=”Our greatest features”][mvb_presentation_box image=”3578″ main_title=”Amaziness” sub_title=”An incredible visual effect” color=”ffffff” link_url=”#” page_id=”” sh_keys=”image,main_title,sub_title,separator,color,link_url,page_id,separator1,content,separator-effects,effects,css”]Its multiple easy to use options and features allow you to build and organize your content the way you want it to be.[/mvb_presentation_box][/mvb_presentation_boxes_img]


Video modules

  1. Video module – to this module you can add video links.

[mvb_video main_title=”Sample video”][/mvb_video]

Crumina Page Slider

Crumina Page Slider Installation

After you have installed the theme and imported all integrated plugins, you can start creating your sliders using Crumina Page Slider plugin.

  1. Go to Page Slider section in your admin dashboard.

  2. Click ‘Add new‘ button.

  3. Type name of your slider into the field ‘Slider name‘. second-slider1

  1. Now you can start customizing your slider using the settings below.

All slider settings are divided into 4 sections:

  1. Basic settings

  2. Slider elements

  3. Select content

  4. Select colors

Let’s review all of them by turn.

Basic settings


There are 7 options in basic settings

1. Select slider template.

There are two templates available for slider –

 – 1 big and 4 small tiles (like in Second Touch theme that you can view under this link

 – 1 big and 2 small tiles (like a standard One Touch slider style ) second-slider3


  1. Choose sorting type of Posts/Pages. You can choose sorting type of your slider elements (date, post ID, slug, title and random order) second-slider4


  1. Choose order of Posts/Pages. You can choose ascending or descending order of your slider elements. second-slider5


  1. Number of posts slides. This option enables you to display so many slider you want. One slide is a number of posts that is currently visible in the content section of your page.

  2. Number of slides of other post types. This option has the same function as the previous one. But it determines slides of other post types, like portfolio and products.

  3. Number of pages slides. This option determines number of pages slides that will be displayed in slider. second-slider10


  1. Cache time. Set cache time for your slider elements for better slider performance. It is not recommended to leave this field empty or to put ‘0‘ value. second-slider11



Slider elements settings

With help of these settings you will be able to determine, what slider elements will be displayed in slider tiles.


Here are these options:

  1. Enable post/page title. If option is checked, title will be shown on your slider tiles. If the option is unchecked – title will not be shown.

  2. Enable post type icon. If option is checked, icon will be shown in front of the title.

  3. Enable post category. If option is checked, category box will be displayed in the upper left corner of the tile.

  4. Enable post description. If option is checked, short description will be displayed on the tile. If unchecked – it will be hidden.

  5. Limit description. You can decide how many words will be shown in tile description.

  6. Enable link to full page. If option is checked, slider elements will be clickable.

  7. Choose type of link to full page. You can choose if only the title of post is clickable or the entire box.

  8. Delay between cycles in seconds. This option allows you to activate auto-slide option for your slider. Simply add any value in seconds, and the slider will start scrolling autmatically.


  1. Start from the first slide. By default the slider is opened from the middle slide on page load. If you want to make it open the first slide, check this option.





Slider content settings

It is possible to display different post types in one slider – portfolio, posts, products and pages. Choose custom post types following description on the right from the post types list.




Select colors settings

These settings enable you to set colors for different slider elements.

  1. Set category and scrollbar color. This color will be the same for categories boxed and scrollbar of the slider.

  2. Set elements background color. This option determines background color of all tiles (if set in Second Touch style) and of even tiles (if set in One Touch style).

  3. Set odd elements background color. This option determines background color of odd tiles (only for slider set in One Touch style)

  4. Set opacity. You can set hover box opacity of all slider elements.





After all settings are cinfigured, click ‘Save changes‘ button and return to main slider page by clicking on ‘Back to the list‘.



Adding slider to page

  1. Create a page in section Pages>Add new.
  2. Give a title to your page.
  3. Copy the slider shortcode from “Page slider” section.second-slider13
  4. Paste the slider shortcode to the ‘Shortcode‘ module of Metro Visual Builder or to another content field, if Metro Visual Builder is not used on that page. second-slider14
  5. Select page template ‘Page for Metro Builder‘ (if your theme is One Touch) or “For page builder” (if your theme is SecondTouch) second-slider15 second-slider16
  6. If you want to make the slider fullwidth, add the following rules to Row settings>Additional CSS rules field: – max-width:100%;if your theme is Onetouch; second-slider17width:100%;if your theme is Secondtouch. second-slider18
  7. Save the page to view the slider on the frontend.



Widgets in SecondTouch

By default there is a number of sidebars available in the theme. They are:


  1. Left sidebar
  2. Right sidebar
  3. Footer column 1
  4. Footer column 2
  5. Footer column 3
  6. Sidebar for shop
  7. For Magazine layout
  8. For features pages


All of them you will find in Appearance>Widgets




To add widgets to the sidebars simply drag the widgets from the right side of the page and drop them to the sidebar field.




Custom sidebars

Custom sidebars are created with help of Easy Custom Sidebars plugin. It is a free plugin and is available in the WordPress  repository by this link.

Install and activate the plugin under Plugins>Add New.

Go to “Appearance>Theme sidebars” section and create a new custom sidebar



Start adding pages/other post types, on which standard sidebar will be replaced by your custom one.



In “Sidebar properties” section select which sidebar will be replaced by your custom one.



Click “Save sidebar”. After that go to “Appearance>Widgets” section and add widgets to your custom sidebar



Transformation of the tiled menu into a regular menu

If you want to have a regular menu without tiles in your Secondtouch theme, you must follow the next steps:

  1. Deactivate Crumina Menu Customizer plugin in your Plugins section.
  2. Customize your menu with custom CSS codes. Below you will find all required CSS codes. Insert all of your CSS codes into Options>Main options>Custom CSS field or in the style.css file of your child theme.

CSS codes for desktop view

.tiled-menu > > a:after {
 content: "";
 margin-left: 10px;
 display: inline-block;
 position: relative;
 top: -2px;
 width: 7px;
 height: 4px;
 background: url("../wp-content/themes/secondtouch/assets/img/drop-pipt-icon.gif") 0 bottom no-repeat;
}/*adds an arrow in front of the menu items that have submenus*/ {
 padding-top: 67px;
 min-height: 110px;
}/*decreases height of the menu menu container and space above the menu*/
#logo {
 padding-top: 40px;
}/*use this code if you need to lift your logo up*/
.tiled-menu .sub-menu li {
 text-align: left;
}/*aligns text in the submenus on left*/


CSS codes for responsive view

@media only screen and (max-width: 600px){
.tiled-menu > .menu-item {
float: none;
display: block;
width: 75% !important;
}/*aligns menu nicely in center of the screen*/ {
padding-top: 0;
margin-top: 10px;
}/*removes excess space above the menu*/
.tiled-menu {
text-align: left !important;
}/*aligns text on left on responsive view*/
.tiled-menu .sub-menu > li > ul {
left: 25%;
top: 100%;
}/*positions third-level menus nicely in responsive view*/

@media only screen and (max-width: 600px){
.tiled-menu > .menu-item {
background: #f2f2f2;
padding: 10px 15px;
margin: 0 auto 3px;
}/*Optional. It adds menu background color, paddings around the menu text and margin between menu items on responsive view*/


The above given codes are examples. You can play around with them by changing values with your custom ones and add your own CSS rules if needed.


Beginning with Secondtouch version 1.9. you may customize typography within Options panel.

Go to Options>Typography section and configure settings for headings and body fonts.


Layout settings

General layout settings can be adjusted in Options>Layouts settings.



With these options you can adjust layout settings for each page type and they will be applied by default, if you won’t select custom layouts for one or another page.


If you want to select a custom layout for a particular page, you can do this in the section ‘Page Attributes’ by selecting page template from the list



If you select any page template, which is supposed to have a sidebar or two sidebars, there will be applied either the default sidebars, which you have in Appearance>Widgets or custom sidebars, if you select in the section ‘Select custom sidebar’, generation of which is described in detail in the documentation section ‘Custom sidebars’.



And now more detailed about ‘blog with user layout selection’ page template.


If you select this page template and click ‘publish'(‘update’), there appears section ‘Select blog parameters’ on page.



If you select blog page layout ‘default’, the settings adjusted in options>layouts settings>archive pages layout will be applied for this page. The other blog page layouts are the custom ones, which you can apply for any blog page you need.


There are also options to select one or several categories to be displayed on your blog page.


Simply check ‘Display posts of certain category’ and check one or several categories.

In the field ‘Number of posts to display’ put number of posts, which will be displayed on one page.

The same principle is applicable for portfolio templates.



Icon manager

Apart from icons available in the theme by default, you can use your own icon packs.

Go to “Appearance>Icon Manager” section. Click “Upload new icons” button and upload your icon packs.


Generate custom icon font

Additional icon packs can be generate from your svg files by using Icomoon service.

You can select free icons suggested in the app.




Or import your custom icon pack to IcoMoon service. The imported icons must be in SVG format.




Under Preferences enter name of your custom icon pack and class prefix. They must be the same.

Under CSS Selector choose ‘Use attribute selectors’ option.


When you are done, download your icon pack .


IMPORTANT NOTE: Multi-colored icons can’t be converted to icon font. Your icons must be one-colored.


Upload your icon pack via Appearance>Icon Manager and wait until the page is refreshed automatically. The icon pack will appear in Icon Manager section.






Theme localization

There is a list of words and phrases in the theme that can be translated into different languages.

You can translate them in two ways:

  • WPML String Translation – this is a paid plugin with its own documentation

  • Loco Translate – if you don’t like editing PO files, this plugin is a good alternative for translating through admin dashboard

  • POedit software – free translation editor.

All Crumina themes are fully translated into two languages – Russian and German. Translation files for Russian and German and default translation file are located in:

  • “lang” folder (Secondtouch, Maestro, Glider)

  • “translation” folder (Onetouch, Atlantis, Embrace)


How to translate with POedit into a different language?

  1. Install POedit on your computer .

  2. Open crum.pot or default.po file in it (depending on the theme you are using).


  1. Begin translating strings into your language.


  1. When all strings are translated, save the file in .PO format. Example: nl_NL.po, fr_FR.po, he_IL.po etc.


  1. After the .PO file is saved, a .MO file is generated automatically.


  1. Upload both files , .PO and .MO, via your FTP client to translation/lang folder. Translation will be applied automatically, if you have installed WordPress in corresponding language.

Contact page

Contacts page is created using page template ‘Contacts page’.



After the template is selected, click ‘publish’.


By default you get google map and contact form on your contacts page.


It is possible to put additional text to the field ‘Additional text fields’,



which will be displayed in the blue box on the google map.



If needed, you can add some blocks from Metro Visual Builder to your contact page. They will be placed to the left of the contact form.




Additional settings for the contacts page can be adjusted in Options>Contact page options.



It is also possible to create contacts page only by means of Metro Visual Builder, without setting ‘contacts page’ template as a basis.



How to change number of items per row on shop page

Open woocommerce/content-products.php file.

Go down to line 22, that looks like this $woocommerce_loop[‘columns’] = apply_filters(‘loop_shop_columns’, 3);

And change number ‘3‘ to, for example ‘4‘, or any other number.

It is recommended to upload the modified file to the child theme in order to keep changes after the updating to the next version of the theme.

After you have saved the file in the child theme, add this CSS code to Options>Mian Options>Custom CSS section.

.prod-image-wrap { height: auto; }

Display post title instead of the icon in small tiles of Crumina Page Slider

You have to edit templates/template-1b-4s.php file on line 214. Find:

<a href=”<?php the_permalink(); ?>” class=”link”> </a>

and replace it with this line

<a href="<?php the_permalink(); ?>" class="link"><?php the_title(); ?></a>

After that you have to style your titles to make them correspond theme style.

Add the CSS codes below to Options>Main Options>Custom CSS (or to Options>Advanced Options>Custom CSS in Onetouch theme)

.crum-slider .small-element .entry-thumb a. {
  font-size: 20px;
  color: rgb(103,163,0);
  padding: 25% 7px 0 7px;
  line-height: 25px;
  .crumina-slider-wrap .entry-thumb > {
  content: none;

You can change values to any other you need

How to add comments to page

This method works for all Crumina themes.

1. Find the needed template file where you want to add comments.

To ensure the file you edit is correct, compare the name of the template in Page Atributes box of the edit page with Template name in the top part of the template file.



2. Insert the following code after tag </section>

<div class="row">
<?php global $withcomments;
$withcomments = 1;
comments_template( '/templates/comments.php' );?>
3. Save template.
Suggest Edit