Les Thèmes avec TOWeb
Démarrer ou Recommencer le Thème de votre site
Lors de la première utilisation TOWeb vous êtes invité à sélectionner parmi la liste des thèmes et modèles de sites celui avec lequel vous souhaitez démarrer. Ce thème et ce site constituent une base de départ : par la suite, vous pourrez ajouter ou supprimer des rubriques à ce site initial, images et couleurs, modifier le contenu de ces pages, l'agencement de vos paragraphes mais aussi charger ( 
) et repartir d'un autre thème.
De nouveaux thèmes seront régulièrement ajoutés et disponibles en téléchargement (connexion internet requise) de sorte que vous pouvez utiliser ce bouton pour vérifier les derniers en date si jamais au fil du temps vous désirez en essayez un autre. Depuis la fenêtre de modèles de thèmes vous pouvez sélectionner n'importe quel thème pour naviguer dans ses pages et utiliser les différents boutons de prévisualisation smartphones (
), tablettes ( 
) et ordinateur ( 
) et voir ainsi son affichage sur différents appareils.
Vous pouvez également personnaliser selon vos besoins les modèles des thèmes proposés par défaut par Lauyan Software pour ensuite gérer différentes versions de votre thème, être en mesure de pouvoir revenir à une précédente version cela à l'aide des boutons Enregistrer un thème local ( 
) et Charger un thème local ( 
) situés dans l'écran de l'éditeur CSS (voir ci-dessous pour plus d'informations).
Personnaliser votre Thème
Editeur simplifié
L'éditeur simplifié est l'écran affiché initialement la première fois que vous cliquez sur le bouton Thème ( 
). Il vous permet de changer facilement et rapidement les principaux éléments importants de votre thème :
- les textes qui apparaissent sur la partie supérieure de votre thème (logo et slogan)
- les photos du carrousel de votre thème si celui-ci en possède
- les boutons de réseaux sociaux
- et les ajustements des couleurs de votre thème
Si vous avez apporté des modifications à votre thème mais souhaitez les annuler, cliquez sur le bouton Editeur CSS puis ensuite sur le bouton ( 
) annuler tous les changements. Si vous êtes satisfait des modifications apportées utilisez le bouton Enregistrer ou le raccourcis clavier CTRL + S.
Editeur CSS
En cliquant sur le bouton Editeur CSS ou sur un élément de l'aperçu de votre site, vous vous retrouvez automatiquement dans le mode utilisateur "expert" de personnalisation des styles CSS de votre thème. En modifiant ces styles vous pouvez obtenir un thème qui sera très différent de celui initial mais cela pourra nécessiter des connaissances en développement web (notamment CSS3) plus ou moins importantes et de nombreux essais pour être en mesure de gérer et d'effectuer tous les changements nécessaires pouvant mener aux résultats désirés. Toutes les possibilités de mise en page et les compétences en développement web ne sont pas décrites ici, mais seulement les principes de base sur la façon dont TOWeb propose la modification des styles CSS.
Ouvrez d'abord la rubrique de votre site sur laquelle vous souhaitez prévisualiser les changements de styles que vous allez apporter. Par exemple ouvrez votre page d'accueil si vous souhaitez changer le carrousel qui s'y trouve ou sélectionnez un catalogue si vous désirez modifier la couleur des prix des produits et pouvoir visualiser au mieux ainsi vos changements. Pour changer de rubrique en édition de thème vous pouvez sélectionner votre rubrique depuis la liste déroulante de votre site ou cliquer sur un lien de l'aperçu (comme par exemple un lien / bouton de votre menu) tout en maintenant la touche CTRL enfoncée.
Ensuite, dans l'aperçu de votre site, cliquez sur l'élément que vous souhaitez modifier. Par exemple si vous désirez changer la couleur des liens / boutons de votre menu, cliquez sur un des liens/boutons et TOWeb vous sélectionnera alors l'élément lien dans l'arborescence des styles en vous affichant en dessous ses propriétés réparties dans différents onglets. Vous pouvez alors changer la "couleur" de votre lien/bouton, situé dans l'onglet "Police".
Vous pouvez ouvrir ou fermer tous les nœuds de l'arborescence des styles pour afficher, masquer, rechercher et sélectionner ainsi l'élément désiré de cette manière là aussi. Les éléments dans l'arborescence peuvent être déplacés par glisser-déposer : par exemple pour déplacer le "champ de recherche" de votre site sur la partie gauche ou droite d'une autre barre d'outils. Et si vous avez plusieurs éléments placés à l'intérieur du même élément, vous pouvez également changer leur ordre par glisser-déposer.
Les éléments de votre site sont répartis en 2 catégories principales : "Site > Général" et "Site > Page". Seuls les éléments situés dans "Site > Page" peuvent être déplacés par glisser-déposer dans d'autres éléments de cette arborescence.
Enfin n'oubliez pas qu'à tout instant vous pouvez annuler tous vos changements ( ) si jamais vous effectuez des erreurs et que vous pouvez Enregistrer ( ) & Charger ( ) des thèmes locaux pour conserver et revenir à différentes évolutions et versions de votre thème.
Polices de caractères web, locales et personnelles
Toutes les éditions de TOWeb vous proposent par défaut un choix de plus de 1000 polices de caractères utilisables dans les thèmes de vos sites dont la très grande majorité sont les Google Web Fonts.
Mais les éditions payantes de TOWeb V13 vous permettent aussi d'intégrer n'importe quels fichiers de polices Web locales à votre site (.woff, .eot, etc…) qu'il s'agisse de celles de Google ou d'autres. L'intérêt de pouvoir utiliser des polices locales à votre site ( y compris celles Google Web Fonts que vous pouvez télécharger sur google-webfonts-helper ) plutôt que de les charger systématiquement depuis un autre site/serveur que le votre à chaque ouverture des pages web de votre site, s'avère particulièrement utile dans les situations suivantes:
- si vous souhaitez éviter que votre site et vos visiteurs ne soient “traqués” par Google en utilisant vos polices stockées localement sur votre site/serveur web, plutôt que d'être systématiquement chargées en ligne depuis les serveurs de Google
- si vous désirez travailler “offline” dans TOWeb sans faire systématiquement des accès "https" en ligne aux polices de Google mais en utilisant des polices locales, présentes sur disque dur et donc d'accélérer le chargement/l'affichage des pages pour plus de confort de travail dans TOWeb,
- si vous désirez faire un site intranet qui puisse s'afficher correctement sur un réseau local sans accès internet (ie. le site interne d'une société/organisme par exemple) ou si vous désirez montrer une maquette de votre site sur un ordinateur non connecté à internet,
- si vous désirez utiliser des fontes personnelles / spécifiques autres que toutes celles fournies par défaut dans TOWeb que vous avez pu acheter pour vos besoins/votre société,
Les polices locales/personnalisées que vous ajoutez sont systématiquement placées au tout début de la liste des polices disponibles avec leur nom affiché en caractères gras afin de les distinguer des autres polices (les polices standard étant affichées en italique et celles en ligne des Google Web Fonts affichées sans aucune mise en forme).
Une fois votre police ajoutée, vous pourrez ensuite la sélectionner pour l'appliquer à un élément de votre Thème comme par exemple l'élément global "Site" (si vous désirez que ce soit la police utilisée par défaut pour tout le contenu de votre site) ou seulement à un sous-éléments précis comme celui "Titre" ( si vous désirez avoir un style de titre de page différent du reste dans toutes vos rubriques).
Lorsque que vous ajoutez une nouvelle police de caractère celle-ci est d'abord ajoutée dans TOWeb, ce qui signifie que si vous avez plusieurs sites vous n'aurez pas à l'ajouter à chaque fois mais pourrez directement l'utiliser depuis la liste des polices disponibles dans TOWeb.
D'autre part si votre site utilise une police de caractère locale/personnalisée, celle-ci sera également stockée dans les données de votre site, ce qui signifie par exemple que lors d'une réinstallation complète de TOWeb sur un nouvel ordinateur et une restauration des données de votre site, vous n'aurez pas à la rajouter de nouveau mais elle sera automatiquement ajoutée et disponible dans TOWeb.