1 Presets

Use this option to choose a predesigned style for the blog posts.

2 Background

Use this to apply a preferred colour, gradient, or image to the content background.

TemplateToaster features the following additional background options to choose from-

Colour Picker-

TemplateToaster provides a colour picker to choose a background color. Here is the full description of it.

Custom Gradient-
You can create custom gradients with preferred angle, colour, and offset choices. Also lets you save the gradients as well. See this for more information about creating and saving the custom gradients.

Browse Images-
Use this option to browse the images and even apply an image in the content background. TemplateToaster presents an inbuilt stock of free images to use. You can also select an image from the stock, or browse your custom images.

You can even edit the browsed images. TemplateToaster has an image editor with various editing options to customize the browsed images. For details, see this.

3 Border

This option lets you mark the border around the content and modify its properties such as Style, Thickness, Radius and Color. See this to know more.

4 Margin

You can specify the margin of the content for all the sides i.e. top, bottom, left, and right.

5 Padding

The option is to specify the top, bottom, left, and right padding of the content.

6 Texture

You can use this to apply the texture to the content background.

More-
With the help of this option you can customize the transparency of texture with “More”. Click Here for more details.

7 Effects

Use this to add an effect to the content background.

More-
You can customize the transparency of the effect using “More”. Click Here for more details.

8 Shadow

Lets you apply a shadow effect to the content background.

More-
With the “More” option, you can even customize the colour, angle, blur, and distance of the shadow effect. Click Here for more details.

9 Background

You can also apply a preferred colour, image, or gradient in the background. TemplateToaster provides predesigned gradients and stock images for free. Also, you can create the custom gradients or browse your own images.

10 Border

Marks a border for the post which you can customize too. For customizing the border, you can have Style, Thickness, Radius (of edges), and Color options.

11 Margin

Use this option to specify the margins for all side i.e. Top, Bottom, Left and Right.

12 Padding

Lets you mention the padding from all the sides i.e. Top, Bottom, Left and Right.

13 Texture

You can apply a texture to the background of the post using this option.

More-
Also you can customize the transparency of texture with the “More” option.

14 Effects

Lets you apply an effect to the background of the post. You can choose from different option as shown:

More-
Lets you customize the transparency of the effect using the “More” option.

15 Shadow

Use a shadow effect to the background of the post.

More-
With the “More”, you can even customize the colour, angle, blur, and distance of the shadow effect.

16 Product Title

Use the option to set the typography of Product and Post Title Containers .

17 Content

You can also set Customization of  the Content by specifying different properties like Background, Border, List layout, Typography, and much more as shown below:

18 Columns

Lets you specify the number of product columns on a single page.

19 Featured Posts

Use it to show/hide the Featured Posts as desired.

20 Metadata

Specifies various properties as follows:

Show Metadata- To Show/Hide Metadata
Typography- Sets the typography of Metadata
Title- Defines the text style of Post Title
Title Hover- Text styling of Title on hover
Icon- Contains the icons for Author, Date, Post Headline

WordPress is one of the most popular and widely used CMS on TemplateToaster. Owing to the features available for WordPress, you can easily add the content of your website to your theme. Let’s have a look at each option of the content tab:

1 Page Title

Lets the user choose whether to show or hide the Page Title. By default, this is checked.

2 Heading

This allows you to displays a list of all the headings from h1 to h6 to choose and add to the title of the page for user convenience.

3 Typography

Lets you define the typography of the Page Title by specifying various options like Font Family, Style, Color, Margin and many more as shown below:

Use the “More” option to let the user to customize Text Formats and Effects for the Page Title.

4 Background

This helps the user to apply a preferred colour, gradient, or image to the background of the content of your WordPress theme. TemplateToaster gives the following options for designing the content of your WordPress themes in a professional style.

Color picker-
You can use the color picker for applying background color as shown below:

Custom Gradient-
You can use this option to apply custom gradient in the background. And you can choose the desired angle, color, and offset choices for creating your own gradient style. You can save the gradient and use it later.

Browse Images-
Using this feature you can apply an image in the background of the content. TemplateToaster has an inbuilt stock of free images for you to choose from. Also you can even browse your custom images.

You can edit the browsed images as TemplateToaster provides an image editor with many editing options to customize the browsed images.

5 Border

Use this option to mark the border around the content area. You can use it to set a preferred style, thickness, radius of edges and colour for the content border.

6 Margin

Lets you mention the margin for each side of the content area.

7 Padding

Use it to specify the padding for each side of the content area.

8 Add a Row

Use this to add a row in the content area.

9 Delete a Row

This option will delete a row from the content area.

10 Columns

Allows you to select how many columns to keep in a single row.

11 Background

This feature lets you change the background of the chosen row of the content area. You can apply a preferred color, gradient, or image to the background of a row.

12 Border

Use this to customize the border around the selected row of the content area. You can set a preferred style, thickness, radius of edges, and color for the border of the selected row.

13 Shadow

This option lets you apply a shadow effect on the border of the selected row.

14 Margin

Use this option to specify the margin for each side of the row.

15 Padding

Lets you specify the padding for each side of the row.

16 Add a Cell

