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.

The ‘Body Tab’ lets you navigate the options between the body of the template/theme or website design. You can make the change in the body of the design including the background, scrolling, and so on.

 

The ‘Background’ option lets you apply changes to the background of the template/theme or website design. You can make changes in the background preferences for colour, gradient, or image used in the template/theme design. Given below are the extended background options provided by TemplateToaster:

Color picker

TemplateToaster provides an option as ‘Colour Picker’. You can customize and pick the colour for the background. Here are more details on the Colour Picker Dialogue Box.

Custom Gradient

You can choose from custom gradient options with preferences like angle, colour, and offset options as you want for the ‘body’ of the template/theme design. You can also save the gradients for future use.

Browse Images

Use this option to apply an image to the background of the template design. TemplateToaster offers you an in-built gallery of free images. Moreover, you can also browse custom images.

And not just that you can also edit or modify the browsed images just the way you like. TemplateToaster provides you with an image editor option with a series of editing options. So that you can customize the images right there. For more details check here.

Effects

In the ‘Effects’ section you can make changes in the effects and texture of the template design.

Texture-

• You can choose this option to apply the texture to the background of the body. 

More

Under the ‘More’ option you can customize the transparency of the texture by clicking on the ‘More’ option. Here are more details on the same.

Effects

This ‘Effects’ option allows you to add effects to the background of the body of the template design.

More –

Next under the ‘More’ section you can customize the transparency of the particular effect you have chosen. Click here to know more. 

Type

Here you can find two different settings to customize the body of the background:

Fixed

Selecting this option will result in the body background being fixed concerning the viewport.

Scroll

The scroll type allows the background of the body to scroll along the elements in the browser viewport.

Scroll Up

The ‘Scroll Up’ option lets you show the scroll up button on the top of the website or template. Many scroll up button options are available. You can browse more if needed.

More –

Under the ‘More’ option you can customize the design of the scroll-up button. For more detail on Scroll Button click here.

Here in the general tab as you can see in the screenshot you will find the basic options to manage and edit the template/theme/website designs. The options are self-explanatory and very easy to use.

Templates

• This option shows your template designs. You can choose any of the templates from the list and can click on ‘More Templates’ to access more template designs.

Scheme

When you click on the ‘Scheme’ option a Colour and Typography window will open up. Now you will see various colour schemes. You can choose any colour from the colour scheme palette and also customize one on your own. In the same way, you can also choose font typography which will reflect its effects on the main window content as you hover over the list of typography. Moreover, you can also add a new colour scheme and font typography as needed. In addition, you can also edit the existing schemes. For more details refer to the Choose Colour Scheme & Typography option section.

Layout

When you click on the layout the windows shown below will open up. You can choose from the list of options the layout design for the template/theme as No Item, Single Item, Double Item, or Triple Item as needed.

Sidebars

From the Layout group, click on the Sidebars to select the sidebars for the template or website. Sidebars are the vertical columns along the main content area of the website or template. You can also place the widgets/modules/blocks in the sidebars according to your needs.

CMS

You can easily switch from one template type to another with a single click on the CMS. For example, you can easily switch from WordPress to Joomla or any other type of CMS platform in just one click.

Add/Edit Page

In WordPress, HTML, and WooCommerce, you can add or edit the page dialogue box that will open. You can click on this option to add/edit any desired page of your template/theme or website design.

Add/Edit PageTemplate

This option lets you add/edit desired page templates with Name and Title, particularly in WordPress. A page template defines what design element surrounds the content of the page ( i.e. header, footer, sidebar, etc.). You can easily add or edit the page template.

CSS

Allows you to apply Custom Styles to the theme by apprehending the code in a style.css file.

JavaScript

From the Editors group, you can choose the JavaScript option for your theme that embeds the script in a custom.js file.

PHP

Makes it easy to use the PHP editor in a single click that will recognize the written code within the functions.php file.

Complete

•  A website Typography wizard will open up when you click on the ‘Complete’ option. Then you need to select the item where you want to apply the required typography changes as Heading Tags (H1-H6), Texts (i.e. Paragraphs), or Complete. Then you need to select the element from the left panel. You can select between the type of font, font style, font colour, alignment, and effects from the given options present on the right side of the wizard window Click ‘Save’ and apply the changes you have done. For more information, you can check out the Website Typography. 

Favicons

Favicons are shortcut icons, which is the file that contains one or more small icons, related to a particular website or a web page. You can use the ‘Favicon’ option to apply the favicons to the particular website or web page you are designing. TemplateToaster provides you with a wide collection of pre-designed favicon options from which you can choose the suitable ones. You can also browse the favicon options with click on the ‘More’ option.

Website Preferences

The ‘Website Preferences’ option allows the users to set preferences for the website. Once you click on these options a preferences dialogue box will open from where you can make different settings choices as:

-CSS Prefix

• With this option, you can add the preferred CSS rule to every matching style tag of a class or ID of the template/theme/website that is exported. 

-Author name

Edits the name of the author to include your name.

-Author URL

