TOWeb Themes

Page 7 of 25

Start or restart your Theme

When first using TOWeb you are asked to select among the list of theme & site templates the one you'd like to start with. Later on you may add or remove topics of your site and change the content of your pages and layout of your paragraphs (from the "Topics" step) but also change and apply at any time another theme to your website by using the load theme template ( ) button located in the left sidebar of the Theme step.

New themes will be regularly added and available for download (internet connexion required) so you may use the load theme template button to check the latest ones (if you can't see any theme and/or if TOWeb seems blocked you may need to authorize TOWeb on your system). From the TOWeb load theme template window, you can select and open any theme : links inside the template do work so before to apply it to your site you can navigate and see the different pages but also use the different preview buttons to see how the theme is displayed on smartphones (), tablets ( ) and the full screen mode of your computer ( ).

You may customize to your needs the default theme templates proposed by Lauyan Software and then manage different versions of your theme(s), be able to get back to them using the Save a local theme ( ) button and Load a local theme ( ) button located in the Theme EXPERT Mode interface (see next chapter below for more information about the Expert Mode).

Customize your Theme

Smart Editor

This simplified screen allows you to easily and quickly change some main important elements of your theme :

  • the texts that appears on the top part your theme/site (left & right parts and slogan),
  • slides and their order,
  • social network buttons
  • and colors adjustments of your theme
If you have made changes to your theme using the smart editor but want to undo them (due to mistakes or modifications you don't want to keep), then use the Css Editor button and click ( ) undo all theme changes. On the contrary if you are satisfied with your changes you can Save everything anytime using the CTRL+S shortcut.

CSS Editor

The expert mode interface allows you to modify your Theme and so obtain a different one. But depending on changes this may require expert web developer knowledge (especially in CSS3) to be able to manage and perform all the necessary changes that will lead to the result you may want to obtain. All layout possibilities and web developers' skills are not be described here but only basics on how TOWeb manages CSS theme styles.

First open the topic of your site where you would like to preview the changes of styles you are going to do. For instance open your homepage if you want to change and see slides only displayed in your homepage or select a catalog if you want to change and see the color of your product prices for example. You can select a different topic from the list of topics located on the top toolbar or from the TOWeb's Theme step by clicking on a link inside your preview page (links of your menu for instance) while pressing the CTRL key.

Then, in the page preview, select the element you would like to change. For instance if you want to change the link color of your website menu, click on one menu link (or menu link button) and you will see the TOWeb left sidebar a treeview and tabs updated with the menu link styles properties.
The treeview list contains the structures of the different elements and actions you may change like for instance the for a menu link the hover effect or the active link style (used to show in your menu which current topic is currently displayed). Below the treeview list, different tabs contains CSS properties you may change like the "Color" of your link located inside the "Font" tab.

Open or close any nodes in this treview to display or hide structure element properties before to find and select the one you want to change. Elements in the treeview list can be moved by drag'n drop. You may then move for instance the search box on the left or right part of another toolbar of your theme. And if you have several elements placed inside the same location then you may change their order by drag'n drop too.
Theme elements of your site are divided inside 2 main categories in the treeview : "Site > General" & "Site > Page". Only elements located in "Site > Page" can be moved by drag'n drop.

Remember that you can Undo all theme changes ( ) if do any mistake, but also Save ( ) & Load ( ) local themes to manage different theme versions and do frequent backups of your website to be able to get back to a previous version of your website.