# General

The Theme Options section allows you to set up the general styling of the website visually. In the WordPress dashboard menu, go to **Theme Options**. Here you can set up the most essential options for your theme.

The first tab in Theme Options is General Settings. Let's have a look at the available options.

![](/files/LNW3oyPis8BRzrQSAvoq)

## Logo

You can configure the logo settings here.&#x20;

Upload a logo file on the **Logo** and **Dark Logo** fields.

![](/files/-MVWjG4ScIVIQFLo3AEr)

{% hint style="info" %}
Which logo appears on the website depends on the style of the header.

The Header Style 1, 3, 6, 9 and 11 uses the logo under the **Logo** fiel&#x64;**.**

The Header Style  2, 4, 5, 7, 8, 10 and 12 displays the **Dark Logo.**

To change the header style go to **Header > Main > Header Style**
{% endhint %}

{% hint style="info" %}
On the mobile header, the **Dark Logo** appears.
{% endhint %}

&#x20;&#x20;

Set **Logo width & Logo height** in px respectively. (If the **Logo width** and **Logo height** are not indicated, the uploaded logo image will be displayed in its original size)

![](/files/-MVWjQvtviEEAX2cQEnB)

&#x20;Through the **Logo indent** option, you can set the indentations for the logo:

![](/files/-MV6Cc5PRPesTGtcqR5V)

![](/files/-MV6CinIqtyTu2tyOPfp)

## **Style Settings**

Styling allows you to set up the color skin of your website

&#x20;Enable or Disable the preloader on your website by turning on/off the **Enable preloader** option.

A **preloader** is what you see on some sites before the main content of the web page is loaded.

![](/files/-MV6CsRAZ6Y8lcvU_Ax3)

The preloader in the theme  looks like this:&#x20;

![](/files/-MVLes1z_owDqSL4xyzg)

**Skin** setting allows you to set up the color skin of your website. There are four predefined color schemes:  Default, Turquoise, Dark Denim, and Artic and Black.

![](/files/-MV6GgnsoksclwqOD1D0)

If you select the **Custom colors** option you will be able to set your own color scheme.

![](/files/-MUt1JmLHaHFSlwEQmV2)

**Custom Base Color** changes the color of the following elements: **menu items text color**, **top bar background color**, **sub-menu background color**,&#x20;

![](/files/-MUxtLF75wvD6zanIphk)

**footer background color,** **mobile menu background color**:&#x20;

![](/files/-MUxvApGXIL6QoWYfQkY)

**some icons color**, **button background-color**

![](/files/-MUxvhmZ-F7zxo2ZMnNS)

**Custom Secondary Color** affects to colors of different elements like a **link on hover**, **footer link color, mega menu icons color,**

![](/files/-MUxw__xYIF0zEFAxz50)

**Custom Third Color** uses as the **Call To action background color**, **highlights color under the headings**, **icons color on the footer, buttons color on hover**&#x20;

![](/files/-MUxxL5qsesoXp2Z1REI)

Also, you can display the website as the boxed style by enabling the **Boxed Layout** feature.&#x20;

![](/files/-MV6I3fQ1jZmck3J6Bpw)

&#x20;As background image of boxed layout select one of the provided images or upload your own image.&#x20;

![](/files/-MVOyPf0qQhn-AMb6hgk)

## Google API

Google API section allows to set up Google Maps and Google reCAPTCHA services.

### Google Maps API key &#x20;

{% hint style="info" %}
Follow to <https://cloud.google.com/maps-platform/> and obtain the Google Maps API key and enter into the relevant field. To correctly display the map on the website the **Maps JavaScript API** should be enabled.&#x20;
{% endhint %}

![](/files/-MUt3dL9u_YeCzRttTqd)

![](/files/-MVpk0V9PNSDOLNEdPFY)

### Google Recaptcha API Settings

![](/files/-MUt3nFAGxUoCCLS33q4)

{% hint style="info" %}
To obtain the keys for Google reCAPTCHA please follow this link: <https://www.google.com/u/0/recaptcha/admin/create>
{% endhint %}

Here is an example of how correctly fill the page fields:

![](/files/-MVZMDQagZiJA0QeO40E)

{% hint style="info" %}
All the reCAPTCHA types are compatible with the theme.
{% endhint %}

The reCAPTCHA will be displayed on the registration form for events on the single Event page

![](/files/-MVZoUZ6LFD_pGB7Misi)

## Special Pages

Settings for Special Pages allows you replace default 404 page with custom created pages with Page builders.

<figure><img src="/files/4iJfxVu873gHpsahwdE8" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.stylemixthemes.com/consulting-theme-documentation/theme-options/theme-customization.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