Lets you adds a cell in the row.

17 Delete a Cell

Lets you delete a cell from the row.

18 Width

Use this option to change the width of a selected cell. You can change the width of an individual cell according to the need for your design. To change the width, just select the cell and click on this option.

19 Background

Lets you change the background of a selected cell for the content row. You can apply a preferred color, gradient, or image to the background of a cell.

20 Border

You can use this option to mark a border around the selected cell of a row. And, you can also set a preferred  style, thickness, radius of edges, and colour for it.

21 Margin

Lets you specify the margin for each side of a cell.

22 Padding

The option lets you specify the padding of each side of a cell.

23 Shadow

You can use this to apply a shadow effect in the content background of a selected cell.

More-
With the “More”, you can even customize the color, angle, blur, and distance of the shadow effect. Click Here for more details.

TemplateToaster is a web building software to design themes. templates. and websites just the way you want. It supports various Content Management Systems which include WordPress, Joomla, Drupal, Magento, Prestashop, OpenCart, VirtueMart, WooCommerce, and Blogger. Hence, the Content Tab provides context-specific options. That is these options help you enhance the look and feel of the content on the CMS. Choose the context from the following list to learn about various options available in Content Tab:

• WordPress
• Joomla
• Drupal
• Blogger
• HTML
• WooCommerce
• Magento
• Opencart
• Prestashop
• Virtuemart

1 Presets

The Preset options provides you a set of predefined layouts to choose and add to the sidebar menu.

 

2 Hide/Show Sidebar Menu

By default, the sidebar menu is active. If you would like to hide it, just uncheck this option and vice-versa.

3 Add/Edit Menu Item

Gives you the option to select the page(s) on which you want to or don’t want to show the sidebar menu.

4 Container Properties

Use this option to modify the properties of a submenu container like Margin, Padding, Border and Shadow.

5 Container Background

Lets you apply a preferred colour, gradient, or image to the background of the menu.

TemplateToaster features the following additional background options-

Colour Picker-
TemplateToaster gives you a colour picker to choose the background colour from. Here are the details of the Color Picker.

Custom Gradient-

Use this option to create custom gradients with preferred angle, colour, and offset choices. You can also save the gradients as well and use it later. See this for more information about creating and saving the custom gradients.

Browse Images-

You can also apply an image in the background of the menu. TemplateToaster has an inbuilt stock of free images which you can use. You can select an image from the stock, or browse your custom images also.

You can also edit the browsed images as needed. The TemplateToaster has an image editor with many editing options to customize the browsed images as needed. For details, see this.

6 Header Properties

Lets you customize the look and feel of the Sidebar Menu’s header. You can set the following properties that are available with header as shown below:

Icon-
You can use an icon with the header. When you click this option, you will see a small stock of icons, which are mostly used in the websites. But, if you have your custom icons, you can also browse those icons and easily add them. You can also find the option to change the colour of the icon as given below:

Margin-
This option specifies the margin of the header for all four sides.

Padding-
Lets you set the padding of the header from all sides i.e. top, bottom, left, right and more.

Heading Type-
Use this to select a preferred heading type for the header of the sidebar menu (H1,H2,….H6). You can also select None if you do not want to add any header type.

7 Header Background

Use this option to change the background of the sidebar menu’s header. You can choose a preferred colour, gradient, or image to apply on the background of the menu.

TemplateToaster has following options to modify the background-

Colour Picker-
You can use the colour picker to choose a color from anywhere in the template/ theme or website. Here is the full description of the Colour Picker.

Custom Gradient-

You can create custom gradients with a preferred angle, colour and offset choices. You can save the gradients as well and use it anytime later. See this for more information about creating and saving custom gradients.

Browse Images-

TemplateToaster has an inbuilt stock of free images to browse and select from. You can select an image from the stock, or browse your custom images and easily add them.

You can even edit the browsed images. TemplateToaster has an image editor with many editing options to customize the browsed images. For details, see this.

8 Header Border

Lets you customize the border of the menu’s header. You can select a preferred Style of the border, decide its Thickness, set the Radius of the edges, and choose the colour you want.

More-
The “More” lets you explore different options for designing interactive borders. You can set different values of Thickness and Radius for the individual side and edge of the border as shown below.

9 Header Height

Use this to specify the height of the menu’s header.

More-
Use the “More” option to specify custom height of the menu’s header.

10 Header Typography

Use this to define the typography of the sidebar menu’s header. The typography includes options to choose the font, style, font size, font colour, font effect, text alignment and text decoration.

More-

With “More” option, you can open all the typography options in a single window as shown below.:

11 Header Texture

Use this to apply a texture to the background of the menu’s header.

More-
You can customize the transparency of texture with the “More” option.

12 Header Effects

This option lets you apply an effect on the background.

More-
You can customize the transparency of the effect with “More”.

13 Header Shadow

This is to apply a shadow effect on the header background.

More-
With the “More” option you can even customize the color, angle, blur, and distance of the shadow effect as shown below:

14 Menu Button Properties

This option lets you set the properties of the menu button. You can use it to apply separator between menu buttons, change its height, width, margin padding, specify content margin and more.

15 Menu Button Background

