Croma

Contents

1. How to increase the size of my logo ?

2. How to make a parallax effect with Visual Composer?

3. Responsive Website using Revolution Slider

4. How to add a link in the menu that scrolls to a page section (Anchor)

5. My site reverted back to default ! I lost all my customization.

6. There are codes showing up on my page ? My site is broken! What's wrong ?

7. How do I update the plugins ?

8. How to get my Twitter API Keys ?

9. How to Add Custom Font and Typography

10. I can't choose the slug or page name such as /music /videos /event

11. How to change the background color

12. Where can I change my logo ?

13. How I change hard-coded texts?

14. How to setup the Event Section ?

15. How to translate the theme in your own language ?

16. Recommended image size (resolution)

17. When installing the theme it says "Are you sure you want to do this ?"

18. How to activate the child theme ?

19. When I post a my website link onto a social media as Facebook, the site preview displays unwanted text.

20. How do I update my theme ?

21. How the back-end of your themes look like ?

22. How to embed a SoundCloud Player into my pages ?

23. I can't see the Slider Revolution when I move from one page to another.

24. What is Visual Composer and how to use it ?

25. How to import demos

26. How to setup playlist section or add MP3 and audio files

27. I can't activate a plugin. Where is the license key ? Is it included with your theme ?

1. How to increase the size of my logo ?

Increasing the size of the logo can be done by simple custom CSS. Although providing any assistance for customized/extensive design or script coding is outside our item support, we can help you out with the CSS code because this is just a simple tweak. Kindly copy the CSS code below to your Custom CSS section in your theme options).

/*Increase the size of the logo*/
/*classic menu*/
.classic-menu > ul > li.logo {
overflow: initial;
max-width: calc(100% - 100px);
}
/*push menu*/
.logo-desktop{
max-width: calc(100% - 100px);
max-height: 500px;
}

2. How to make a parallax effect with Visual Composer?

1. Click on the "Edit row" icon where you want your background image appear.


2. Activate the parallax option. 


3. Select the "Design Options" tab.


4. Insert a background image.

5. Then create a row INTO this parent's row.

6. Add your content into it. The parallax will be applied in the parent's row and the child row will have the parallax effect.

3. Responsive Website using Revolution Slider

Sometimes, your texts and images do not behave exactly how you'd like.

99% of the case, its because you havent checked or noticed the settings for the responsive settings in Revolution Slider.


First, make sure its enabled by going to Slider Settings > and enable "Custom Grid Size" buttons on the devices you want to have control on. See screenshot: http://d.pr/i/vJstcF

Once its enabled, edit your slide and you will new sets of device icons show up in your screen. See screenshot: http://d.pr/i/EI6JsE


Now check the video below for a full tutorial:

4. How to add a link in the menu that scrolls to a page section (Anchor)

First you need to create an anchor that will be the "target".

With Visual Composer, it's very easy to create an anchor.

1. Click the "pen" icon of the row element you want the anchor:

2. Fill the 'ID Name for Navigation' field with the name of the anchor you want. (Eg: about, music or contact). Do not use space or special characters.

3. Add a new menu item in your menu: Go to WP-Admin > Appearance > Menus.

4. Create a new 'Custom Links'. In the 'url' field, add "/#" and your Anchor ID you previously set. So if your anchor is about, the url will be /#about

* If you need to point to an anchor which is on another page than your homepage, then you need to add the slug name in the url. Eg: /bio/#about

5. My site reverted back to default ! I lost all my customization.

Make sure that all the plugins are activated, in particular: WPBakery Page Builder (Formerly known as Visual Composer) and the theme's plugin (eg: Croma-Music or Iron-Music or SoundRise-Music, etc..)

6. There are codes showing up on my page ? My site is broken! What's wrong ?

Make sure that all the plugins are activated, in particular: WPBakery Page Builder (Formerly known as Visual Composer) and the theme's plugin (eg: Croma-Music or Iron-Music or SoundRise-Music, etc..)

7. How do I update the plugins ?

We use 3 premium plugins packaged with our theme. When there is a new plugin version available, we (as a theme author), needs to check, test and make sure that new version is fully functional with our theme. Once tested, we release a theme update which includes the new version of the plugins. So it can haves a delay between the time a plugin version is released by the third party author and our theme updates.

To check which plugin version is available from our theme,  check our theme's change log.

