Skin Settings

Last Updated on

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

In this article


Body

skin_body
Accent ColorYou 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 ColorUse 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 ColorUse 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 ColorThis option is defined below the table.
Page TitleUse this option to set the color of the text on the Page Title area on the front end.

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


skin_sidebar
Sidebar Widget TitleUse this option to set the title color of the sidebar widget which you can add from Appearance -> Widgets.
Sidebar Widget TextsUse 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 LinksThis option is defined below the table.

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


skin_footer
Footer Widget TitleUse this option to set the color of the Footer Widget Titles.
Footer Widget TextsUse 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 LinksThis 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 ColorThis option is defined below the table.
Sub-Footer Copyright ColorUse 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.

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

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


skin_main_navigation
Main Navigation Top-LevelThis option is defined below the table.
Main Navigation Sub-Level Background ColorUse this option to set the color of the main navigation sub-level background.
Main Navigation Sub-LevelThis 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.

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.

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.


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 ColorUse this option to set the color of the border for the header toolbar area.
Header Toolbar Text ColorUse this option to set the color of the text for the header toolbar area.
Header Toolbar Phone & Email Icon ColorUse this option to set the color of the Header Toolbar Phone and Email Icon.
Header Toolbar Link ColorThis option is defined below this table.
Header Toolbar Social Network Link ColorThis option is defined below this table.
Header Search Icon ColorUse this option to set the color of the search icon in the header.

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.

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 ColorUse this option to set the text color of the preloader feature.
Preloader Background ColorUse this option to set the background color of the preloader feature.
Preloader Bar ColorWhen using the preloader feature, a bar appears on the screen indicating the loading state. Use this option to set the color of that bar.

skin_breadcrumb

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

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.

Was this helpful?
Previous Article:
Next Article:

Can't find what you're looking for?

Open New Ticket