1

How to customize Afinar using theme settings

Muhammad Kausarul Alam

Last Update 2 年前

Theme Settings

In the theme settings, you have lots of customization options for header and footer in one place.


Header Settings

Here, you have the option to change header background color, mobile menu icon color, header button color, header button text, header text color, header button URL, and mobile menu background color.

Header Background Color

To change the header background color, navigate to theme settings and then click on the ‘Header Background Color’.

You can paste the color code or choose a color on your own.

After choosing a color, click anywhere and then hit the ‘Save Settings’ below.

The color is now applied.

Mobile Menu Icon Color

To change mobile menu icon color, you can paste the color code or choose from the color palette.

Afterwards, click anywhere and hit the ‘Save Settings’ below. The color is now applied.

Header Button Color

To change the header button color, you can paste the color code or choose from the color palette.

Afterward, click anywhere and hit the ‘Save Settings’ below.

The color is now applied.

Header Text Color

To change the header text color, you can paste the color code or choose from the color palette.

Afterward, click anywhere and hit the ‘Save Settings’ below.

The color is now applied.

Header Button URL

Place any URL here and your header button will redirect it upon clicked.

Place the URL and save it.

Mobile Menu Background Color

To change mobile menu background color, you can paste the color code or choose from the color palette.

Afterward, click anywhere and hit the ‘Save Settings’ below. The color is now applied.


Footer Settings

You get all the footer related settings at this place.

Background color

To change the footer background color, you can paste the color code or choose from the color palette.

Afterward, click anywhere and hit the ‘Save Settings’ below.

The color is now applied.

Company Description

If you like to change the company description, write your description here or you can paste it here.

Then click on the ‘Save Settings’ button.

Written descriptions will be shown in your websites footer.

Text Color

To change the footer text color, you can paste the color code or choose from the color palette.

Afterward, click anywhere and hit the ‘Save Settings’ below. The color is now applied.

Copyright Text

If you like to change the copyright text, write your description here or you can paste it here.

Then click on the ‘Save Settings’ button.

Written copyright descriptions will be shown in your copyright text box.


Preloader Settings

None likes to wait, but if one sees a preloader animation, he may consider waiting. If you like to occupy your visitor with the preloader then do it from here.

You can find the preloader settings in Affinar Settings -> Preloader Settings.

To use the preloader, first enable it.

Then choose the preloader type. There are multiple types, including waves, corners, points, etc. You can choose any of these.

Preloader Color

Define the color of the preloader from this option. Paste the color code or choose your desired color from the color palette.

Preloader Opacity

If you think your preloader is too solid, you can adjust the opacity.

Drag the slider forward and backward to adjust the opacity.

Preloader Text

Provide any message to your visitor while he waits with the preloader text option.

Write whatever you wish in the preloader text.

When you have fully customized your preloader, preview it and then hit the ‘Save Settings’ button.


White Label Settings

If you wish to make Afinar as your own you can do it. All you have to do is enable the White Label and then you will be able to change the theme name, version, description, author, author URL, Theme tags, etc.

By using this feature you will be able to hide which theme you are using and also be able to show your credibility.


Tracking Code

Ever wondered if you have multiple analytics for your website and you need to install multiple plugins to track each of those? Well, the tracking code option helps you to track multiple analytics such as Google Analytics, Search Console, Bing Webmaster, Bing Analytics, Facebook Pixel, hotjar etc.

All you have to do is put your tracker code in the specified field an hit ‘Save Settings’ button.


Code Injector

Some time you may need to do some extra, for example you need to style your header a little bit more. What do you do? Well, to make this process ease, code injector comes in the rescue.

If you want to insert some code to the header part, write or paste your code to the header code and it will be merged. Similarly if you want to insert some code to the footer part, write or paste the footer code. Finally hit the ‘Save Settings’ button and your code will be live.


Import/Export

If you are an agency or ever need to move your site to elsewhere, use this function. All of your settings and contents can be exported.

All you have to do is hit ‘Export’ button and all your data will be exported as zip on your pc. Please also keep in mind that this function is still in beta mode.

Was this article helpful?

0 out of 0 liked this article

Still need help? Message Us