SoudRise Changelog

Croma Changelog

FWRD Changelog

Lush Changelog

How to update a plugin.

Make sure that your theme is up-to-date

1. Slider Revolution

To update Slider Revolution, go to WP-Admin > Plugins > Delete the plugin then go to Appearance > Install Plugins > and re-install the plugin. You won't loose anything.

2. WPBakery Page Builder (Formerly knowns as Visual Composer)

To update WPBakery Page Builder (Formerly knowns as Visual Composer), go to WP-Admin > Plugins > Delete the plugin then go to Appearance > Install Plugins > and re-install the plugin. You won't loose anything.

3. Essential Grid

Please BACKUP your grid before updating the plugin -- To update Essential Grid, make a backup of your grids first: Go to WP-Admin > Ess. Grid > Import/Export. Click Export then click Export Selected. Save the .json file on your computer. Then go to WP-Admin > plugins > and delete Essential Grid. Now go to WP-Admin > Appearance > Install Plugins and install Essential Grid again. Once its activated, go to WP-Admin > Ess. Grid > Import/Export. Click Import and Import the .json file you previously exported. then click the green READ FILE button.

4. Iron-Music, Croma-Music or SoundRise-Music

To update these plugins go to WP-Admin > Plugins > Delete the plugin then go to Appearance > Install Plugins > and re-install the plugin. You won't loose anything.


*If you want to update the plugins manually, the plugins can be found in wp-content/themes/[your-theme-name]/includes/plugins/

8. How to get my Twitter API Keys ?

In order to use a Twitter feed on your website, you need to tell Twitter that you are the owner of account used. To do this, you need to create a Twitter Application.



Here's the steps



Creating a Twitter Application

The Twitter Widget will never ask for your password, as it gets all your required data from the Open Authentication keys and secrets you will get by creating your application at Twitter. It also means that if you change your twitter password, you won’t need to update any of the details of your Widget.

  1. Go to https://apps.twitter.com/ and sign in.
  2. Click "Create New App."
  3. Enter a unique Name (anything you want), a Description (again this is just for you), and your site's URL. You can leave the Callback URL empty as it is not used for this implementation. Yay, success - OK! 
  4. Click the "Keys and Access Tokens" tab.
  5. Click the button "Create my access tokens". See screenshot: http://d.pr/i/17Uhs
  6. Now you should see all the keys that are required. See screenshot: http://d.pr/i/1go15
  7. Good. Now go to your WordPress Dashboard and go to the theme options. Click the Social Media tab. 
  8. You can just copy the required information into the exact corresponding inputs fields of the theme options. See screenshot: http://d.pr/i/1fH4x

9. How to Add Custom Font and Typography

1) Paste this code into Custom CSS field. This will tell your theme to load a custom font.

@font-face {
    font-family: 'MyWebFont';
    src: url('http://yoursite.com/fonts/webfont.eot'); / IE9 Compat Modes /
    src: url('http://yoursite.com/fonts/webfont.eot?#iefix') format('embedded-opentype'), / IE6-IE8 /
    url('http://yoursite.com/fonts/webfont.woff2') format('woff2'), / Super Modern Browsers /
    url('http://yoursite.com/fonts/webfont.woff') format('woff'), / Pretty Modern Browsers /
    url('http://yoursite.com/fonts/webfont.ttf') format('truetype'), / Safari, Android, iOS /
    url('http://yoursite.com/fonts/webfont.svg#svgFontName') format('svg'); / Legacy iOS / }

Just put absolute paths to your font files. Note that you need to have different file formats since some browser will use only certain file type as explained here https://css-tricks.com/snippets/css/using-font-face/

2) Then use this CSS code by placing it inside Custom CSS field as well for the specific css class you want to use the font:

body, h1{font-family: 'MyWebFont', sans-serif;}

The exemple above will use the custom font called "MyWebFont" for the Body and H1 class.


Another option is use the plugin called:  "Use Any Font". Some customers have recommended it but we didn't tested it.

10. I can't choose the slug or page name such as /music /videos /event

You have created a page and the slug name doesn't match the page name. It has an undesirable "-2" which is added. You are trying to remove it but you can't.

Most often, the reason is that your permalink is already in use.

Check the permalinks of your pages and beware that the permalink might be already used by a page in the trash. Make sure to check in your trash section of your pages/posts. 


