How to customize fonts of page elements on your eshopbox site

Eshopbox Wiki for Store Owners

How to customize Fonts of page elements on your Eshopbox site

Category: Design

What you will learn here

What does customization of Fonts mean

How to customize Fonts of different page elements

Welcome to Eshopbox Wiki

A Eshopbox Wiki production. © All Rights Reserved at BoxBeat Technologies Pvt. Ltd.

1What does Customization of

Fonts mean


Fonts customization is the process of changing the color, size, style etc of the font selected by you

This can be applied on any page element according to your requirement

Font family consists of Font Font Size Font Color Font Weight Font Style

What does Customization of Fonts mean


2How to customize Fonts of

different page elements


Step 1:

Log in to your eshopbox site admin panel with your login id and password

Click on ‘Design’ tab and select ‘Store Design’ from drop down menu

You will be directed to the ‘Store design’ page


Store Design link

Design Tab


Step 2:

On your ‘Store Design’ page, select ‘Customize’ button to change the

Fonts of page elements


Store Design Page

Customize button


Step 4:

Now, you are on the home page of your eshopbox site where you can see

the design tool bar

Click on ‘Appearance’ editor


Design Tool BarAppearance Editor


Step 5:

On the Appearance editor, click on ‘Fonts, colors & sizes’ link


Appearance editor Fonts, colors & sizes


Step 6:

Now by clicking on ‘Scroll bar’, ‘select element’ to customize its Fonts


Select element

Scroll bar


Step 7:

On the Appearance editor, click on ‘Font’ and select the different Fonts

from the given options


Font

Arial


Step 7.1:

The appropriate font of selected element has been set

Now click on ‘Save changes’ to save the font of the element


Save changesSelected Font


Step 8: Next, click on ‘Font size’ from where you can drag the ‘slider’ to change

the font size of the element as per your need

On moving the slider, you can change the Font size in pixels and then

select the value which is shown as ‘Current Value’

You can select the value by clicking ‘Set’ tab


Font Size

Set TabSlider

Current Value


Step 8.1: The ‘font size value’ has been set successfully

Click on ‘Save changes’ to save the font size of the element


Save changes

Font size value


Step 9: To change the color of the font, click on ‘Font color’

Select the ‘color’ from ‘Color Palette' according to your choice and then

click on ‘Selector’ to set the color


Font Color

Selector

Color Palette


Step 9.1: The font color value has been generated and assigned to the specific page

element

Now click on ‘Save changes’ to save the font color of the element


Save changes

Font color value


Step 10: To change the ‘Font weight’ of the font, click on ‘Font Weight’

Select the appropriate ‘font weight’ according to your choice from the

given options


Font Weight

Bold


Step 10.1: Now the font weight has been set successfully

Click on ‘Save changes’ to save the font weight of the element


Save changes

Selected Font Weight


Step 11: To change the style of font, click on ‘Font Style’

Select the appropriate ‘Font Style’ from the given options


Font Style

Normal


Step 11.1: The appropriate font style has been selected

Save the changes made by you by clicking ‘Save Changes’ button


Save changes

Selected Font style


Step 12:

Now click on ‘Save & Exit’ button to save the changes

By clicking on ‘Save & Exit’ button, your Fonts will be changed as per the

selection made by you and you will be directed to the ‘Design’ page

Clicking on ‘X’ will undo all the changes you have made on Font

Click on ‘Save & Exit’ to successfully save your changes

You have successfully save all the changes


Save & Exit button

Design tool bar


Select the appropriate Fonts for each element from the multiple options

given

You can change Font size of an element ranging from 0 to 25 pixel (px)

Use the Fonts which are clearly visible and suitable on your storefront

Always check, the changes made by you in the real time on your

storefront

You can modify the Fonts of elements whenever required

Good to know


Wiki : A collection of illustrative presentations which will guide you in

a step by step manner to answer your store related queries.

Knowledgebase : A repository of detailed articles that provide you with in depth information about running your store and understanding the process involved.

Forum : An open community for Store owners to share and discuss everything about Eshopbox. Get real and practical solutions to most of your problems.

Blog : A rich source of Tips, Articles and Announcements that keep you

updated about the latest happening and techniques to enhance your art of selling online.

Ask a question : Find simple answers to complex questions through our experts. For any further assistance, mail us at [email protected]

For More Support


mailto:[email protected]

How to customize fonts of page elements on your eshopbox site

Self Improvement

Transcript of How to customize fonts of page elements on your eshopbox site