Here you can write the contact details for your company/organization. These details are listed in the Topbar area, Side Panel or the Popup Modal.

Topbar:

After you are done writing your info details, navigate to Theme Options > Header > Topbar, select the Topbar Left and Right Content to display the “Contact info” or “Social links”.

Side Panel:

Navigate to Theme Options > Header > Side Panel > Side Panel Settings  and check with “Contact Links” and “Social Icons” options.

Popup Modal:

Navigate to Theme Options > Header > Popup Modal > Modal Box Settings and check with “Social Icons” option.

• Go to Top Button – allows users to smoothly scroll back to the top of the page.
• Google Map API Key – Google requires you to use an API KEY to display custom maps on your website. Create your own API KEY and paste it here.
• Disable Animations on Mobile – option to disable element animations on mobile devices.

• Primary Accent Color – option for setting the primary color of the theme. If not set, it will pick the theme default color.
• Secondary Accent Color – option for setting the secondary color of the theme. If not set, it will pick the theme default color.
• Title Bar Background Color – select the background color used for the single pages title bar section. This option can be overwritten in the page “Title Section” metabox.
• Title Bar Text Color – select the single page title color. This option can be overwritten in the page “Title Section” metabox.
• Links Color – Normal, hover and visited states of a link.

Preloaders are important interface elements that let visitors know that the website hasn’t crashed, it’s just processing data.

• Preloader – turn on to enable the preloader screen before loading the site resources.
• Preloader Background Color – set the preloader screen background color.
• Preloader Image – upload a media image (eg. site Logo) that will be centered in the middle on the screen.
• Preloader Image Size – set the image size on desktop screens (pixel value).
• Preloader Mobile Image Size – set the image size on mobile screens (pixel value).

Header Bar Settings

• Header Bar Width – control the general width of your site main navigation menu – Contained and Full Width.
• Header Bar Behavior – select the header behavior when scrolling down the page.
• Header Bar Spacing – control the top and bottom padding for the header bar.
• Header Bar Background Color – select the background color for the fixed menu bar.
• Sticky Header Bar Background Color – select the background color for the sticky menu bar.

Header Bar Icons

• Search Icon – option to turn on/off the Search Icon (visible in the Topbar area).
• Cart Icon – option to turn on/off the Cart Icon (visible in the Topbar area).
• Cart Icon Style – dropdown option where you can select between a cart, bag and basket icon.

• Logo Style – select the Logo type: text or image.
• Text Logo – enter the name of your website displayed instead of the regular image logo.
• Text Logo Font Settings (:Text logo) – control the typography settings of your text logo.
• Primary Logo Text Color (:Text logo) – select the color of your primary text logo. Recommended image size: 120×60 pixels
• Secondary Logo Text Color (:Text logo) – select the color of your secondary text logo. Recommended image size: 120×60 pixels
• Image Logo – insert the source media of your primary logo.
• Secondary Image Logo (:Image logo) – insert the source media of your secondary logo.
• Image Logo Size (:Image logo) – control the width of your logo image.

Main Menu Settings

• Menu Alignment – control the position of the main menu.
• Menu Font Settings – control the typography settings of the menu.
• Menu Link Color – select the default menu text color.
• Menu Link Hover Color – select the default menu text color on mouse over.
• Sticky Menu Link Color – select the sticky menu text color.
• Sticky Menu Link Hover Color – select the sticky menu text color on mouse over.
• Dropdown Menu Link Hover Effect – select the hover effect on dropdown menu links.

Transparent Navigation Options

• Menu Link Color – menu link color when using a transparent background.

• Enable Topbar – option to enable/disable showing the topbar.
• Enable Topbar on Mobile – option to enable/disable showing the topbar on mobile devices.
• Sticky Topbar – option to enable/disable the sticky topbar.
• Topbar Left Content – select the content for the topbar left section.
• Topbar Right Content – select the content for the topbar right section.
• Topbar Content Design – select the topbar content design.
• Topbar Font Settings– control the typography settings of the topbar texts.
• Topbar Background Color – select the topbar background color.
• Topbar Text Color – select the topbar text color.
• Topbar Text Hover Color – select the topbar text color on mouse over.