Use this option to change the background of the Menu Buttons. You can separately apply the background for different states of the menu buttons. Such as Normal state, Hover state, and Active State.

16 Menu Button Border

Lets you design the border of the Menu Button. This option expands a drop down list of options to design the border for different states of a menu button, like Normal, Hover and Active. So, you can differently design the border of a menu button for these three states and give it a whole new look and feel.

17 Menu Button Typography

You can define the typography for the menu buttons. Thus you can set different text styles for the menu button in Active, Normal, and Hover states.

18 Expand (Submenu)

Use this option to expand the submenu. It gives you two choices to expand the submenu Horizontally and Vertically as follows:

Change the way the menu opens up when you hover. If you select this option, the menu will open up in horizontal direction, as shown below:

If you select this option, the menu will open up in a vertical direction, as shown below.

19 Open (Submenu) On

Use this option to specify whether the menu will open on click or on hover.

20 Submenu Layout

Gets active only when you select to expand the menu horizontally. With this, you can choose Mega, Vertical, or Horizontal style for the submenu layout.

21 Submenu Container

Specifies the properties of the submenu container. You can change the background, border, and apply the shadow effect of the submenu container.

22 Submenu Item

Use this to specify the properties of the submenu items such as height, width, background, border, shadow, and more.

This tab will display only if you have the sidebar enabled for your design. The name of the widget tab changes according to the choice made for the CMS as follows:

• Widgets:- WordPress, Blogger, Magento, WooCommerce, OpenCart, Prestashop
• Modules:- Joomla
• Block :- Drupal, HTML

1. Presets

The ‘preset’ option displays a predesigned set of styles for widgets/modules/ blocks. You can choose a predesigned widget/module/block and modify its look as per need of the template, theme or website design.

2 Container Properties

You can customize the container of the widget/module/block according to your template/theme or website.

Margin :
Use this option to specify the margin of a container for all the sides i.e. top, bottom, left and right.

Padding:
Lets you specify the padding of the container from all the sides i.e. top, bottom, left and right.

Border:
You can use this option to customize the border of a widget/module/block container as show below:

Shadow:
This lets you apply a shadow effect to the container. Click Here for more details.

3 Container Background

Use this to apply a preferred colour, gradient, or image to the container background.

TemplateToaster provides the following additional background options-

Colour picker-
TemplateToaster gives you a colour picker to choose a background colour. Here is the full detail of a colour picker shown below:

Custom Gradient-
You can create custom gradients with preferred angle, color and offset choices. You can save the gradients as well for future use. See this for more information about creating and saving the custom gradients.

Browse Images-
This option lets you apply an image in the background of a Widget/Module/Block container. TemplateToaster has an inbuilt stock of free images to choose from. You can browse and even edit those custom images as needed.

As shown below, TemplateToaster has an image editor with a series of edit options to customize the browsed images. For details, see this.

4 Header Properties

This option lets you set the properties of the Widget header/Module header/Block header as per your preference. TemplateToaster allows to change following properties of a Widget/Module/Block header as shown below:

Show Header-
If you check to select the “Show Header” option it will display the header of Module/Widget/Block.

Icons-
This option will display an icon with the Widget/Module/Block header. For this, you can even browse your own icons.

Margin-
Sets the margin of the header for all the sides i.e. top, bottom, left and right.

Padding-
Specifies the padding of the header from all the sides i.e. top, bottom, left and right.

Heading Type-
To choose the desired heading type (H1, H2….H6) for the Widget/Module/Block header.

5. Header Background

You can select the preferred colour, gradient, or image for the header background with this option as shown below.

In addition, TemplateToaster features following additional background options:

Colour picker-
The TemplateToaster gives you a colour picker option to choose a background colour for the header of a Widget/Block/Module. Here is the full detail.

Custom Gradient-
You can also create custom gradients with a preferred angle, color and offset choices. You can save these gradients as well to use later on. See this for more information on how to create and save the custom gradients.

Browse Images-
Easily apply an image in the background of a Widget/Module/Block header. TemplateToaster has an inbuilt stock of free images that you can quickly add to the background. You can even browse and edit your customized images as required.

As shown below, TemplateToaster has an image editor with many editing options to customize the browsed images. For details, see this.

6. Texture

Use this to apply a texture to the background of a Widget/Module/Block header.

More-
You can customize the transparency of a texture using the “More” option. Click Here for more details.

7. Effects

Lets you apply an effect on the sidebar background.

More-
You can customize the transparency of the effect with “More”. Click Here for more details.

8. Shadow

The option lets you apply a shadow effect to the menu background.

More-
With “More”, you can even customize the colour, angle, blur, and distance of the shadow effect. Click Here for more details.

9. Border

Lets you customize the border of the header. You can change the style of border, thickness of border, radius of the border corners and border colour. See this to know more about designing and customizing the border.

10. Height

Lets you mention the height of the header.

More-
The “More” option is to specify a custom height.

11. Typography

You can change the typography of the Widget/Module/Block header. So you can choose the preferred font, style, font size, font colour, font effect, text alignment and text direction for the Widget/Module/Block header.

More-
This option opens up all the typography options in a single window as shown below.