This option shows the homepage URL of the theme author.

-License

Displays the licence of the theme you have selected.

-License URL
The option shows the License URL.

File Menu refers to the options that you will find in the TemplateToaster software. These options make it easier for you to manage and control the template or theme designs. Let’s talk about the File Menu options in detail here:

New

The ‘New’ option lets you open a new website or new page for the template.

Open

• With the ‘Open’ option you can easily access any existing TemplateToaster (.ttr) project. You can also use Ctrl + O shortcut to access this option and open the file. 

Save

The ‘Save’ option lets you save your (.ttr) file. You can also use the Ctrl + S shortcut to save the file. You just frequently save your work by using the short to avoid any accidental loss of data.

Save As

The ‘Save’ option lets you save the TemplateToaster (.ttr) file with another name and at another location. This option allows you to have multiple copies of the same (.ttr) file.

Export

With the ‘Export’ option you can export the template to the installed CMS you are working on (WordPress, Joomla, Prestashop, Magento, etc.). You can export the template as a Zip file or a folder as needed.

Preview

• You can use the ‘Preview’ option to check out the preview of your template/theme in the browser. Else you can also use the shortcut Ctrl + P for the preview. 

Preview RTL

This option helps you get a preview of the template/theme design in RTL format (Right to Left) for languages like Arabic.

• The ‘Settings’ section helps the users to make a few important changes in the Application and Font settings. When you click on the settings the following window will open up. There are a few options you can adjust based on the requirements.

• Select Your Language

• TemplateToaster allows you to choose from different languages. You can choose the language you want to work with. There are many language options like English, French, Dutch, German, Spanish, Turkish, Arabic, and more. 

• Show export information dialog

• If you want to view the export template dialogue box then you must tick this option. By default, this option will be checked. 

• Use hardware graphics acceleration if available

•  Untick this option if your software is running very slow. Sometimes this can be because of poor graphic drivers.

• Edition

• Here you can check the TemplateToaster version/edition you chose at the time of installation. You can choose between ‘Standard Edition’ and ‘Professional Edition’. The standard edition allows you to create templates but with limited features. It is a good option if you are a beginner. The professional edition offers you a lot of features and advanced functionalities that enhance productivity while working with huge and complex websites. You can use the professional edition to use the extended features of TemplateToaster.

• Web Safe Fonts

• The Operating System has a pre-installed set of fonts. Therefore a user cannot see the fonts of a particular system on another. However, there are a few fonts that are available and can be viewed on all types of Operating Systems. These fonts are called ‘Web Safe Fonts’ and are recommended to use by designers. By ticking this option, you can make use of web-safe fonts. 

• System Fonts

If you select this option then you can use any font that is supported by Windows.

• Enable Font Service

• If this option is checked, the font cache will be maintained. 

• Clear Font Cache

This option is used to clear the old font cache.

Help

This option will redirect you to the online tutorial of CMSs like WordPress, Joomla, Drupal, Magento, and many others that are supported by TemplateToaster.

Activation

This option lets the user enter the activation code in the input field while activating the TemplateToaster software.

Updates

Let you know about the latest update available for TemplateToaster.

About

Displays your licence information like the Version, Mode, Activation Key, etc.

As the name suggests the Quick Access Toolbar allows you to complete the tasks that are frequently required by the users. These options make designing the template quick and easy. These options include undo, redo, save, open, preview, and export.

Undo

This option removes all the changes that you have made in your currency working session.

Redo

This option restores the changes that have occurred since the last undo.

Save

The option lets you save the changes that you have made using the TemplateToaster theme/template/website under the (.ttr) file extension. You can also use the shortcut Ctrl + S to save the file menu.

Open

 It allows you to open an existing (.ttr) file on the system. The Open option is a shortcut to the Open Tab in the File menu. You can also use the shortcut Ctrl + O.

Preview

As the name suggests, the Preview option allows you to have a preview of the current theme/template/website in the browser window. The preview option also lets you select the browser you want to use for the preview by clicking on the small drop-down arrow.

Export

This option allows the users to easily export the theme/template/website design they have designed using the TemplateToaster software. Find detailed information on how to export template design using TemplateToaster here.

With TemplateToaster you can explore hundreds of free template designs and create a website of your own. Moreover, it is pretty straightforward to design your template thanks to the seamless functionalities and amazing set of features. Also, using these premade template designs not just saves you time, and gives dimension to your brand. But also create a visual presence for your business. In addition, you can use premade template designs from our collection or create a custom template/theme for future use. Besides, you can edit or modify these templates at any given time.

 

For designing templates/themes there are different options provided by TemplateToaster. These options include:

• Quick Access Toolbar

• File Menu

• General Tab

• Body Tab

• Container Tab

• Header Tab

• Slideshow Tab

• Menu Tab

• Sidebar Tab

• Widgets/Modules/Block

• Sidebar Menu

• Content Tab

• Footer Tab

• Widget Areas Tab

• Elements Tab

• Editor Tab

• Format Tab in TemplateToaster

• Dialog Boxes