Another case that it wont work is because you are trying to use a slug name that is dedicated as a parent of a post type. Permalinks: "/discograhy", "/event", "/videos" are dedicated.  You cannot use them.

So if you have created a page called "videos", the default permalink will be "/videos-2". You can't use "videos". You can use other slug name as: "v-deos", "video" or "-videos-" Or you can also make your page a child page, so the permalink will change. (ex: "/medias/videos")

11. How to change the background color

Our theme has many ways to change background images or colors.

Changing the overall background:

To change the overall background image or color go to the Theme options dashboard > Look and Feel. You can set the overall background there by either uploading a background image, or only change the background color.

 

 

Changing a background on a specific page:

 We can also select an individual background on a specific page. When we edit a page, we can select a background in the 'page setting' panel. 

  1. Upload your image in the "Background Image" or change the main background color.
  2. If you want to use a background image, make sure to set a main background color as well. It's very important. Also make sure that the 'Main Background Transparency' has the value to 0.

  

 

Changing a background on a specific row in a page:

So you want to change a background image to put your own image. Let say you want to change this image which is part of the homepage only:

Edit your page. then seek for the row where your background image should be contained. Click the little pen in the top right corner of the row, then click design tab. See screencast:

If you want to edit the height of the image, basically you will have to edit the height of the row's space. So click the little pen of the row to edit it. go to the design tab, and adjust the top and bottom padding according to your needs.

More infos and hows-to about Visual Composer here.

12. Where can I change my logo ?

To change the logo, go to the Theme options dashboard > Logos. 

It is important to upload a standard logo and a retina logo for retina device. The retina logo should be 2x larger than the standard logo and it's only used on devices that support retina displays.

Our theme has the option to select a different logo on a specific page. That's useful when we wish to have a dark background and our logo by default is dark. To select a logo for a specific page, please edit a page and look in the page settings.


Logo when you scroll down a page:

(If you use the classic-menu only)

For the "Mini" logo that shows up when you scroll down the page, go to the Theme options dashboard > Menu Option. 

Select "Mini" or "Mini + Full Width" 

And upload a logo in the "Header Logo On Mini" option.

Logo inside the push menu:

If you use the push menu, there is a logo inside it. Go to the Theme options dashboard > Menu Options. 

13. How I change hard-coded texts?

Some texts in our theme are hard-coded, like back and next buttons or labels days, hours, minutes from the countdown. You can't find an option to edit them on the wp-admin dashboard.

So how we can customize them without modifying our theme? The solution is simple. We need to translate string from our theme.

Exemple. you want to translate  "No upcoming events scheduled yet. Stay tuned!" to "We are in vacation for two years", we need to make a english translation.  How to do it?

*** In this tutorial, i use often "[your theme name]". Its intended to be replace by your own theme name eg(fwrd, lush, croma, soundrise, etc..)

1. Download and Install PoEdit software: https://poedit.net/

2. Open Poedit and open file /wp-content/themes/[your theme name]/languages/[your theme name].pot.

3. Click on edit and find, and search for the string you want to modify. 

4. If you don't find the string, please open a /wp-content/plugins/[your theme name]-music/languages/[your theme-name]-music.pot and repeat step 3. 

5. When you have find in which file is located the string please click on create new translation.

6. Select the same language selected in your wordpress. 

If you are not sure which language is set to your wordpress, please go to wp-admin>setting>general.

7. Find your string again and fill the translation field with your new string.

8. Click on save and save your files in /wp-content/languages/themes.

* If the modification is from our plugin, you need to save file in /wp-content/languages/plugins and the file name should start with "[your theme name]-music-en_US". Exemple: "croma-music-en_US.po". 

When we save the po file, a .mo file will be automatically generate. The mo file is the file read by wordpress.  

14. How to setup the Event Section ?

Add a new Event:

  1. Go to WP-Admin > Events > Add New
  2. Enter the title of your event, and an optional descriptions.
  3. Make sure to set your Event poster or image as the featured image: http://d.pr/i/f3kl
  4. Fill the textfields in the "Event infos" section under Event description with your own content. 
  5. The date of your event will be the published post date. See screenshot: http://d.pr/i/7Td3h8

