Activating and Configuring Theme Options

You are here:
< Back

Typography

In this section you can customize the typography for body, post title, widget title, and widget content. 

Body Font Family: Set the desired font family. Choose it from the dropdown menu.

body font family

Headings Font Family: Set the desired font family for the headings (H1 to H6). Choose it from the dropdown menu.

heading font family

Body Font Size:

  • Set the desired font size.
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
body font size
  • Click on the respective icon to set the appropriate font size

Body Font Weight: Choose the appropriate font weight from the dropdown menu. You can choose from 100 to 800.

Body Font Weight

Body Font Style: Set the desired Font Style (Normal, Inherit, Italic).

Body Font Style

Body Font Letter Spacing (px):

  • Set the desired Letter Spacing (from 0 – 10).
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
Body Font Letter Spacing
  • Click on the respective icon to set the appropriate letter spacing.
body font letter spacing responsive

Body Line Height (px):

  • Set the desired line-height (from 1 – 4).
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
Body Line Height
  • Click on the respective icon to set the appropriate line-height.
Body Line Height Responsive

Post Title Font Size: 

  • Set the desired font size.
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
Post Title Font Size
  • Click on the respective icon to set the appropriate font size.
Post Title Font Size Responsive

Post Title Font weight: Choose the appropriate font weight from the dropdown menu. You can choose from 100 to 800.

Post Title Font Weight

Post Title Text Transform: Set the desired transformation (none, capitalize, uppercase, lowercase, initial). You can choose from the dropdown menu.

Post Title Text Transform

Post TItle Font Style: Set the desired Font Style (Normal, Inherit, Italic).

Post Title Font Style

Post Title Letter Spacing (px):

  • Set the desired Letter Spacing (from 0 – 10).
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
Post TItle Letter Spacing
  • Click on the respective icon to set the appropriate letter spacing.
Post Title Letter Spacing

Post Title Line Height:

  • Set the desired line-height (from 1 – 4).
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
Post Title Line Height
  • Click on the respective icon to set the appropriate line height.
Post Title Line Height Responsive

Widget Title Font Size:

  • Set the desired font size.
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
Widget Title Font Size
  • Click on the respective icon to set the appropriate font size.
Widget Title Font Size

Widget Title Font Weight: Choose the appropriate font-weight from the dropdown menu. You can choose from 100 to 800.

Widget Title Font Weight

Widget Title Text Transform: Set the desired transformation (none, capitalize, uppercase, lowercase, initial). You can choose from the dropdown menu.

Widget Title Text Transform

Widget Title Font Style: Set the desired Font Style (Normal, Inherit, Italic).

Widget Title Font Style

Widget TItle Letter Spacing (px):

  • Set the desired Letter Spacing (from 0 – 10).
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
Widget title letter spacing
  • Click on the respective icon to set the appropriate letter spacing.
Widget title letter spacing responsive

Widget Title Line Height:

  • Set the desired line-height (from 1 – 4).
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
widget title line height
  • Click on the respective icon to set the appropriate line height.
widget title line height responsive

Widget Content Font Size:

  • Set the desired font size.
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
widget content font size
  • Click on the respective icon to set the appropriate font size.
widget content font size responsive

Widget Content Font Weight: Choose the appropriate font weight from the dropdown menu. You can choose from 100 to 800.

widget content font weight

Widget Content Text Transform: Set the desired transformation (none, capitalize, uppercase, lowercase, initial). You can choose from the dropdown menu.

widget content text transform

Widget Content Font Style: Set the desired Font Style (Normal, Inherit, Italic).

widget content font style

Widget Content Letter Spacing (px):

  • Set the desired Letter Spacing (from 0 – 10).
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
Widget content letter spacing
  • Click on the respective icon to set the appropriate letter spacing.
widget content letter spacing responsive

Widget Content Line Height:

  • Set the desired line-height (from 1 – 4).
  • For mobile and tablet click monitor icons right of the subsection title. You will get icons of mobile and tablet.
widget content line height
  • Click on the respective icon to set the appropriate line height.
widget content line height responsive

Inner Banner Options:

Inner Banner is displayed in every single page and post just after the heading section.

Adding Inner Banner Image

  • Click the Add new image button.
Add inner Banner Image
  • Choose an image from the media gallery or upload from the computer. (best size is 1366*400)
  • Click the select and crop button.
choose image
  • You will get an option to crop the image. You can skip it or crop it to the recommended size. Click the desired outcome.
cropping the image

