Theme Options & Customizer

Theme Customizer

The WordPress customizer is a tool which allows you to edit all the style options from a theme and visualize the changes live, as you make them. To open it go to  Appearance > Customize.

1. Logo

You can upload your logo, which can be of any size. You need to also upload a double sized logo for retina displays and a favicon. If you do not do this, the theme’s logo will appear on retina displays and the favicon will be also the theme’s. Make sure that you also complete the logo’s size correctly (in px).

2. Navigation

In this section you can change the theme’s main menu.

3. Blog

Choose the default layout for the blog, single post, search and archives pages.

4. Footer

The footer can be either full (with large widget areas) or minimal (with only one small stripe). In this section you can choose it’s style and also how many widget areas should be active in the large footer.

5. Colors

You have seven colors to change in this theme. Here’s what they represent:

  • main color - is the most used color in the theme (for buttons, links, certain highlights, hover elements, etc.)
  • menu main color - is the color that will be used for all menu links (hover) and submenu background (again, just on hover)
  • menu login links color - is the color that will be used for the dashboard related links in the menu (login, logout, sign in, dashboard)
  • minor color - this color is only used in the sliders navigation arrows
  • small pie normal color - this is the regular color for the pies in small widgets and projects grid
  • large pie normal color - this is the regular color for the pie in the single project sidebar
  • pie successful color - this is the color that any pie has when the project is funded

6. Typography

The last section of the customizer holds two fields for custom fonts. These are all Google Fonts. Please note that because Google changes it’s fonts on a regular basis, not all of the fonts you see on Google may be included here.

The fonts used in the online theme preview are Montserray (for headings) & Raleway (for body). We also use some custom CSS lines of code to enhance the typography using these two specific font families.

Paste this code in the proper place for custom CSS if you’re using these fonts.

body { 
	letter-spacing: 0.3px; 
}

h1, h2, h3, h4, h5, h6, .ignitiondeck.id-creatorprofile .id-creator-name, #custom-header .cta a, .krown-tabs .titles li h5, #content .memberdeck .dashboardmenu li a, .ignitiondeck .id-product-days, .ignitiondeck .id-product-days-to-go, .krown-button, .krown-pie .value, .krown-id-item li span, .id-widget .id-progress-raised, .id-widget .id-product-total, .id-widget .id-product-days, .ignitiondeck.id-mini .id-product-days, .id-level-title { 
	letter-spacing: 0; 
}

Whenever you make a change you’ll see the actual website refresh with the changes you do. Make sure that when you’re done, you hit the Save & Publish button. After this, you can close the customizer.

More Theme Options

Other than these options which apply to the styling of the theme, you have another set of options, which don’t affect the style, but the functionality, and you should do a quick look there. You can find a new menu item under Appearance > Theme Options.

1. Analytics

Inside this section you should paste your Google Analytics code. If you do use these, please don’t forget to enable them first, otherwise not all page clicks will be triggered, even if you have your code placed.

2. Custom CSS

If you have any css rules that you may want to add to the website, this is the place to add them. However, if you want to do extensive modifications, i suggest that you go with a child theme, because it’s better. But more on this later. If you don’t have more than 100 lines of code you can paste them here.

3. Custom Sidebars

In this area you can define as many unique sidebars as you want. Please remember that you have to give a unique lowercase id (only letters, no spaces) to each sidebar in order for it to work properly.

4. Comments

The theme allows to use comments both in pages & posts along with the portfolio post type. Make sure that you enable them from this area but also enable them from WordPress.

5. Admin

Here you have a field for the replacement of the administrator login logo. Just make sure that you will respect the size written there and you can replace the theme’s login logo with your own brand or the client’s.

6. Updates

This is the place where you can configure auto updates by inserting your marketplace username and API key. Note that this might not work on all installations though (it’s an experimental feature).

UP NEXT: Homepage & menu setup