How to customize theme

Theme editor uses a totally different approach, called ‘Blocks’. Blocks are content elements that you add to the edit screen to create content layouts.

The visual editor is a content editor that allows you to easily create, edit, and format your content in a view similar to that of a word processor.

How to change header

A website header sits at the top of each page and serves a few very important purposes. This does more than provide a place for your logo; it is part of a consistent user experience that all good websites share.

The design of a header may differ from site to site, but the core features that determine how a site is navigated and experienced remains the same.

Our theme editor have various options to choose your Header design.

To change your Header you have to simply click on gear icon. Then click on “choose”. Then click on “Add block” which you want to be your new header.

How to change Banner Style

A banner, also known as web banner serves a different purpose than logo and header. It is normally used for informative or advertising purposes and come in different sizes and orientation.

Our theme editor have various options to choose your Banner design.

To change your Banner you have to simply click on gear icon as showing in video. Then click on choose. Then click on “Add block” which you want to be your new Banner.

How to change Text

You can enter text manually, or copy and paste text directly from another application. You can use the Theme Editor to add text to a Web page.

To change your Text, you have to simply click on the text you need to change. Then write or copy new text.

How to change Button Background color

You can easily change the Background color of a Button through Theme editor.

To change your Button Background, you have to simply click on the Button you need to change background color. Then click on bucket showing on top bar and then choose the color.

How to change Text Color

To change your Text Color, you have to simply click on the text you need to change color. Then click on paint brush showing on top bar and then choose the color.

 

How to change Background color

To change your Background Color, you have to simply click on the bucket as showing in video and then choose the color from top bar.

 

How to add New Section

To add new section to your web page you have to simply click on + icon. Then click on “choose”. Then click on “Add block” which you want to be your new section.

 

How to add Layer

Layers are the elements you can add over any element. This is useful when you want to add anything like Text/Image/Button over any element. This option gives you choice to add any layer element over the element and re-position it via drag & drop. You can also resize this element as well. This is also very easy and you can do it in just few clicks.

How to change Format of Text

To change your Format of text you have to simply click the text you want to format and choose the relevant option from the top bar.

 

How to change Font-Family of Text

To change your Font-Family you have to simply click text as you need to change Font-Family. Then click on Font-Family dropdown on top bar and then choose the Font-Family from dropdown.

 

How to change Font-Size of Text

To change your Font-Size you have to simply click on a paragraph that you would like to modify the text size for.
Choose from the list of styles from the drop down list on the top bar as showing in video.

 

How to give Letter-spacing to Text

To change your Letter-spacing you have to simply click text as you need to change Letter-spacing. Then click on Letter spacing dropdown on top bar and then choose the spacing from dropdown.

 

Options available in the formatting toolbar

 

 

1. Headings pull-down menu: allows you to change how the paragraph is formatted.

2. you can select any Font Family you like from the drop down.

3. you can select any font size you like from the drop down.

4. Highlight the text where you wish to change the space between the letters and go to the Letter Space field from the Theme editing toolbar.

5. Highlight the text you wish to change or if it is the whole content of the text box, select it and click the Line heightfrom the Theme editing toolbar.

6. Select the text you want bold, then click the “Bold” button.

7. Select the text you want Italic, then click the “Italic” button.

8. Both text and images can be aligned to left.

9. Both text and images can be aligned to Center.

10. Both text and images can be aligned to Right.

11. Justified alignment can only be applied to text and will align both sides of the text.

12. Numbered lists are useful when you want to group a number of items that need to appear in a particular order. They are perfectly suited for lists of procedures or step-by-step instructions.

13. Each paragraph begins with an expression that includes a number or letter and a separator such as a period or parenthesis.

14. To change text color you must first highlight a section of Text.Clicking on the down arrow next to the text color button will display a color selector. While the color selector is open, the arrow will point up. You can click on it to close the selector without selecting a color:

 

 

Selecting a color will apply that color to the selected text or you can add color code in input box.

15. Show or Hide the text/image/button

16.You can click and hold and then drag it to rearrange its position on the webpage. You can move it down and upwards.

As you see this is very easy to use Theme editor, you can change any element just via clicking on the element or by clicking on the icons which you see when you hover on these elements. On the Top right you can see 2 buttons “Save” and “Publish”, these both are used to save the work you have done. Only difference between these 2 buttons is when you click on “Save” it only saves your work which you can customize later, and click on “Publish” will Publish the theme to your store front. Every time you save your work will be listed into your Hipkart store admin. Click on “Store” from left menu and this will open Themes page, where you can see all themes you have customized and clicking on “Customize” will openup your customized work again for you to customize.