Add a list of events to a page:

  1. Go to WP-Admin > Pages and edit the page of your choice (ex: Homepage)
  2. Make sure you are using the Backend editor mode: http://d.pr/i/7fOA
  3. Add a new Row
  4. In this row, add an Event widget: http://d.pr/i/16Ffv
  5. In the Event setting panel choose filter by upcoming or past events. All other fields are optionals: http://d.pr/i/1hhp8

Create a page to show all your events:

  1. Go to WP-Admin > Pages > Add New
  2. Enter the title of your page.
  3. Select the template "Event Posts" in the "Page Attributes" section: http://d.pr/i/bi9a
  4. In the "Events Query" section choose filter by upcoming or past events: http://d.pr/i/19UW2
  5. Save it.

15. How to translate the theme in your own language ?

Translate in your own language

  1. Download and Install PoEdit software: https://poedit.net/
  2. Unzip the theme file you have downloaded from ThemeForest.
  3. In the folder /Theme/ you will see the theme .zip file. Unzip it as well.
  4. Open Poedit and click on File -> New from POT/Po file in the main menu and select the POT file in your theme’s languages folder. The .POT file should be located in your /Theme/theme_name_folder/languages/
  5. A properties box will open up. Select the language name you want to translate to.
  6. Now you can start translating the theme via the String Translation mechanism. This provides direct like-for-like translations. Go through each line one-by-one, adding the translation to your native language as you go. If you think there’s some text that won’t require translation or you’re not sure what to translate it to you can just leave them as they are in the original language; you can always come back and translate them later if need be. You can translate only portion of it. You don't have to translate everything. Remember that strings that you have not translated will appear in english in your site. The string you have translated will shows the corresponding translations.
  7. Go to File -> Save. You’ll be asked to what filename you want to save your .po file. Each language and country has a specific code you will need to use when saving translation files; for instance, if you’re going to translate into Spanish you’ll name your file “themename-es_ES.po”, whereas if you’re translating into German you’ll name the file “themename-de_DE.po”, french from France will be "themename-fr_FR.po", french from Canada will be "themename-fr_CA.po". To break it down; the first lower-case letters define the language, whereas the second upper-case letter define the country. In many cases the language and country will be the same, hence “de_DE” for Germany, but what about languages like English or Portuguese, that are spoken in several countries natively? In these cases there will be a difference in the first and second letter pairs; for the UK, the code would be en_GB, whereas for the USA it will be en_US. If you’re not familiar with the codes for your native language and country you can head over to the GNU website, where they have all the codes for Language and Country. Remember, if you use the wrong naming convention WordPress won’t be able to use your translation, so double-check if necessary.
  8. Save your new language file in the wp-content/languages/themes/theme_name-fr_CA.mo . In this case, we are translating a theme called SoundRise in French-Canada. The filename will be soundrise-fr_CA.mo . See screenshot: http://d.pr/i/iVUn
  9. Some strings is located in the plugin "soundrise-music". You need to repeat steps 4 to 8 as you did for the theme. The pot file in the plugins/plugin_name/languages folder, and you will save the mo file in the wp-content/languages/plugins/plugin_name-fr_CA.mo

Setup Wordpress to read your translation