12. Content Properties

Use this to set the content properties of Widget/Module/Block such as Margin, Padding and Border.

13. Background

Use this to change the background of the content of the Widget/Module/Block.

14. Add Block in Sidebar 1
Manages the number of custom blocks in the first sidebar. You can add as many blocks in the sidebar as you need.

Add-
To add a block, just write the name of the block in the text box and click on the “Add” option.

Delete-
You can delete the block(s) if required. For this, select a block from the drop down menu and click on the “Delete”.

Note: This option is provided when your template type is “WordPress” or “HTML”.

15. Add Block in Sidebar 2
Manages the number of custom blocks in the second sidebar. You can add as many blocks  in the sidebar as you need.

Add-
To add a block, just write the name of the block in the text box and click on the “Add”.

Delete-
You can delete the block(s) if required. For this, select a block from the drop down menu and press “Delete”.

Note: This option is provided when your template type is “WordPress” or “HTML”.

1. Layout

The Layout option provides you various placement options for Sidebar. You can choose from the given layout choices as below.

2. Background

Lets you choose a preferred colour, gradient, or image to apply to the sidebar background. TemplateToaster features the following advanced background options –

Colour Picker-
TemplateToaster gives you a colour picker option to choose a background colour. Here is the full description.

Custom Gradient-
You can create custom gradients with a preferred angle, color, and offset choices. You can save the gradients as well for future use. See this for more information about creating and saving custom gradients.

Browse Images-
You can apply an image in the background of the sidebar(s). TemplateToaster has an inbuilt stock of free images. You can also browse your custom images.

Moreover, you can even edit the browsed image(s). TemplateToaster provides an image editor with a dozen of editing options to customize the browsed images. For details, see this.

3. Border

Use this option to customize the border of the sidebar (s) by specifying Style, Thickness, Radius and Color .

More –
You need to click on the “More” for more border customization options. See this for details.

4. Width

Use this option to change the width of the sidebar(s).

Note: You can set the custom width in pixels if you choose Fixed width layout for your template/theme or website. Otherwise, if you select the Fluid width layout, you can set custom width in percentage.

More –
You can use this option to specify custom width by clicking “More”.

5. Margin

On clicking this option, you can set the margin of the sidebar(s) for all sides (i.e. top, bottom, left and right).

More –
You can specify the custom margins using the “More”.

6. Padding

This option lets you specify the padding of the sidebar(s) from all the sides i.e. top, bottom, left and right. Padding specifies the white space ( or distance) between the content and the border of the element.

More –
You can specify custom padding by clicking on the “More” option.

7. Texture

Use this option to apply the texture to the sidebar background.

More-
Use this to customize the transparency of texture using “More”. Click Here for more details.

8. Effects

You can use this to apply an effect to the sidebar background.

More –
You can also customize the transparency of the effect with help of “More”. Click Here for details.

9. Shadow

This is to apply a shadow effect to the sidebar background.

More-
The option will customize the colour, angle, blur, and distance of the shadow effect. Click Here for more details.

10. 100% Height

100% height specifies that the height of the sidebar will be equal to the height of the content.

11. Equal To Content

Equal to content means that the height of the sidebar will be equal to sidebar’s content (Widgets, Modules etc.).

1 Presets

You can find the pre-designed styles of the menu. You can also select the predesigned menu options, and customize its looks as needed for the template/theme or website design.

2 Edit Menu

Use this option to select the pages you want to show in the menu. Simply untick the pages you do not want to show.

3. Menu Position

Use this option to open a ‘Sticky Menu’ option s shown below:

Sticky Menu –
A sticky menu doesn’t disappear when you scroll down the page, unlike normal menu. But it sticks to the top of the page as you scroll down the page. Hence, a sticky menu is quick to navigate for the users. TemplateToaster facilitates you to create such a sticky menu for your template/website.

4. Background

TemplateToaster provides you with various preferences to change and customize the colour, gradient, or image to apply the menu background of the template/theme or website design. You can find following advanced background options:

Color Picker-
TemplateToaster provides you with a Colour Picker to choose the colour as needed. Here is the full description of the colour picker.

Custom Gradient-
You can create custom gradients with the preferred angle, color and offset choices. You can save the gradients as well for later use. See this for detailed information about creating and saving custom gradients.

Browse Images-
Use this option to apply images to the background of the menu. TemplateToaster has an inbuilt stock of free images. You can also browse your custom images as needed.

Thus you can easily edit the browsed images. TemplateToaster provides an image editor with a series of edit options to customize the browsed images. For detailed information, see this.

5. Height

Use this option to specify the height of the menu. You can choose the height from given below values:

More –
The “More” option allows you to specify a custom height on your own.

6. Width

The option changes the width of the menu with a single click. Here are the three option available for specifying the width of the menu as:

Full Width – The option makes the width of menu equal to the width of the browser window.

Equal To Page Width – You can use this option to set the width of menu equal to the width of the page. This option is activated by default.

Custom Width – Use this to specify a custom width of the menu according to your need.

Note: If you have chosen Fixed Width Layout for your template/website, you can set custom width in pixels. Otherwise, if you have chosen Fluid Width Layout, you can set custom width in percentage.