Topbar content areas

Using the Topbar Left Content and Topbar Right Content you have the option to display Contact Info, Social Links and Navigation.

Contact Info and Social Links can be easily configured in the Theme Options > Business Info area.

To set up the Topbar Navigation please see the Topbar Menu article. You simply need to create a new menu (if not already imported with the Demo Content) and assign it to the Topbar Menu area.

Control the settings of the Modal Popup used to display additional content on all pages and posts, without sacrificing space. The Modal Box is hidden by default and can only be triggered using the Header Button displayed near the Main Menu. This button can also be used to open a new page or smooth scroll to a page section ID.

Header Button Settings

• Enable Header Button – option to enable/disable showing the header button. The button will be displayed near the main navigation area to the right.
• Button Text – option to set the button text.
• Button Style – option to select the button design style.
• Button Color Scheme – option to select the button color scheme. Primary and secondary colors can be set in Theme Options > Global Options > Color schemes.
• Button Hover State – option to select the button design style for the hover state.
• Button Action – option to control the button action on click.

Modal Box Settings

• Modal Heading – title text for the modal.
• Modal Contents – modal description text area. HTML is allowed.
• Modal Background Image – option to a background image for the modal window.
• Social Icons – option to enable/disable displaying the social icons in the modal window.
• Contact Form Plugin – option to enable/disable displaying a contact form in the modal window.
• Contact Form 7 Title – select the Contact Form 7 from the dropdown. The list is automatically populated.
• CSS Class – add a class to the wrapping HTML element for further CSS customization.

IMPORTANT! Changes to the phone, email and social links can be done in Theme Options > Business Info.

Scroll Section Settings

• Scroll to Section ID – enter the section ID where you want the Header Button to scroll to.

New Page Link Settings

• Button Link – enter the link of the page where you want the Header Button to redirect to.
• Link Target – option to select between opening the link in the same or a new page.

Trigger the Popup Modal using any button

You can trigger the Popup Modal using any button. For example, open the Button element settings modal and check with the Button action option.

Learn more

Control the settings of the Side Panel used to display additional content on all pages and posts, without sacrificing space. The Side Panel is hidden by default and can be triggered using the Header Button displayed near the Main Menu. This button can also be used to open a new page or smooth scroll to a page section ID.

Header Button Settings

• Enable Header Button – option to enable/disable showing the header button. The button will be displayed near the main navigation area to the right.
• Button Text – option to set the button text.
• Button Style – option to select the button design style.
• Button Color Scheme – option to select the button color scheme. Primary and secondary colors can be set in Theme Options > Global Options > Color schemes.
• Button Hover State – option to select the button design style for the hover state.
• Button Action – option to control the button action on click.

Side Panel Settings

• Panel Heading – title text for the side panel.
• Modal Contents – side panel description text area. HTML is allowed.
• Contact Links – option to enable/disable displaying the phone and email links in the side panel window.
• Social Icons – option to enable/disable displaying the social icons in the side panel window.
• Contact Form Plugin – option to enable/disable displaying a contact form in the side panel window.
• Contact Form 7 Title – select the Contact Form 7 from the dropdown. The list is automatically populated.
• CSS Class – add a class to the wrapping HTML element for further CSS customization.

IMPORTANT! Changes to the phone, email and social links can be done in Theme Options > Business Info.

Scroll Section Settings

• Scroll to Section ID – enter the section ID where you want the Header Button to scroll to.

New Page Link Settings

• Button Link – enter the link of the page where you want the Header Button to redirect to.
• Link Target – option to select between opening the link in the same or a new page.

Trigger the Side Panel using any button

You can trigger the Side Panel using any button. For example, open the Button element settings modal and check with the Button action option.

Learn more