OPTION 1. IF YOU ARE USING 2 LANGUAGES ON YOUR SITE:

  1. Make sure the language value you are translating is set in your translation WordPress plugin. In this case, we are using WPML plugin/
  2. - Go to WP-admin > WPML > Language. Add/Edit the language you want to translate (http://d.pr/i/ssZZjo) and click "Edit languages"
  3. - Make sure that the default locale is corresponding to your .mo file you previously saved. In this case, it will be fr_CA since my .mo file has been named: soundrise-fr_CA.mo (where soundrise is the name of my theme and fr_CA is my default locale, separated by a dash) See screenshot: http://d.pr/i/wNxvu7

You are done !

OPTION 2: IF YOU ARE USING ONLY 1 LANGUAGE ON YOUR SITE

You’ll need to make sure your wp-config.php file settings match your language files. Edit the file wp-config.php which is located in your root folder (See screenshot: http://d.pr/i/1fQmH) You’ll need to open the wp-config.php file and set your language accordingly, like this:

 


/** * WordPress Localized Language, defaults to English.  *  * Change this to localize WordPress. A corresponding MO file for the chosen  * language must be installed to wp-content/languages. For example, install  * es_ES.mo to wp-content/languages and set WPLANG to 'es-ES' to enable Spanish  * language support.  */ define('WPLANG', 'fr-CA');

 

 

Share your language files with others

If you’ve already translated a theme then many of our users would be delighted if you could share your translation files with the community. Just get in contact with us via our Helpdesk ticket system and we will include the translation files in the next theme update if possible.

 

Translation tips: Character Encoding

If you’re used to working in HTML or through the WordPress editors then there are a few areas which might catch you out when creating the translations; here’s a few tips to help you get things done: First of all, any localizations should use UTF-8 encoding. This is one of the reasons we recommend Poedit; this kind of seemingly minor issue is already accounted for in a dedicated program. If you were to edit the files via a standard, simple editor like notepad, then the default settings will usually use different encoding. You won’t actually notice this when working on the file, but once you save it you’ll notice that all your translated elements are displaying the identifying string rather than the original or new language. You can just open and resave the file with the proper encoding, but using a dedicated program will prevent this happening in the first place, so it’s probably the safer solution! When writing your translations you should write your translations plainly; that is, avoid escaping accented and special characters with HTML character entities, save for a select group that are expected to be escaped to avoid conflict with XHTML markup: angle brackets (< & >), and ampersands (&). In addition, there are a few other characters that function better when escaped, such as non-breaking spaces ( ), angle quotes (« and »), curly apostrophes (’) and curly quotes. When we create multilingual sites, we need to remember that translation is not everything; localization goes beyond just translating words and expands to include adapting the site to a different language, country and conventions. Some words simply don’t mean the same thing or carry the same implications as other languages, so don’t translate literally; translate organically; try to get a feel for the meaning behind the original text, and capture that spirit in your translation.

16. Recommended image size (resolution)

Here our image recommendation for a best result with our theme. 

For general backgrounds


 For the Blog "Featured images": 


For the Event "Featured images": 


For the Album "Featured images": 


For the Gallery images: 

17. When installing the theme it says "Are you sure you want to do this ?"

There is 2 different causes for this issue.

If you are installing your theme from the WordPress theme dashboard, but get a message that says “Are you sure you want to do this?”, most likely your web server is configured with PHP settings that are too low to allow the theme ZIP file to upload. Specifically, PHP is configured to a maximum file upload size limit at 8 megabytes or less. The theme ZIP is currently about 34 mb. Thus, the web server is rejecting the upload. WordPress is giving you a rather ambiguous message in response.

This is not a theme fault or bug.

SOLUTION 1) You can either increase your PHP limits. Since every servers are configured differently, there is 3 ways to do this. You can try to do it yourself but if you don't have the skill, just ask your web host and they usually will do it for you.

To raise the PHP limits, try one of the 3 solutions below:

a) Add this in the .htaccess file of your server php_value memory_limit 128M php_value post_max_size 128M php_value upload_max_filesize 128M php_value max_execution_time 1800

b) Add this to wp-config.php

define(‘WP_MEMORY_LIMIT’, ’64M’); c) Create a text file and name it php.ini then upload php.ini file in your root folder by FTP. In the php.ini file, add: upload_max_filesize = 64M post_max_size = 64M

--- 

If it still doesn't work, you can ask your web host to raise the upload and memory limit (Just tell them you are trying to upload a wordpress theme file that is around 35mb) OR jump to SOLUTION 2 below:

SOLUTION 2) You can upload your theme via an FTP client. Please read this article for more info: http://codex.wordpress.org/Using_Themes#Adding_New_Themes_Manually_.28FTP.29

----- 

Recommended PHP configuration limits are as follows:

max_execution_time 600

memory_limit 256M

post_max_size 64M

upload_max_filesize 64M

You can verify your PHP configuration limits by installing a simple plugin called WordPress phpinfo().

ADDITIONAL INFO:

Sometimes, you might be trying to upload the whole theme package zip file (which contain the PSD, Licence, Theme, etc..), instead of only the theme zip file.

If that's the case, make sure you unzip the theme package zip file on your computer, then check if there is a /Theme/ folder. If so, make sure you are uploading the theme zip file that is located in that theme folder.

18. How to activate the child theme ?


The child theme comes with the full package that you can download from themeforest.

Make sure that you previously uploaded the main theme before installing the child theme.

Step-by-step guide:

1. Go to your download tab in ThemeForest (http://themeforest.net/downloads) and download “All files & Documentations”. See screenshot: http://d.pr/i/12oHu

2. Unzip the file on your computer

3. Go to the /Theme/ folder and you will see the child theme zip file (eg: lush-child.zip) which is the child theme that you will upload to your wordpress. 4. Go to WP-Admin > Appearance > Themes and click on 'add new'.

5. Select the child theme's zip file and upload it.

6. Activate it.

19. When I post a my website link onto a social media as Facebook, the site preview displays unwanted text.

The easy way to manage the site preview is with the free plugin Yoast SEO. With this plugin you will be able to display what you want onto the preview and it will help you to improve your site’s SEO. 

  1.  Download the yoast SEO plugin.
  2. Install and activate it on your wordpress site.
  3. Go to your home page backend and look for the YOAST SEO setting.
  4. Click on tthe social icon


  1. And fill the the title and description fields. You can also select a new preview image.

20. How do I update my theme ?

First of all, do a backup on your local computer. There is a lot of tool and plugins available to help you to do this. Just find one with a good rating and get it set up now, not later: https://wordpress.org/plugins/search.php?q=backup+wp

ALWAYS make a backup of your entire site before you update. Usually the update install within seconds and cause zero problems, but it's better to be safe than sorry.

How to upgrade ?

First thing to know is that if you have modified PHP, CSS, JS files into the core theme, the update will overwrite what you did (it's why we suggest to do your modifications in the child theme).

The update will NOT affect your content such as your blog post, photos, videos, option theme settings, wordpress settings. Basically, the update replace the php, javascript and css files of the theme, not your database, and not the wordpress core files.

OPTION 1:

  1. Download and Install the Envato Market plugin.
  2. Upload envato-market to the /wp-content/plugins/ directory OR go to Plugins > Add New > Upload Plugin
  3. Activate the plugin through the 'Plugins' menu in WordPress.
  4. Click the 'Envato Market' menu in WordPress and connect to the API.
  5. Once your theme has been updated, make sure to reactivate the plugins by going to WP-Admin > Plugins. If one of your plugin has not been updated (ex: Visual Composer), go to WP-Admin > Plugins and delete the old plugin.
  6. Go to WP-Admin > Appearance > Install Plugins and reinstall the plugin. Make sure to "activate" them again.

OPTION 2: 

1. Redownload the theme files on ThemeForest (ThemeForest always have the latest version of the theme). So login into your Envato account, then go to Downloads, and download "Installable Wordpress file Only" package.

2. Go to Wp-Admin > Appearance >  Themes and activate another theme such Twenty Fifteen.

3. Delete the Theme you want to update. (Yeah, you must delete the theme before re-uploading the same theme).

4. Go to WP-Admin > Appearance > Themes > Add New and Upload the theme .ZIP file you've just downloaded from ThemeForest.

5. Activate your theme by clicking the "Activate button".

6. Make sure to reactivate the plugins by going to WP-Admin > Plugins. 

7. If one of your plugin has not been updated (ex: Visual Composer), go to WP-Admin > Plugins and delete the plugin then go to WP-Admin > Appearance > Install Plugins and reinstall the plugins. Make sure to "activate" it again.

OPTION 3:

If deleting a theme makes your nervous, or you have issue when uploading the theme via the WordPress dashboard, you can upload it manually by FTP.

1. Redownload the theme files on ThemeForest (ThemeForest always have the latest version of the theme). So login into your Envato account, then go to Downloads, and download "Installable Wordpress file Only" package.

2. Unzip the zip file on your computer

3. Rename the root folder for something like "themename-new".

4. By using an FTP software (such as FileZilla), connect to your FTP.

5. Upload the folder to .../wp-content/themes/ (so you should have /wp-content/themes/themename-new/)

6. Once everything has been uploaded, go to WP-Admin > Appearance > Themes and activate your new theme.

7. Make sure to reactivate the plugins by going to WP-Admin > Plugins. If one of your plugin has not been updated (ex: Visual Composer), go to WP-Admin > Plugins and delete the old plugin.

8. Go to WP-Admin > Appearance > Install Plugins and reinstall the plugins. Make sure to "activate" them again.

21. How the back-end of your themes look like ?

Here's a sneak peak of how the admin dashboard within WordPress looks like for Soundrise and Croma.

Theme Options:  Watch Video

Demo Importer: View Screenshot

Custom Post Types and Page SettingsWatch Video

22. How to embed a SoundCloud Player into my pages ?

To setup soundcloud on the homepage, you have several options but here's 2 easy options: 

1) Embedding the player into a text area widget Go to soundcloud.com. follow this FAQ to embed the player. http://help.soundcloud.com/customer/portal/articles/243751-how-can-i-put-my-sound-on-my-site-or-blog-

Once the iframe code is copied into your clipboard, go to wp-admin > appearance > widget. Drag/drop the TEXT widget into your homepage one or two column zone. Paste the iframe code into the box. Here's a screenshot: http://d.pr/i/ZzLb  

2) Use a soundcloud player plugin/widget:

Install a plugin such as SoundCloud is Gold (see screenshot: http://d.pr/i/I7pK ) Activate the widget then go to Appearance > Widgets and drag/drop the widget in your homepage one or two column zone.

23. I can't see the Slider Revolution when I move from one page to another.

Make sure that Nice scroll is turned off by going to the Theme Options Dashboard > General Settings

Nice scroll is a deprecated features and we don't use it anymore.

24. What is Visual Composer and how to use it ?

Visual Composer is a premium plugin that comes for free with some of our theme such as FWRD, Lush and Driver. With Visual Composer, you can build and design page layout without a line of code. The best place to get started with Visual Composer is to read the how's to provided here.

25. How to import demos

There are 2 ways to import the demo on your website. If option 1 does not work, try option 2.

OPTION 1: ONE-CLICK INSTALL --------------------------------------

  1. Make sure the theme is installed. Then go to WP-Admin > Appearance > Install Plugins. Install and activate all the required plugins.
  2. Go to WP-Admin > Tools > Demo Content Install. Choose your favorite demo and install it. It should takes 3 to 10 minutes.

If you don't see the "Demo Content Install" under "Tools", go to WP-Admin > Plugins. Deactivate AND Delete "Iron Demo Importer" plugin. Then go to WP-Admin > Appearance > Install Plugins and install "Iron Demo Importer" again. Then refresh your browser. Now check if you can go to WP-Admin > Tools > Demo Content Install.

If you still don't see the option, go to Option 3: Install from a demo's backup below.

Here's some issue you can face on when importing the demo:

1) Error message: Important: You need to activate zip extension.

This message might shows up when you go to Tools > Demo Content Install ( http://d.pr/i/Mm93 )

If it's your case, it means that Zip extension is not enable on your server. To enable it,

- Go to your CPANEL > Select PHP Version and check ZIP. See Screenshot: http://d.pr/i/Nf7L

- If you don't have access to your cpanel, please contact your webhost so he can enable Zip Extension. 

2) Error message: Timed Out If you have a Timed Out message when you are importing the demo it means that your max_execution_time is set only to 30 second or so. Our demo's data is big and the import process while takes more than 30 seconds. It's why you see a timed out message.