7. Border

Use this option to customize the border of the menu by specifying Style, Thickness, Radius and Color of the border.

More –
The ‘More’ option provides you with even more border customization options. See this for details.

8. Margin

This option lets you specify the margin of the menu for all the sides (i.e. top, bottom, left and right).

More –
Use the ‘More’ option to specify the custom margins.

9. Padding

The Padding option lets you specify the white space (typically the distance) between the content and the border of the element. You can choose to set it as Top, Bottom, Left, and, Right padding of the menu using this option.

More –
Use the ‘More’ option to specify the custom padding. Simply click on the ‘More’ option.

10 Texture

Use this option to add texture to the menu background.

More –
You can customize the transparency of texture with “More”. Here are the more details.

11 Effects

Use this option to apply an effect on the menu background.

More –
Use the ‘More’ option to customize the transparency of the effect using “More”. Here is the detail.

12. Shadow

This option lets you apply a shadow effect on the menu background.

More-
With “More”, you can even customize the colour, angle, blur, and distance of the shadow effect. Here, you can get more details.

13 Logo

Use this option to apply a logo of your brand on the menu. You can choose the logo from TemplateToaster’s logo stock options or you can browse your own also.

More –
You can click “More” option to browse your own logo. You can also link your logo to a URL.

Logo Formatting –
You can also format the logo. Next, click the Logo and a Format tab will appear as shown below. The format tab provides you the option to change the alignment, height, width and angle of the Logo.

14 Foreground Image

You can add the foreground image in the menu to make the template/theme or website more professional and stunning.

More –
With the ‘More’ option you can even link the image to a custom URL. The link can be configured to open in a new window. If needed, you can change the transparency of the image and rotate it around the X or Y axis.

Foreground Image Formatting –
You can format the ‘Foreground Image’. For this, click the image and a Format tab will appear as shown below. This format tab provides you the options for changing the alignment, height, width and angle of the foreground image.

15 Text Areas

Use this option to draw the ‘Text Area’ in the menu. This lets you add the custom text, image, and video in the text area. Click this option and place the cursor where you want to create the text area. Simply drag the cursor and it’s done. In addition, you can also format the text area.

Text Area Formatting –
Click the text area for formatting the menu. In single click, a Format tab will appear as shown below. This format tab provides you the options to change the alignment, height, angle, and background of the text area. You can even apply effects and borders to the text area.

16. Menu Button Properties

Provides different Menu Button Properties as follows:

Separator-

Use the ‘Separator’ option to add horizontal or vertical dividing lines. It is mostly used in Menus and Toolbars. In the above image, Grey lines in Menu depict the Separator. You can even customize the separator. For this, many options are provided to choose Style, Thickness and Color.

Height-

You can set the height of the menu according to your preference. You can choose from predefined values or you can specify a custom value. Click “More” to specify custom height of menu buttons.

Margin –
You can use this option to specify left and right margins of the menu buttons.

Padding –
Use this option to apply Padding on Menu buttons from the left and right sides.

Alignment –
Choose this option to align the menu buttons along the menu strip.

Horizontal Alignment-
Allows you to choose a preferred horizontal alignment for the menu buttons.

Vertical Alignment-
The option aligns the menu buttons vertically in three different positions.

 

Icon-

This option helps you to use icons with menu buttons. For this, you can also browse your own icons.

Hover to change the colour of icons for normal menu buttons. And active menu button for professional look of template/website.

Arrow –

Use this to apply an arrow with a menu item which has a submenu. You can change the thickness and colour of the arrow according to your preference.

Texture –

Easily apply the texture on the menu buttons. Texture options include Normal, Hovered and Active menu buttons separately.

Shadow –
This option is for applying different shadow effects on the menu buttons.

17. Menu Button Background

This allows you to apply different background colours for different states of a menu button.

Normal –
Use Background colour for normal or passive menu button.

Hover –
The Background colour for the menu button on hover.

Active –
Background colour for the active menu button.

18. Menu Button Border

This option lets you add and customize the border of the menu buttons. TemplateToaster lets you create different designs for various states of menu button designs.

Normal –
Use this option to choose border properties for the normal or passive menu button.

Hover –
Use the option to specify/mention the border properties for the menu button on hover.

Active –
Lets you add the border properties for the active menu button.

19. Menu Button Typography

The option allows you to define the typography of menu buttons. Also you can set different typography for different states of the menu buttons.

Normal –
Use this to set border properties for normal or passive menu button.

Hover –
Mention/specify the border properties for the menu button on hover.

Active –
Use this option to set the border properties for the active menu button.

20 Hamburger

Use this option to give the latest Hamburger look to the main menu.

21 Open (Submenu) On

The option lets you make a choice to : open sub menu on Click or open submenu on Hover. You can choose any one of these options.

22 Submenu Layout

TemplateToaster lets you make three types of submenus- Mega Menu, Vertical Menu and Horizontal Menu. You can choose as you need.

Mega –
The option creates a Mega menu for your template/ theme or website as shown below:

Vertical –
This option lets you create a vertical menu for your template/theme or website as given below:

Horizontal –
It produces a horizontal menu for your template/website or theme design as shown below:

23 Design
This option is enabled only if the Hamburger option is selected or checked. It is used to set how hamburger icon looks i.e. whether it will be  in Text, Icon or Text & Icon.

Text –

Icon-

Text & Icon-

24 Toggle
This lets you set different properties like Background, Border, Typography, Line, Alignment etc. at all the states Normal, Hover and Active.

25 Slide
Use this to Specify how to open the menu- Slide Down, Slide Left, Slide Right, Pop up.

26. Submenu Container

You can also customize the look and feel of the submenu container. Click this option to customize the background of submenu container, to design its border and to apply a shadow effect on it.

27 Submenu Item

You can use this option to change the properties of Submenu Item like you can do with Menu Button.

Height –
Increases/ decreases the height of the submenu items.

Width –
Increase/ decreases the width of the submenu items.

Background –
Changes the background color of the submenu items.

Shadow –
Applies the shadow effect to the submenu items.

Hover Border –
Changes the look of the border when the mouse is hovered over the submenu item.

Hover Shadow –
Applies the shadow for the Hover state of the submenu item.

Separator –
Shows separators in the submenu items.

Margin –
Specifies the margin to the submenu items according to your need.

Padding –
Applies a padding to the submenu items according to your need.

Icons –
Displays icons with the submenu buttons.

Typography –
Changes the typography of the submenu buttons.

1 Activate/ Deactivate Slideshow

Make sure to check the box in order to activate/deactivate the slideshow on template/website.

2 Add a Slide

Use this option to add a slide.

3 Delete a Slide

This option lets you delete  a slide.

4 Previous Slide

Lets you move the previous slide.
5. Next Slide

Use this option to move to the next slide of the slideshow.

6. Slideshow Position

1. Slideshow Position

This option lets you change the position of the slideshow. The position of the slideshow can be changed with respect to the header and the menu. There are three options to choose the position of the slideshow:

 

• Above – Use this option to move the slideshow above the header.
• Middle – This option lets you place the shadow between the header and the menu.
• Below – Use this option to move the slideshow below.
• Besides, these options, there is one more option, that is-
• Menu Inside Slideshow – The menu will help to move inside the slideshow on choosing this option.

7. Transition Effect

Use the configure settings to use the transition effects and settings for the slides.

Apply On All Slides-
This option lets you choose an effect and also configure the settings for an individual slide, and also all of the slides at once. By default this option is ticked i.e. allowed. If you untick this option then you can apply individual effects on each slide.

Transition Duration- You can use this option to set transition duration for the slides. Thus you can mention how many seconds or milliseconds the transition effect will take to complete.

Transition Begin Time- This option lets you specify the transition begin time for the slides. Thus you can specify how many seconds or milliseconds you will have to wait before the transition effect of the next slide starts.

8. Button

Use this option to display the slideshow buttons on the slides. You can also customize how the button appears. Simply click on the ‘Button’ and then  the ‘Format’ tab will open up. Use the options to change the alignment, height, background, width, border, and more.

9. Pagination

This option lets you add or delete the slideshow pagination. By default the slideshow pagination option is checked. To deactivate the option simply click on it. In addition, you can also customize how the pagination appears. Simple click on the ‘Pagination Bullets’ and then the ‘Format’ tab will show up.  Now you will see various pagination options to change the alignment, angle, and style.

10. Background

You can customize the background and change the colour preferences, gradient, or image to apply to the background of the template/theme or website design –

Colour picker-
With the TemplateToaster option like Colour Picker you can choose the colour you want for the background. For more information, here is the full description of the colour picker.

Custom Gradient-
The option lets you customize the gradient and change the preferred angle, colour, and offset options. You can also save the gradient for later use. See this for more information about creating and saving the custom gradients.

Browse Images-
TemplateToaster offers numerous image stock for the background in the slideshow. The stunning un-built stock images are for free. But you can also browse the images and use it in the background.

Moreover, you can also edit the browsed images just the way you want. The TemplateToaster image editor has a series of options and features to easily edit and customize the browsed images. For detailed information, see this.

11. Height

Use this option to change the height of the slideshow. You can also use the option to make the height of the slideshow to fit the screen.

Fit To Screen –
If you select the ‘Fit to Screen’ option then the slideshow will automatically adjust to the height as per the browser’s viewport.

More –
You can use this option to specify the and customize the height simply by clicking on the ‘More’ option.

12. Width

This option lets you specify the width of the slideshow. You can choose based upon the three options as mentioned below:

Full Width – Use this option to set the width of the slideshow same as the width of the browser.

Equal To Page Width – This option makes the width of the slideshow the same as the width of the page. By default this option is activated. You can select to deactivate.

Custom Width – You can use this option to specify and customize the width of the slideshow as needed.

Note: If you select ‘Fixed Width Layout’ option for your template/theme or website design, then you can also set the custom width in pixels. And in case you select ‘Fluid Width Layout’ then you can set the custom width in percentage form.

13. Border

Use this option to customize the border of the slideshow. You can choose from options like Style, Thickness, Radius, and Colour option to choose the border.

