Back to contents

Kava theme. Customizer overview

useful information

This tutorial uncovers Kava theme features which you can adjust in Customizer. Keep reading this tutorial to overview the Customizer inside of Kava theme.

Customizer is a built-in editor available within your theme, that helps you perform plenty of website-transforming tasks, using a very simple interface. Kava theme has lots of customization options, and its customizer stays on guard of your site managing capabilities. It is very convenient to use, and while working with it you see all the changes as if applied on a live desktop, tablet or mobile without actually applying them.

How to access Customizer

Step 1 — Firstly, log in to the WordPress Dashboard and navigate to the Appearance > Customize section. You’ll be immediately taken to the theme’s Customizer.

customizer in the Wp dashboard

Step 2 — Another way to access customizer right from your website’s frontend is to open the page you want to edit (e.g., your website’s blog page) and then click the Customize option located on the top panel.

customize option on the frontend

Customization of the basic website’s appearance settings

Site Identity

Here you can select a logo of your site, change the title and tagline. In this section, you can choose whether you need to use Show tagline on the top panel, Show ToTop button, Show page preloader options, and then tick them to enable the ones needed.

site identity settings in the customizer

General Site Settings

Here you can set a Favicon which will represent your site and will adorn the tab of the site in your browser.

general site settings

Also, you can enable or disable Breadcrumbs, choose the area where breadcrumbs are to be placed and select the breadcrumbs path (full or minified).

In this block, you can as well choose whether to show Social links in header and footer.

Moreover, you can change Page layout and choose how the container should be shown – full width or boxed, and select a sidebar width.

Color, background and typography customization

Colors

Here you can set up the body background color of the template. It is fun to hold the mouse button and drag to various colors and see the site view immediately!

colors block in the customizer

Background Image

This feature provides an opportunity to set a background image to the body template.

background image block

Color scheme

This feature allows you to configure the elements color scheme on your site: here you can set the color of accents, text, links, and headings. You can play with colors and change your site’s style, relying on your aesthetic sense.

Typography

Here you can configure any typographical element of your site: the body text, H1-H6 headings, logo text, menu, breadcrumbs, and buttons fonts.

There are a lot of fonts to choose from. Additionally, you can set the typography properties, such as font style, weight, and size, etc.

typography settings

Default Header and Footer customization

In case you stick to using the default header and footer provided by Kava theme rather than the header and footer templates available in JetThemeCore plugin library, Customizer is the right place to manage them.

Header & Footer

header styles

Here you can set a background color to use for your header, or set the background image.
Also, you can specify the background image properties, such as background-repeat, position, and attachment. Furthermore, you can enable a top panel and set a background color for it.

footer customization

Please, pay attention, that Kava theme is meant to be used with Elementor page builder, so it doesn’t provide as many stylization settings for headers and footers as other WordPress themes do.

However, with JetThemeCore plugin provided in Crocoblock subscription, you become able to build any header and footer templates using Elementor and any widgets you need.

Menus customization

With Customizer, you can create, manage and delete the menus on your website, set them to different locations, reorder the menu items, and even manage the submenus.

The options are very similar to the ones provided in the WordPress Dashboard, in the Appearance > Menus block, however, using Customizer, you can always see the menu on the frontend and check how it would actually look on your site.

Menus

Here you can change the settings of your current menu or create a new one. Feel free to add a new item to the existing menu or delete the item, rename it, or reorder the items if needed.

menus block in the customizer

Also, you can choose the location of the menu. It can be placed inside the header, or you can display it in the footer, or in the social area.

menu locations setting

If you don`t need the menu and want to create a new one – you can delete it in this section.

Widgets

Kava theme has 2 widget areas: the first one is called Sidebar and you can view it on the Blog page.

sidebar widget areas

The second one is a sidebar that is shown only on the Shop page template. Feel free to navigate to the pages on your site while using the Customizer to view and edit the widgets displayed inside these widget areas.

useful informationNOTE!
In case you’re using the Canvas or Elementor Fullwidth page layouts, the sidebars won’t be applied to such pages, especially when they are built with Elementor.

Consider creating a sidebar using the columns structure right on Elementor editor’s page instead of using a sidebar from Kava theme in case you’re using Elementor for building your website’s pages, including the Blog and Single Post pages.

Home Page & Blog Page Customization

In this block, you can easily set your custom homepage or blog posts page instead of the default ones.

Homepage settings

Here you can set the homepage to use on your site. The homepage can display a static page or your latest posts on the Archive page.

homepage settings

Tick the needed option to display a static page or your latest posts on your homepage.

  • If you’ve selected A static page option, you can now set the page you want to become your homepage from the Homepage dropdown. The same should be done regarding the Posts page.
  • If you want your homepage to display your latest posts, you should tick Your latest posts option.

After that, you can go back to the Customizer and here access Blog settings, where you can easily change the blog page’s layout, style, define if there should be a sidebar, etc.

blog settings

WooCommerce

In case you have WooCommerce products on your site, there are special settings for the Shop page and product pages in the Customizer.

Make sure to open the Shop page in order to access its customization settings in the Customizer.

Here you can:

  • set a store notice;
  • customize the product catalog;
  • change the width of product images and thumbnails.

Additionally, the Checkout option will let you change the appearance of the WooCommerce checkout.

Additional CSS

This section allows you to add custom CSS and instantly see how your changes affect your site. The live preview allows you to work quickly without the need to refresh the page.

Hope this tutorial is going to help you customize Kava theme.