Utilisation de Config-look - GuppY 5.02.XX

L'évolution de la version de Config Look incluse dans le pack GuppY 5.02.XX vous permet d'aller encore plus loin et de façon simple dans la personnalisation de votre skin, le but étant de gérer le maximum dans Config look pour simplifier le fichier styleplus.css.

Toutes les skins du pack ont été adaptées pour Config Look mais nous vous conseillons de commencer par une copie de la no_skin ou par la skn5_maskin02, de bien lire le tuto mise à jour skins GuppY 5  disponible sur ce lien.

Important !  Avant de modifier la skin de votre site, vous devez avoir fait la configuration des boites dans Config boites.
 

Le principe de fonctionnement est le même pour toutes les rubriques, vous sélectionnez les polices, la taille, vos images, vos couleurs, vos styles etc.

Tous les champs de Config look doivent être correctement remplis avec des valeurs correspondant à chaque champ.

Des nouveautés :

• A Paramètres généraux => Bandeaux : le blocage au scroll du menu ou d'un menu déroulant horizontal en haut de page,
• A Pages nous avons ajouté un effet parallaxe pour les 3 zones principales, nous y reviendrons à la rubrique Pages.
• Depuis la version 5.02.07, la génération de la feuille de style.css est automatique lorsque vous cliquez sur Enregistrer la config.

Quelques exceptions:

- Affichage du bandeau JavaScript désactivé, il est préférable de ne pas cocher pour que le visiteur soit prévenu de la désactivation de son javascript,

- Fixe, vous ne le cochez que si vous avez une image fixe (1920 x 1080px) en fond de site,

- Opacité peut prendre plusieurs valeurs :

• valeur de transparence  : la valeur par défaut 1 sera utilisée si le champ Arrière plan est rempli avec : transparent
• valeur de transparence : 0.1....0.5, 0.6, 0.7, 0.8, 0.9 au choix pour la transparence de la couleur indiquée au champ précédent, la couleur sera codée avec rgba(rr, gg, bb, opa)
• pas de transparence : vous mettez 1 et la couleur sera affichée à 100%, la couleur sera codée avec rgba(rr, gg, bb, opa)

Pour changer de couleur il faut cliquer sur la zone de gauche (d'un item de couleur) pour faire apparaitre le script jquery Color Picker.
Parfois un petit délai au clic est nécessaire pour se déplacer dans la fenêtre de saisie de la couleur.

Les deux zones attenantes permettent de visualiser l'ancienne et la nouvelle couleur, une fois la nouvelle couleur sélectionnée ne pas oublier de valider la couleur en cliquant sur le rond en bas à droite de la fenêtre de Color Picker.

Sans oublier d'enregistrer et ensuite de générer le style.

Une fois le style généré, vous affichez une page pour voir le résultat, il est nécessaire de rafraîchir la page pour l'afficher sans passer par le cache.

Lorsque vous avez configuré toutes les rubriques, enregistré et généré votre fichier style.css, votre skin est terminée et opérationnelle.
 

Attention !  vous ne pourrez pas faire de modifications manuelles dans les fichiers style.css, jqstyle.css, vous devez obligatoirement utiliser config look.
 

Pour personnaliser encore votre skin, vous cliquez sur Config Style puis sur Modifier la feuille de style DE PERSONNALISATION (styleplus).

Dans ce fichier styleplus.css, vous allez ajouter toutes les personnalisations que vous souhaitez apporter à vos feuilles de style, style.css, jquery.css peuvent être personnalisés dans le fichier styleplus, sans le surcharger il ne doit contenir que le stricte nécessaire.
 

Attention ! Il faut une certaine connaissance des feuilles de style css pour avoir une personnalisation importante.
 

Pour vous aider vous pouvez utiliser la skn5_maskin02 qui montre quelques possibilités avec un minimum de personnalisation,  elle est en téléchargement sur ce lien.

Un conseil :  en parcourant le tutoriel, vous pouvez ouvrir Config look pour la skn5_maskin02 et voir toutes les options proposées par rubrique.
 

Pas de panique, nous allons y revenir rubrique par rubrique !!!





Tutoriel réalisé par Papinou et Saxbar pour la GuppY Team - mars 2015 - Licence Libre CeCILL - maj décembre 2018