TOWeb Themes
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
- colors adjustments of your theme
) 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.
Web, Local and Custom Fonts
Since version 8, all editions of TOWeb offer by default a choice of 1000 fonts usable in the themes of your sites, the vast majority of them being Google Web Fonts.
But TOWeb V8 also allows you to integrate any Web font files locally to your site (.woff, .eot, etc ...) whether they are those of Google or others. The advantage is to be able to use local fonts on your website ( including Google Web Fonts that you can download from google-webfonts-helper.herokuapp.com/fonts/ ) rather than load them systematically from another web server than yours every time you open a web page of your site. This is particularly useful in the following situations:
- if you want to prevent your site and visitors from being "tracked" by Google by using the Google fonts locally stored on your own web server instead of online access and use Google's servers.
- if you want to work "offline" in TOWeb without systematically making online "https" access to Google fonts but rather use local fonts, present on hard disk, and thus accelerate the loading/display of pages for a better comfort in using TOWeb,
- if you want to make an intranet site that can be displayed correctly even without internet access (ie internal site of a company / organization) or if you want to show a beta preview of your site to someone on a computer not connected to the internet,
- if you want to use very specific fonts made by designers for your company.
To add a font in TOWeb, you first have to open the CSS editor of the Theme, then inside the "Font" tab click on the "+" button located next to the list of available fonts. The Add Fonts Wizard will then guide you by asking you to copy/paste the CSS lines of your font and add the compressed ZIP file containing all the files in your font.
The local/custom fonts you add are always placed at the very beginning of the list of available fonts with their name displayed in bold to distinguish them from the others (standard fonts are shown in italics and online fonts of Google Web Fonts displayed without any formatting).
Once your font is added, you can select and apply it to an element of your Theme such as the global element "Site" (if you want it to be the default font used for all content of your site) or only to a specific sub-element like "Title" (if you want to have a page title style different from the rest).
When you add a new font it is first added into TOWeb, meaning that if you have multiple sites you will not have to add it each time but will be able to use it directly from the list of fonts available in TOWeb.
On the other hand, if your site uses a local/custom font, it will also be stored in your site's data, meaning for example that during a full reinstallation of TOWeb on a new computer and a restore data of your site, you will not have to add it again but it will be automatically added and available in TOWeb.