Customizing Inner Banner

Height (px):

  • Set the height of the banner.
  • For mobile and tablet, click monitor icons right of the subsection title. You will get icons of mobile and tablet.
height
  • Click on the respective icon to set the appropriate height.
height responsive

Font Size:

  • Set the desired font size for the post title.
  • For mobile and tablet, click monitor icons right of the subsection title. You will get icons of mobile and tablet.
font size
  • Click on the respective icon to set the appropriate font size.
font size

Text Color:

  • To set the text color, click on the Select Color button.
text color
  • It will display the color palette.
  • Choose the desired color. You can also set the transparency level.
Text color

Overlay Color: Set this option to set overlay for the banner image.

  • Click on the Select Color button. It will display the color palette.
overlay color
  • Choose the color and then set the desired transparency.
choose overlay color

Alignment: Set the alignment of the title (left, center, right) to display in the banner.

Alignment

Image Attachment: Set the desired attachment style (scroll, fixed) for the image.

Image Attachment

If you don’t want to show the banner image then you can click Hide image button to remove the image from the Current header section.

Remove current header

Color Options

Background Color:

  • Click on the Select Color button.
choose background color
  • It will display the color palette. Click to choose the color.
choose background color

Primary Color:

  • Click on the Select Color button.
Primary Color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
Choose Primary Color

Body Text Color:

  • Click on the Select Color button.
Body text color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
Choose Body text color

Link Color:

  • Click on the Select Color button.
Link Color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
Choose Link Color

Link Hover Color:

  • Click on the Select Color button.
Link Hover Color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
choose link hover color

Side Widget Title Color:

  • Click on the Select Color button.
widget title color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
choose sidebar widget title color

Side Widget Content Color:

  • Click on the Select Color button.
select sidebar widget content color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
choose sidebar widget content color

Footer Widget Title Color:

  • Click on the Select Color button.
select widget title color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
choose footer widget title color

Footer Widget Content Color:

  • Click on the Select Color button.
select footer widget color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
choose footer widget content color

Footer Background Color:

  • Click on the Select Color button.
select footer background color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
choose the footer background color

Footer Copyright Background Color:

  • Click on the Select Color button.
select color for footer copyright background
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
choose color for footer copyright background color

Footer Copyright Text Color:

  • Click on the Select Color button.
select footer copyright text color
  • It will display the color palette.
  • Choose the color and then set the desired transparency.
choose color for footer copyright text color

Breadcrumb Options

Show Breadcrumb: Enable this option to show Breadcrum in the webpage.

show breadcrumb

Separator: The theme provides 5 different separators. Click the desired separator to choose and display in the breadcrumb.

Separator

Font Size:

  • Insert the desired font size.
insert font size
  • For the mobile and tablet version, click monitor icons right of the subsection title. You will get icons of mobile and tablet.
  • Click on the respective icon to set the appropriate font size
font size responsive

Post Options

Customize how you would like to display the posts in the archive page.

You can toggle enable or disable for the following options

  • Categories
  • Date
  • Author
  • Comments
  • Read More Button
Post Options

Excerpt Length: Mention the length of the Excerpt for the posts in the archive page

Post Per Row: Choose the desired post per row. You can choose

Excerpt length and post per row

Sidebar Options

Sidebar Position: Display the sidebar at either left or right. Choose none to hide the sidebar.

Enable Sticky Sidebar: Enable this option to allow a fixed sidebar on a webpage that remains visible.

Sidebar Position, Enable Sticky Sidebar

Advanced Options

Show Preloader: Enable this option to display a preloader until the content of the web page gets displayed.

preloader

Enable Dark Mode: This option enables a black background with white-coloured text.

dark mode

Assets Version: Choose between development or production option. Development option shows unminified version of JS and CSS while Production option displays the minified version.

Assests Version

Site Layout: Choose between full width (default) layout or boxed for the website. The theme 

Site Layout

Container Width: set the container width. The default value is 1400.

Container Width

Footer Options

Footer Layout: Choose the layout option from one column to four columns for the footer. You can add widgets to display in these columns.

Footer Layout

Show Social Menu:  Enable the option to show the social menu in the footer. For this to work out, you need to configure the social menu in the Menus.

Show Social Menu

Show Footer Copyright: Enable the option to show the footer Copyright test. Once enabled you can then insert Copyright Text.

Footer Copyright

Reset Options:

If you think all the customization is not working as it seems to be then you can reset the options with just a click.

Reset option