More-
This option provides you with more options to customize the border. See this to know the usage of every option given for designing the border.

14. Margin

Specifies the margin of the slideshow for all the sides (i.e. top, bottom, left and right).

More –

Use the ‘More’ option to specify the custom margins.

15. Texture

This option lets you add texture to the slide background.

More –
You can customize the transparency of texture with “More”, Click here for more details.

16. Shadow

Use this option to apply a shadow effect to the slide background.

More –
The “More” is to customize the colour, angle, blur, and distance of the shadow effect. Click Here for more details.

17. Effects

This option is to add an effect to the slide background.

More-
You can customize the transparency of the effects using “More”. Click Here for more details.

18. Image

Find different options to set an image on the slide background.

More –

Using the ‘More’ option you can add effects on the foreground image. You can also link the image to a custom URL. The link can be configured to open in a new window. In addition, you can also change the transparency of the image and rotate the image around X or Y axis.

Foreground Image Formatting –
This option lets you format the Foreground Image. Simply click on the image and ‘Format’ tab will open up. You can use the tab to change the alignment, height, width, and angle of the foreground image. Also you can find the options to apply effects like transition, slide, and easing effects on the foreground image.

19. Text Areas

Use this option to draw text areas on the slides. This option also lets you add the custom text, image, and videos in the text areas. You can double click on the text area to modify its dimensions, add text, add image to the background, customize colour, and more. You can also do text formatting.

Text Area Formatting –
The option lets you format the text area that you draw in the slideshow. Simply click on the text area and a format tab will open up. Use this ‘Format Tab’ to change the alignment, angle, height, and background of the text area. Moreover, you can also apply transition effects, slide effects, and easing to the text area.

20. Logo

Easily add your brand or business logo on the slideshow. Also you can select the logo from TemplateToaster logo stock options. And you can also browse and add you custom logo.

More –
Click” More” to browse your own logo. You can also link your logo to a URL.

Logo Formatting –

You can format the logo that you add to the slideshow. Simply click on the logo and format tab will open up. This ‘Format Tab’ gives you the options to modify the alignment, height, width, and angle of the logo.

TemplateToaster allows you to easily edit and customize the header design and style for your template/theme or website design. You can easily manage the presets, background, height, border, width and much more details of the header tab using the TemplateToaster software.

 

Presets

TemplateToaster offers you pre-designed styles of headers to choose from. You can select the pre-designed header style from the available options. Moreover, you can also customize the header styles as needed for the template/themes or website designs.

Header Position

You can edit the header position. The header can be positioned above or below the menu, or you can also place the menu inside the header. And in case you do not require any header you can select the ‘No Header’ option as well.

Background

You can easily select your preferences for colour, gradient, or image to the header of the background of the template/theme or website. TemplateToaster features many extended background options:

Color Picker

You can make use of the ‘Colour Picker’ option and pick the background colours and customize it accordingly. Here is the full detail on the colour picker. 

Custom Gradient

With help of ‘Custom Gradient’ you can manage preferences like angle, colour, and offset choices. You can save the gradient as well for future use. To get more information on creating and saving gradients click here.

Browse Images

You can easily apply an image in the background of the header. TemplateToaster has in-built free stock images. You can also browse more images and edit them to customize them as you like. You can find the TemplateToaster image editor to edit and customize the browsed images as you want.

 Again you can find the TemplateToaster image editor to edit and customize the browsed images as you want. For details, see this.

Height

With this option, you can change the height of the header. You can also make the height of the header fit the screen. Here are a few options you can find:

Fit To Screen –

If you select the ‘Fit to Screen’ option the header will automatically adjust to the height according to the browser viewport.

More –

You can mention the specific height by clicking on the ‘More’ option.

Width

You can easily change the width of the header. You can find three options to specify the width of the header:

Full Width-

Sets the full width of the header which is equal to the width of the browser window.

Equal To Page Width-
Makes the width of the header equal to the width of the page. This option is set by default.

Custom Width-

• This option lets you specify the custom width of the header as you need.

Note: In case you select the fixed width layout option for the template/theme or website. Then you can set the custom width in pixels. Otherwise, you can choose the Fluid Width layout option for your template/website. If you select this option and set the custom width in percentage.

Border

You can use this option to customize the border of the header. You can choose from various options as Style, Thickness, Radius, and Colour, as per your customization needs.

More –

If you click on the ‘More’ option you will find more border customization options. Each option has a functionality particularly for designing the border.

Margin

This option allows you to set the margin of the header across all the sides i.e.top, bottom, left, and right.

More
You can use the ‘More’ option to specify the custom margins.

Texture

The Texture option lets you apply the texture to the background of the header. You can select the texture pattern from the options given by TemplateToaster.

More

Select the‘ More’ option to customize the transparency of the texture. For more details on each option click here.

Effects

You can apply the effects to the header of the background using this option.

More
You can also customize using the More option and change the transparency. Click here to know more.

Shadow

This option lets you apply the shadow effect to the header of the background.

More

Using this option you can customize the colour, angle, blur, and distance of the shadow effect using the More option. Click here for more details.

Image