- To raise the time a script is allowed to run, go to your CPANEL > Select PHP Version > Switch to PHP Option (http://d.pr/i/Z6ev)

- Then check for max_execution_time and change the setting for 30 then click Apply and Save (http://d.pr/i/QXG2)

- If you don't have access to your cpanel or you still receive a timed out message, please contact your webhost so he can set your max_execution_time to 600. 

- If above steps doesnt work, see OPTION 2 below.

3) You can't see the "Demo Content Install" menu under WP-Admin > Tools

- To fix this, go to WP-Admin > Plugins and deactivate AND delete the plugin Iron Demo Importer. - Then go to WP-Admin > Appearance > Install Plugins, and install the plugin Iron Demo Importer again. - Then refresh your browser window and you should now see "Demo Content Install" under WP-Admin > Tools.

If you still don't see the option, go to Option 3: Install from a demo's backup below.

OPTION 2: MANUAL INSTALL -----------------------------------

If option 1 doesn't work or you have problem such as Timed Out issues, or Internal Error 500, etc, please install the demo manually. We have setup a  video tutorial to learn how to install it manually. See video below.

Remark: The files required to install the demo's content are located in the folder called /Demos Content/ of the package file you have downloaded from ThemeForest. Please unzip the big .zip file you have downloaded from ThemeForest and extract it on your computer first. Then you will see a folder called /Demos Content/ with the demo of your choice in its sub folder.

Step 01: Install the required plugins: 00:26

Step 02: Import the demo's content XML: 01:11

Step 03: Create and assign a menu: 03:30

Step 04: Tell WordPress which page is your homepage: 04:32

Step 05: Import Revolution Slider and Banners: 05:03

Step 06: Import Essential Grids: 05:56

Step 07: Import the Theme Options: 06:37

Step 08: Import the Music Player Options: 07:52

OPTION 3:  INSTALL FROM A DEMO'S BACKUP --------------------------------------------

1. Go to Appearance > Install Plugins. Install all required plugins and also, install the plugin “Iron Demos Importer” and make sure to activate them.
 

2. Download to your computer, the demo of your choice according to the theme you are using:

For SoundRise Theme:

For Croma Theme:

For FWRD Theme:

For Lush Theme:

3. Upload demo.zip file to your web server in the folder /WP-CONTENT/UPLOADS/FW-BACKUP/ (Create the directory /FW-BACKUP/ in your /uploads/ folder if it does not exist)

4. Go to WP-ADMIN > TOOLS > BACKUP.

5. Select  the archive you want to import then click restore Backup. See screenshot: http://d.pr/i/gexh

You can always open a support ticket at http://support.irontemplates.com if you have any issues. We are here to help.

26. How to setup playlist section or add MP3 and audio files

Auto-Play your music when the homepage load

  1. Go to wp-admin > pages and edit your homepage.
  2. Edit the audio player element. (Add a new one if you'd like), select the playlist and click auto-play. http://d.pr/i/V5VloS
  3. You can hide the player to avoid it to shows up in your page by disabling it's parent's column: http://d.pr/i/Zx2kEt

Starting the player from Slider Revolution.

We sometimes use a "Play" button in the big banner on the homepage. The play button needs to be linked to an audio player on your homepage. 

  1. Edit your homepage and edit the audio player you will see there.
  2. Choose the playlist you want to use when the Play button is clicked from Slider Revolution.
  3. To tell Slider Revolution which player you want to fire when you click on the play button, go to wp-admin > Slider Revolution and edit the slide.
  4. Select the play button and go to the action tab. http://d.pr/i/kqmWfe
  5. Notice the "0" in this code ? This mean that the first player that shows on your homepage will be fired so make sure that your homepage player is above all the other player in your homepage.

Add an audio player to a page:

  1. Go to WP-Admin > Pages and edit the page of your choice (ex: Homepage)
  2. Make sure you are using the Backend editor mode: http://d.pr/i/7fOA
  3. Add a new row
  4. Into this row, add an Audio Player widget: http://d.pr/i/14zQt
  5. Make sure to choose the album (or multiple album) you want to play in your page. http://d.pr/i/1jEA7

Add MP3s, and create new albums and playlists.

  1. Go to WP-Admin > Playlist/Albums > Add New
  2. Enter the title of your album, and an optional descriptions.
  3. Make sure to set your album cover as the featured image: http://d.pr/i/19Lv4
  4. Fill the textfields under Album Infos with your own content.
  5. Upload your MP3 for each track you have for that album. Only MP3 files are allowed.
  6. Save it.

Create a Music page and shows your album into it:

  1. Go to WP-Admin > Pages > Add New
  2. Add a new element called Essential Grid and select the pre-defined grid you have previously imported with the demo. http://d.pr/i/LPp6ZH 
  3. Save your page.
  4. To edit the grid's size or number of columns, etc. go to wp-admin > Ess. Grid > and edit the predefined grid you'd like.

See the full documentation of Essential Grid here: https://www.themepunch.com/essgrid-doc/essential-grid-documentation/

 

27. I can't activate a plugin. Where is the license key ? Is it included with your theme ?

Sometimes, plugins will ask you to enter a Licence Key or API Key. Well, you don't need a licence key or API key to activate it. The plugin will still work even if you don't have that licence key.

The licence key or API key is only used for automatic updates offered by the plugin authors and is available if you purchase the plugin for yourself at codecanyon.net

Since we include the plugin directly (for free) into our theme, we made sure the plugin is 100% compatible with the theme. If you decide to purchase the plugin license for yourself and update the plugin, the theme might break. 

We (IronTemplates) are responsible to update the pre-packaged plugins that comes with our theme. We release plugin updates on regular basis after testing them and make sure they are 100% compatible within our theme. It's the way it works for every themes that offer third party plugins packaged into the theme.