Glider theme installation
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.
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.
Theme installation with full demo data
In order to get the theme with full demo data on your site, it is required to install the theme with help of Duplicator plugin.
Before starting installation, make sure that the database of this domain is separate and there is no any important information on it, because Duplicator will clear its database after you perform installation.
When you are ready to start installing the theme, please, perform the next steps:
- Download theme package from the ‘Downloads‘ section of your Themeforest account.
- Unzip it and find ‘DemoDuplicator_files‘ and ‘DemoDuplicator_installer‘ files there. Click over them to download to your computer.
- After you downloaded installer.php file and the theme zip archive to your computer, upload them to the root location of your domain.
- Enter your site link in the browser input line as follows your-site-name.com/installer.php
- There appears Duplicator Installer window, where you have to enter the following information: – hostname; – name of your database; – username of your database; – password of your database; – and switch to Connect and Remove All Data radio button.
- After you entered all needed information, click on the Test Connection button to check if everything is correct. If you see Success, you can proceed installation. If you see Fail, you need to double check the above entered data.
- After you set up connection, check ‘I have read all warnings & notices‘ message and press Run Deployment button.
- Confirm the action.
- The process has started and you see such window with running progress bar.
- When the process stopped, click on the Run Update button.
- When the update process is finished, click on the Test site button.
- Now you can log in your with the following credentials: – username – admin – password – 1234567890
- The theme is installed and now you need delete installer files. You can do this from the Duplicator-Installer window or directly from your admin dashboard.
Getting theme updates
There are two ways to update the theme to its latest version:
In order to update the theme manually, you need to perform the following steps:
- Log in your Themeforest account;
- Go to ‘Downloads‘ section;
- Click on the button in from of the theme name;
- Select “Installable WordPress file only” option from the dropdown menu and download the zip archive.
- Unzip ‘glider.zip‘ archive and upload folder ‘glider‘ via FTP to ‘wp-content/themes‘ directory replacing the old files.
- 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 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:
- Go to Updates section and perform an update from there.
- 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.
Page Builder by SiteOrigin plugin is used as the main page building tool in the theme. There are about 50 modules, that you can use to create any layout you need.
To get started create a page over Pages>Add New section. Enter the title of the page and switch to ‘Page Builder‘ tab.
Start adding widgets by clicking on the ‘Add Widget‘ button.
In order to add a new row click on the ‘Add Row‘ button and configure row settings such as number of columns and width of the columns.
Once you added widgets to the rows, you can configure advanced row settings by hovering over the Tool icon on the right side of the row and clicking on the ‘Edit row‘ button. In the popped up window open those three tabs that are located on the right column of the window with ‘Row styles‘ title.
The settings you can adjust are the following:
- Attributes tab: – Row Class – you can add extra class name for the row; – Cell Class – you can add extra class name for the cell; – CSS Styles – you can add your custom CSS rules that will apply only to that particular row.
- Layout tab: – Bottom Margin – you can specify how much empty space will be under the row; – Gutter – if there are several columns in the row, you can add some space bwtween them; – Padding – you can also specify the inner space around the entire row; – Row layout – you can keep standard width of the row or make it full-width or full-width stretched.
- Design tab: – Background color – you can fill your row background with some noce color; – Background image – or you can add an image to the row background; – Background Image Display – if you set a background image, you can select style of it with this option; – Border color – if needed select a border color for the row.
If you want to delete some row, hover over the Tool icon on the right side of the row and click on the ‘Delete row‘ button.
After you added all page elements save the page. That’s it! 🙂
You can create testimonials in the section “Testimonials” in admin panel.
In the editing page you are able to type text of the testimonial, put information about author in fields
“Author of testimonial”, “Author additional” and set features image (e.g. photo of the author)
When you have created a number of testimonials you can put them to your page via Page Builder using the “Theme: Testimonial display” widget
In the editing window, you will see a number of settings
When you have set up your testimonials, click “Done”.
You can create Clients/ Partners items in the section Clients/ Partners in the admin panel.
Click “Add new”, add some text, if needed in the text field, and set featured image.
When you have made several Clients/ Partners items, you can put them on your page via Page Builder, using “Box: Partners/ Clients list” widget.
In the editing window, adjust settings for the widget and click “Done”.
You can add your features in the section “Features blocks” in your admin panel. Simply click “Add new”. In the editing page you can type text of the feature and in the section “Feature box options” you can select any icon you want, which will be displayed nearby.
When you have created a number of features, you can put them to your page via Page Builder, using “Box: Features” widget.
In the editing window, you will be able to set up features settings, like title, link to full page, order of display, number of columns etc.
When you have finished customizing your features, click “Done”.
To create Price Tables go to the section Price Tables>Add new.
In the editing page, create so many columns you need, by clicking on “add column”, and fill in all the required fields in each column.
In the block “Shortcode” on the right side of the editing page, copy shortcode of the Price Table and insert it to the “Theme: Do Shortcode” widget in Page Builder.
On the pages you create, you often use sidebars. To put some widgets to them, you have to go to the section Appearance>Widgets. On the left side of the page, there are all available widgets, which you can put to your sidebars. On the right side, there are all sidebars, including custom sidebars, which you have previously created in the section “Sidebars”.
Simply click on any widget, holding it, and drag to the sidebar.
Adjust settings for this widget and click “Save”
You can put several widgets to one widget.
To create a new Crumina slider, go to Crumina Slider section>Add new section.
Enter title of your new slider and configure settings given below:
- First of all select sorting type of the slider elements in Choose Sorting of Posts/Pages dropdown.
- In Number of Posts/Pages dropdown you can select number of items that will be visible in one slide. For example, if you choose 4, there will appear 4 elements in the slide.
- In order to add elements to the slider, select them in Slider Items from Posts/Pages window by holding SHIFT button and clicking on the needed items with the mouse.
- Next step is to choose Order of posts/pages – ascending or descending.
- Limit description(number if chars) option allows you to set the number of symbols, that will be displayed in the description popup window. Please, note, if your post or page is created with Page Builder or Visual Composer plugins, description won’t be shown in the slider. To make it appear, you need to add a custom excerpt to such posts/pages.
- More Separator option allows you to add a custom separator in the end of the description. It can be ellipsis or ‘Read More‘ text etc.
- From the Set Slider Effect option you can select the way the slides will be replacing each other.
- Set Slider Timeout option enables you to set the speed of animation.
- Auto slider speed(ms) option determines the pause between slides change.
- Background color – you can set the background color of the description window.
- Opacity – select opacity of the description window.
- Button color/active button color – you can select the color of the scroll bar.
- Date – if checked, date will be shown above the title of the post/page.
When you’ve finished configuring your slider, click on the Save Changes button. The slider obtains its shortcode, that can be further added either to the text field in classic editor, or to the Text block in Visual Composer, or to the Theme:Do shortcode widget in Page Builder, depending on which tool you use to create a page.
To create a video post, go to Posts>Add new tab. Give title to your post and check ‘Video‘ post format in ‘Format‘ section of the page.
After that scroll a little bit down to ‘Post Video‘ section. There you can add:
- Youtube video link;
- Vimeo video link;
- Self hosted video file in mp4 format;
- Self hosted video file in webM format.
Once done, add a featured image to your post, assign it to some categories and tags and click on ‘Publish/Update‘ button.
Simple WP gallery
Create a post from Posts>Add new section.
Click Add media>Create Gallery>upload images from your computer location or select images from Media library.
When you have selected the needed number of images, click on Create a new gallery button. In the appeared window, select needed parameters in Gallery settings column. After that click on Insert gallery button.
Portfolio slider gallery
Create a portfolio item in Portfolio>Add new section. On the right side of the edit page you will see Images gallery section.
Click on Add gallery images button and select images from the Media Library, by holding CTRL button.
After that go to Options>Portfolio options>Portfolio image display and select ‘Slider‘ option.
Typography of the theme can be configured with Google Fonts WordPress plugin, that comes bundled with the theme. First of all. make sure that you installed it and activated while installing the theme. If not, you can always do this in Appearance>Install Plugins section of your admin dashboards.
Once it is done, go to Appearance>Fonts to create a new font rule.
Click on ‘New font rule‘ button to open editing window.
Type selectors of the text elements in ‘Enter selector here‘ field, like body, div, p, h1, h2, h3 etc.
If you want to give one font rule to several elements, you have to enter selectors separated by commas
You can set up font family, font style, font size, color and other parameters with given options. All of them will be displayed in the large text field on the right side.
After you have finished customizing your font rule, click on ‘Save all changes‘ button.
Here is the list of the most used selectors:
#top-menu .link-text – for menu items text
h1, h2, h3, h4, h5, h6 – for all levels of headings
body, div, p – for the whole body, paragraphs and block elements
.top-text .subtitle – for subtitle in the top panel
.top-text .title – for title in the top panel
.top-text – for text in the top panel
You can create your contacts page in two ways:
- Using the page template Contacts page. Go to Pages>Add new section, give title to your page and select page template Contacts page in Page attributes box. Click on Publish button.
In the bottom of the editing page, there appears ‘Additional text fields‘ section. You can type your corporate address and any other information there. Click on Update button to save changes.
The additional settings like:
- custom contact form
- Googel map(on/off)
- Google map address
- height of Google map
- email address of the recipient…
you can regulate in Options>Contact page options section.
If you want to have team member blocks on your contact page, like shown on the screenshot below, you need to do the following:
Create a page, select Contacts page as a parent page, and select page template Team member page in Page attributes section.
In the ‘Boxed page background options‘ section, you can type member profession and a short description, that will be displayed in the team block on the contacts page.
- Using Page Builder widgets
If you want your contact page look differently from that one in the demo, you can create it in Page Builder, using such widgets like:
– ‘Cr: Text Block’ for any additional information. This widget supports all HTML tags.
– ‘Theme: do shortcode’ for your custom contact form shortcode.
– ‘Box: Google map’ if you want a map be displayed on your contact page.
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>
<?php global $withcomments;
$withcomments = 1;
comments_template( '/templates/comments.php' );?>
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 http://wpml.org/
Loco Translate – if you don’t like editing PO files, this plugin is a good alternative for translating through admin dashboard https://wordpress.org/plugins/loco-translate/
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?
Install POedit on your computer http://poedit.net/ .
Open crum.pot or default.po file in it (depending on the theme you are using).
- Begin translating strings into your language.
- When all strings are translated, save the file in .PO format. Example: nl_NL.po, fr_FR.po, he_IL.po etc.
- After the .PO file is saved, a .MO file is generated automatically.
- 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.