L’outil Icône de SiteW vous permettra d’ajouter en un seul clic une icône sur votre site : pratique pour transmettre des informations claires et concises à vos visiteurs et pour faciliter leur navigation tout en améliorant le design de votre site.
Choisir une icône
Insérez un module Icône à votre site par simple glisser/déposer dans l’outil de création de site et faites votre choix dans le gestionnaire de fichiers parmi les nombreuses options disponibles. Vous pouvez choisir plusieurs icônes à la fois (jusqu’à 5) puis répéter l'opération si vous en souhaitez davantage.
Insérer un lien
Ajoutez facilement un ou plusieurs liens sur votre icône en cliquant sur le bouton Ajouter un lien dans le panneau Contenu (de couleur bleue) des propriétés du module sur la gauche de votre écran.
Choisissez votre type de lien et rentrez, si besoin, les informations demandées dans le champ de saisie : Site externe, Adresse mail, numéro de téléphone, page du site, article ou produit, document, image.
Si plusieurs icônes ont été ajoutées, vous pouvez choisir un lien par icône. Il est aussi possible de remplacer le module Réseaux Sociaux par le module Icône, en choisissant des icônes de réseaux sociaux, et en ajoutant ses liens.
Configuration du design de l’icône
Pour personnaliser l’apparence de votre icône, rendez-vous dans l’onglet Design (en vert) une fois votre module Icône sélectionné.
1- Choix de la taille
Vous pouvez choisir entre différente taille d'icône selon vos envies et besoins, de 16 à 256 pixels. Vous pouvez aussi ajuster manuellement la taille en étirant simplement l'icône.
2 - Choix du style
On peut choisir un style prédéfini identique pour tous les modules dont le style peut être personnalisé (Blog, FAQ, Texte, etc.), ou définir un style personnalisé unique pour le module Icône.
- Pour utiliser un style prédéfini, il faut sélectionner un style dans la liste proposée. Ce style peut être personnalisé (la configuration s’appliquera à tous les modules qui utilisent ce style).
- Pour utiliser un style unique, on peut:
- Ajouter des personnalisations directement depuis le panneau design comme pour les styles prédéfinis.
- Cloner dans un style prédéfini : il est possible de migrer le style qu’on vient de créer vers un style prédéfini (en cliquant sur le bouton “ Cloner dans un style prédéfini”)
- Copier un style prédéfini : à l’inverse, il est possible de s’inspirer d’un style déjà créé, en cliquant sur le bouton “Copier un style prédéfini ici”)
3- Choix des couleurs
Sélectionnez la couleur de votre choix grâce à l’outil de sélection des couleurs. Vous pouvez déterminer la transparence de la couleur sur la réglette de droite. Procédez de la même manière pour choisir la couleur de fond de votre icône. Vous pouvez déterminer la couleur normale et la couleur au survol de la souris, si désiré.
4- Espacement
Définissez l’espacement entre l’icône et les bordures du fond en déplaçant le curseur sur la réglette prévue à cet effet.
5- Marges externes
Si vous ajoutez plusieurs icônes, vous pouvez ajouter des marges externes.
6- Bords arrondis
Définissez l’arrondi des angles de la bordure de votre icône en déplaçant le curseur sur la réglette ad hoc. Ainsi vous pourrez créer une icône qui possède un fond carré ou rond. Notez que le fond est visible seulement si une couleur de fond est définie.
7- Bordures
Vous pouvez déterminer l’épaisseur et l’apparence de la bordure, à l’aide de la réglette et du menu déroulant.
8- Ombres
Vous pouvez ajouter une ombre interne ou externe à votre icône et en déterminer la distance, la couleur, la diffusion et la taille, en utilisant les outils de réglage à disposition.
9- CSS personnalisé
Vous pouvez ajouter votre CSS personnalisé dans le champ de saisie.
Le module Icône vous permettra d’ajouter des composants visuels efficaces à votre site web : boutons d’appel à l’action, icônes de réseaux sociaux, éléments graphiques…