• In addition to the background images, TemplateToaster provides you with the option to add foreground images in the header to make the template/theme, or website design looks more stunning and professional. You can use this option to apply an image on the header foreground using this option.

More

You can use the ‘More’ option to link an image to a custom URL. The link can be configured to open a new window. Moreover, you can also see the transparency of the image and also rotate it around the X or Y axis.

 

Foreground Image Formatting –

•  You can also do foreground formatting of the image. For this, you need to click on the image, and then a format tab will open up. This format tab lets you change the alignment, i.e. the height, width, and angle of the foreground image. You can also rotate the X and Y coordinates of the image as needed.  

Text Areas

You can use this option to draw the text area on the headers. This option lets you easily add custom text, images, and even video clips in the text area. Simply double-click on the text area to modify the dimensions, add text, add the background image, modify colour, and more. In addition, you can also format text.

Text Area Formatting

• This option lets you format the text area. A format tab will open up where you can find the options to customize the alignment, height, angle, and background of the text area. In addition, you can also apply effects and borders to the text area. 

Add Video

This option lets you add video on the header to give a stylish and attractive look to the template/theme or website design. In addition, TemplateToaster also gives you the option to edit the video with various options including Pause/Play, Mute, and Repeat options to make it easier for the users to access the videos.

Title

This option lets you show or hide the title in the header. By default, this option is checked but you can also untick it.

Title Formatting –

• • This option lets you format the title of the text. To use this option simply click on Title, and the Format tab will open up. You can use the format tab to change the alignment, angle, typography, and heading tag (H1, H2, H3, up to H6) of the Title.

Slogan

This option lets you either show or hide the website slogan on the header. By default this option is unchecked but you can change it.

Slogan Formatting –

• Using this option you can format the Slogan. Simply click on the Title, and the format tab will open up. This format tab gives you options to change the alignment, angle, typography, and heading style (i.e. H1, H2, H3, up to H6) of the slogan. 

Logo

You can use this option to add the logo of your business or brand in the header. You can also select the logo stock from the available options given by TemplateToaster. And you can also browse the logos.

More –

The ‘More’ option lets you browse your logo and add it to the header. You can also use this option to link the logo with the URL.

Logo Formatting –

• This option lets you format the logo. Simply click on the logo and a format tab will open up. You can use the format tab to change the alignment, height, width, and angle of the logo.

Social Icons

You can configure the social media account in the header section of the template or website. You can select the icons from the in-built social icon stock by TemplateToaster. In addition, you can also browse your custom social icons

Social Icon Formatting –

• This option lets you format the social icon of the logo. For this you need to click on the applied icon and the format tab will show as given below. The format tab provides you with options to change the alignment, height, width, and angle of the icons. 

The Container Tab allows you to change or modify the layout, width, texture, border, background, and more of the website/template or theme design.

 

Background

You can use the ‘Background’ option to customize the background colours, gradient, or image of the template/theme or website. Here are the background options that you can customise using TemplateToaster:

Color Picker

• TemplateToaster gives you a colour picker to choose the colour for the background. Here is the complete information for the colour picker. 

Custom Gradient

With the ‘Custom Gradient; the option you can create angle, colour, and offset choices based on your preferences. You can also save the gradients for future use. To know more about creating and saving the gradient click here.

Browse Images

With this option, you can easily apply an image to the background of the template body. TemplateToaster also provides free stock images to choose from. You can easily browse images and also customize the browsed images using TemplateToaster Background Image Editor. 

This will provide you with a set of editing options to customize the images as you want. Click here for more details.

Layout

You can customize the layout design of the theme/template using two options using TemplateToaster:

Fixed Width Layout –

This layout option lets you adjust the width of the layout. The dimension of a website should be of certain pixels. You can choose the element width in pixels. You can select the width of elements such as Header, Menu, Sidebar, Slideshow, and Footer for the specific pixels.

Fluid Width –

In this layout section the dimensions of the website are calculated in percentage. If you choose the fluid width layout for your website/template/theme then you can customize the width of the Header, Menu, Sidebar, and Footer in percentage form.

Border

• With the ‘Border’ option you can easily customize the border of the page. You can choose the Style, Thickness, Radius, and Color options to customize the border of the theme/template design. 

More –

Select the ‘More’ option for more functionalities and customization options for Border. Check this to know more details on each border option given for designing purposes. Lastly, save the changes.

Width

Use this option to change the width of the page in pixel form.

More –

The ‘More’ option lets you customize the width of the page and set the margin from top to bottom as needed.

Margin

With this option lets you choose the top and bottom margins of the page.

More –

You can use the ‘More’ option to specify the custom margin values.

Texture

You can use the options given by TemplateToaster to apply texture to the background of the page. 

More –
Select the ‘More’ option to customize the transparency of the texture. For more details click here.

Shadow

You can select this option to apply the ’Shadow’ effect to the background of the page. 

More –

Use the ‘More’ option to customize the colour, angle, blur, and distance of the shadow effect. For more details click here.

 

Effects

The ‘Effects’ option lets you apply an effect to the page background. You can choose from the available collection of effects for TemplateToaster.

More

The ‘More’’ option lets you customize the transparency of the effect. You can refer here for more details.