Skip to content

Customizer (Theme option)

Theme Option or Customizer can be accessed in two ways. Through the Kata Control Panel Bar or navigating to WordPress’s default menu > Appearance > Customize

 

The image below showcases the general overview of the page, which consists of options (left side) and the preview section (right). It is visually similar to WordPress’s default Customizer.

 

 

 

You can change the general settings of your website from this page and preview the changes made in real-time on the right side of the screen.

Note: Once you’re done changing your settings, don’t forget to click on Publish to apply the changes. In case no changes have been made, this button will appear grayed out.

In addition to this, you can make changes to your website’s theme through the options that are readily available such as:

Site Identity

Here you can change your site title and tagline. As you may know, these two fields will be displayed in your visitor’s browser tab, and their function is to outline your website’s identity in a few short phrases.

 

Additionally, you can determine the layout of the website’s pages (Boxed or Wide) from here. If the option is set to Wide, the webpage’s container will fill the user’s whole screen, and if set on Boxed, the container’s width would be limited.

If you need your website to be responsive, make sure to turn on the next option.

The next option is related to your website’s icon. The icon can be seen in the browser tab, bookmark bar, and mobile apps. Upload your desired site icon.

Homepage Setting

You can choose what’s displayed on the homepage of your site. It can be your posts in reverse chronological order (classic blog), or a fixed/static page. To set a static homepage, you first need to create two Pages. One will become the homepage, and the other will be where your posts are displayed.

Header

In this part, you can access the header builder and edit it.

Preloader

You can set up a great looking preloader until your page is fully loaded. After activating it, several options appear that allow you to customize it using the Styler.

It’s worth pointing out that you can view the preloader and configure it by activating Preloader Test Mode, and once you’re done, make sure to disable Preloader Test Mode.

Container

The container’s width in different screen sizes can be adjusted from here. Kata allows for 6 different screen sizes for different devices:

  • Desktop (1920px)
  • Laptop (1366px)
  • Tablet Landscape (1024px)
  • Tablet (768px)
  • Mobile (480px)
  • Small Mobile (320px)

You can set your custom width for the container in the desktop, but for laptop and tablet landscape, we would recommend 1280px and 960px. Also, for tablet, mobile, and small mobile sizes, we would recommend 78%, 90%, and 88% in order. Though these values are only suggestions and you are free to choose your own values.

 

 

Blog

In blog you can easily edit your single posts and archives. Also, you can add or remove their meta media.


Page

You can configure general WordPress page settings from here. Options such as Breadcrumb, Page Title, and Sidebar can be configured.

 

 

  • The ability to show or hide page title and style it using the Styler in the Page Title tab
  • The ability to show or hide breadcrumbs in the Breadcrumbs tab
  • The ability to show or hide and change the position of the sidebar in the sidebar tab

You can manage pages with more details by opening them separately using Elementor and going to the Page Option in the settings.

Footer

In this section of the customizer, you can go to the footer editor and edit.

 

 

Add Google Fonts

Also, in Kata you can add your preferred font from Google, only by selecting it and adding it to your website.

 

Styling & Typography

This section of Customizer allows you to change the main color or most frequent color patterns in the theme and styling main tags using the Styler. You can easily implement unique typography for your website from here. The tags available in this section include:

  • Body
  • All Heading
  • Heading 1
  • Heading 2
  • Heading 3
  • Heading 4
  • Heading 5
  • Heading 6
  • Paragraph (p tag)
  • Links (a tag)
  • Button Element

In typography you can design the style of headings, body and menu globally.

Menu

You can manage your website’s menu from here. All menus are listed in this section; you’re free to add items to the menu or change their order and add top-level pages automatically to the menus.

Widgets

This section allows you to manage and configure your website’s widgets.

Scroll

You can view the options related to Scroll from here.

Three options are available:

Back to Top: Can be disabled or enabled (also separately on mobile) and styling from the Styler.

Smooth Scroll: Enable or disable the feature.

Scroll Bar: Enable or disable the feature and also customize it using the Styler.

API

This section currently has only one option, and that is Google Maps. You can set Google Map’s API Key from here.

GDPR

You can set your very own GDPR module from here. All details within the module, including text and styling options, are configurable.

White Labeling

Kata also provides white labeling. This means that you can replace the default texts and logos with your own to fully personalize your website according to your brand. There is also the ability to hide special Kata post types and Admin panel items. You can even replace WordPress’s logo with your own logo on the login page. All these are customizable from here.

Maintenance Mode

Another feature of Kata is the maintenance mode, using which you can redirect the users to a page that you have not fully designed and is not performable yet.

Custom Codes

You are free to add custom codes before the head and body tag. You can add your favorite scripts here to add new functionality to your WordPress. This feature is usually used to add codes for Google Analytics or other third-party services.

Additional CSS

Even though the comprehensive Styler makes using CSS obsolete, but we still have provided the option for those who want to enter their own CSS code manually.