ColorMag Pro

Thank you for using this theme. If this instruction doesn't cover your queries feel free put your query in our support forum here. Our dedicated support team will look into it and will get back to you as soon as possible.

ThemeGrill · Themes

01Getting started

This is the ColorMag Pro theme instruction page. We have tried our best to keep it as simple as possible. If you think it can be made even simpler let us know we will be glad to change it. Let's start! On the right side you can see the table of contents of this documentation.Jump to the section you want, or read it all through - your choice.Let's move on!

02Installation

Installing your theme is pretty easy! After downloading, you should have a colormag-pro.zip file. This is a compressed file containing all of the required templates, images and icons required for the theme to function properly.

Upload the theme

  1. Go to Appearance > Themes in the WordPress Dashboard
  2. Click on the Add New button
  3. Click on the Upload link
  4. Select the colormag-pro.zip file
  5. Click Install Now

Activate the theme

  1. Go to Appearance > Themes in the WordPress menu
  2. Hover over the theme thumbnail and press the Activate button
Additional information: WordPress Codex – Using Themes

04Important Information

This documentation covers only the feature which are in the pro version of this theme. So, if you see the feature which does not cover here, then please read the documentation of the free version from this link:-
Colormag Free Theme Documentation

05Header Display Type

The pro of this theme supports Header Display Type option for your site. Here are the options available in the Header Display Type for this theme:-
  1. Type 1 (Default): Header text & logo on left, header sidebar on right
  2. Type 2: Header sidebar on left, header text & logo on right
  3. Type 3: Header text, header sidebar both aligned center
For this option to be changed, you have to visit here and do the required changes:-
  1. In the dashboard, go to Appearance > Customize.
  2. Click on the Header Options > Header Display Type section.
  3. Then, choose either one of the option mentioned above, which is in this section.
  4. After changing these options, click on Save & Publish button to save the changes.
Here, below is the screenshot for it:-
header-display-type

06Breaking News Extra

This theme has more options for the breaking news option than the free version of this theme. So, to set up these settings, visit here:-
  1. In the dashboard, go to Appearance > Customize.
  2. Click on the Header Options > Breaking News section.
      Here are the added options in this section:-
    1. You now can add any text for this, ie, change the 'Latest:' word to anything you want. For this, you have to change the text under the 'Enter the text to display for the ticker news' to apply.
    2. It also has the option for the animation type used in the ticker, ie, up and down. For setting this up, there is the label of 'Choose the animation style for the Breaking News in the Header' in this section with the option available in the select options provided there.
    3. It also has the option of the duration time to be set up for this, which is just under the 'Enter the duration time for the Breaking News in the Header' label. Here, you need to enter the number as your requirement. Note: only enter the number here and it will be converted in seconds.
    4. It also has the option of the speed time to be set up for this, which is just under the 'Enter the speed time for the Breaking News in the Header' label. Here, you need to enter the number as your requirement. Note: only enter the number here and it will be converted in seconds.
    5. It also has the option to where to put the breaking news ticker in your site, either Header or just under the Main Menu. This setting is done under the label of 'Choose the location/area to place the Breaking News', with the option of the 'Header' and 'Below Navigation'.
  3. After you made the required changes, click on Save & Publish button to save the changes.
Here, below is the screenshot for it:-
breaking-news-extra

07Added Social Options

We have added more social icons in the pro version than the free version of this theme. Also, we have added the option to input the custom Social Icons for your site. For setting up this Custom Social Icons, please do the following:-
  1. In the dashboard, go to Appearance > Customize.
  2. Click on the Social Options > Additional Social Icons section.
  3. Now, here you have the following options:-
    1. Additional Social Link One: It is used for adding the link to the specific social icons you want.
    2. Preferred Social Link FontAwesome Icon: It is used for generating the social icon image for displaying it in the front-end. Note: You can use any of the fontawesome icon available here, and you need to only enter the brand/company name here as described by the fontawesome site.
    3. Preferred Social Link Color Option: It is used for providing the required color for the social icons used in the social icons.
    4. Check to show in new tab: This option is just for opening up the required site in the blank page/new tab or not.
Here, below is the screenshot for it:-
added-social-icons

08Social Share Button

The pro version of this theme is integrated default with the Social Share buttons, for the single posts. To enable it, please do the following:-
  1. In the dashboard, go to Appearance > Customize.
  2. Click on the Additional Options > Social Share Buttons section.
Here, below is the screenshot for it:-
social-share-buttons

09Social Profile In Author Bio

This theme support the the option to show the social profile in your author bio. For this, you need to include your Biographical info in your profile page, and the social profile for this theme comes under the 'User Social Links', in the profile section. For setting up these, please follow the instruction:-
  1. In the dashboard, go to Users > Your Profile.
  2. Then, you need to fill up the 'Biographical Info', which is under the 'About Yourself' section.
  3. Now, for the required social icons, there is the section of User Social Links, here, you are provided with the social icons and in there, you only need to input only the username of each of the social site there.
  4. Now, you need to visit Appearance->Customize->Additional Information->Social Profiles In Author Bio
  5. Now, just check the checkbox saying 'Check to show the Social Profiles in the Author Bio' and it will display the required social icons in your profile.
Here, below is the screenshot for the social profile for the author bio in the back-end:-
author-profile-backend
Here, below is the screenshot for it:-
social-profile-icon

11Color Options

This theme supports the option to change the color setting for your site, according to which you want for your site. To set it up, please follow the below steps:-
  1. In the dashboard, go to Appearance > Customize.
  2. Click on the Color Options section.
  3. Here are many lists of the color options, so, check them individually as it has lots of it, so, we could not cover all of them at once here. But, the section available here are:-
    1. Header Color Options: This section covers all the color settings, which cover the header area.
      Here, below is the screenshot for the header color options:-
      header-color-options
    2. Content part color options: This section covers all the color settings, which cover content area.
      Here, below is the screenshot for the header color options:-
      content-color-options
    3. Footer part color options: This section covers all the color settings, which covers the footer area.
      Here, below is the screenshot for the header color options:-
      header-color-options
  4. Now, you need to just click on Save & Publish button to save the changes.

12Typography Options

This theme supports the option to change the typography setting for your site, according to which you want for your site. To set it up, please follow the below steps:-
  1. In the dashboard, go to Appearance > Customize.
  2. Click on the Typography Options section.
  3. Here are many lists of the typography options, so, check them individually as it has lots of it, so, we could not cover all of them at once here. But, the section available here are:-
    1. Google Font Options: This section covers all the google fonts options available in this theme.
      Here, below is the screenshot for the google font options:-
      google-font-options
    2. Header Font Size Options: This section covers all the header font size settings, which cover header area.
      Here, below is the screenshot for the header font size options:-
      header-font-options
    3. Title Related Font Size Options: This section covers all the Title Related font size settings, which cover title related area.
      Here, below is the screenshot for the Title Related font size options:-
      title-font-options
    4. Content Font Size Options: This section covers all the Content font size settings, which cover the content area.
      Here, below is the screenshot for the Content font size options:-
      content-font-options
    5. Footer Font Size Options: This section covers all the Footer font size settings, which cover the footer area.
      Here, below is the screenshot for the Footer font size options:-
      footer-font-options
  4. Now, you need to just click on Save & Publish button to save the changes.