Skin Settings

Updated on November 21, 2017

Theme Settings is the main section of The Ken where you can change the global settings of your website. You can access it from the top left side of your dashboard. In this article we will describe the options available under the Skin section of Theme Settings.

To access the skin settings, from WordPress top bar, go to Theme Settings > Skin

skin settings


Body

skin_body

Accent Color You can set the accent color of your website here. Most elements on the front end will use this color scheme. We recommend using a bold, vivid color for this option.
Body Text Color Use this option to set the color of the body text. This will be the color used for most of the text-based information on your website.
Headings Color Use this option to set the main color of the heading text. The heading text includes the copy which is wrapped in the h1, h2, h3, h4, h5, h6 tags.
Links Color This option is defined below the table.
Page Title Use this option to set the color of the text on the Page Title area on the front end.

Links Color

Use this option to set the color of your links. Links can have three states, and you can have a separate color for each one:

Regular: This color is the normal state of the link
Hover: This color is for when the mouse is over the link
Active: This color is for when the mouse has clicked on the link


Sidebar

skin_sidebar

Sidebar Widget Title Use this option to set the title color of the sidebar widget which you can add from Appearance -> Widgets.
Sidebar Widget Texts Use this option to set the inner text color of the sidebar widgets. This option will be overridden if a specific color is set in the theme style of an individual option.
Sidebar Widget Links This option is defined below the table.

Sidebar Widget Links

Use this option to set the link colors of the sidebar widgets. There are three options available:

Regular: This color is the normal state of the link
Hover: This color is for when the mouse is over the link
Active: This color is for when the mouse has clicked on the link


Footer

skin_footer

Footer Widget Title Use this option to set the color of the Footer Widget Titles.
Footer Widget Texts Use this option to set the color of the Footer Widget Body Text. This will affect all text in the footer widget (unless there is a color value for the specific option in theme styles).
Footer Widget Links This option is defined below the table.
Show Sub Footer Border Top? If you enable this option, a border will appear just above the sub-footer area on the frontend to visually divide it from the footer.
Sub-Footer Social Networks Color This option is defined below the table.
Sub-Footer Copyright Color Use this option to set the color of the copyright text on the left side of the sub footer area.
Show Widget Title Divider? Enable this option if you want to have a divider line between the title and the widget text.

Footer Widget Links

Use this option to set the link colors for the footer widgets. There are three options available:

Regular: This color is the normal state of the link
Hover: This color is for when the mouse is over the link
Active: This color is for when the mouse has clicked on the link

Sub-Footer Social Networks Color

Use this option to set the link colors for the Social Network icons in the footer. There are three options available:

Regular: This color is the normal state of the link
Hover: This color is for when the mouse is over the link
Active: This color is for when the mouse has clicked on the link


Main Navigation

skin_main_navigation

Main Navigation Top-Level This option is defined below the table.
Main Navigation Sub-Level Background Color Use this option to set the color of the main navigation sub-level background.
Main Navigation Sub-Level This option is defined below the table.
Show Main Navigation Border Top? Enable this option if you want to have a border shown on the front end at the top of the main navigation.

Main Navigation Top-Level

Use this option to set colors for the different states of the main navigation top-level menu items. Available options:

Regular: This is for the color of a menu item in the normal state.
Hover: This is for the color of a menu item when the mouse is over it.
Background Color: This is for the background color of a menu item in the normal state.
Hover: This is for the background color of a menu item when the mouse is over it.

Main Navigation Sub-Level

Use this option to set colors for the different states of the main navigation sub-level menu items. Available options:

Regular: This is for the color of a menu item in the normal state.
Hover: This is for the color of a menu item when the mouse is over it.
Background Color: This is for the background color of a menu item in the normal state.
Hover: This is for the background color of a menu item when the mouse is over it.


Header

skin_header

Show Toolbar Border Bottom? Enable this option if you want to have a border shown on the front-end at the bottom of the header toolbar area.
Header Toolbar Border Bottom Color Use this option to set the color of the border for the header toolbar area.
Header Toolbar Text Color Use this option to set the color of the text for the header toolbar area.
Header Toolbar Phone & Email Icon Color Use this option to set the color of the Header Toolbar Phone and Email Icon.
Header Toolbar Link Color This option is defined below this table.
Header Toolbar Social Network Link Color This option is defined below this table.
Header Search Icon Color Use this option to set the color of the search icon in the header.

Header Toolbar Link Color

Use this option to set the link colors for the header toolbar area. There are two options available:

Regular: This color is for the normal state of the link.
Hover: This color is for when the mouse is over the link.

Header Toolbar Social Network Link Color

Use this option to set the colors for the header toolbar area social network icons. There are two options available:

Regular: This color is for the normal state of the link.
Hover: This color is for when the mouse is over the link.


Pre Loader

skin_pre_loader

Preloader Text Color Use this option to set the text color of the preloader feature.
Preloader Background Color Use this option to set the background color of the preloader feature.
Preloader Bar Color When using the preloader feature, a bar appears on the screen indicating the loading state. Use this option to set the color of that bar.

Breadcrumbs

skin_breadcrumb

Breadcrumb Skin

Use this option to decide on the skin style of the breadcrumbs section. Available options are:

Light
Dark
Custom: Choosing this will give you an option to select your desired color

Breadcrumb Custom Skin Color

If you choose “Custom” for the Breadcrumb Skin, you’ll have the option to set a custom color for the skin of the breadcrumbs section. Available options are:

Regular: This color is the normal color of the breadcrumb.
Hover: This color is for when the mouse is over the breadcrumb.

Did this answer your question?