Skip to main content Help Control Panel

Login   A+   A-

Downloads «   Skin factory «  

grigloo

Vous êtes bienvenus à copier, utiliser et modifier ce skin
preview_grigloo.jpg

Présentation de grigloo

grigloo, c'est le skin que j'ai créé pour mon site, 360kmh.com. Il est constitué des éléments suivants :
  • la feuille de style grigloo.css
  • le fichier skin.php
  • le fichier template.php
  • plusieurs images.


Le skin grigloo est dérivé du skin digital fourni avec yacs. Il comporte 3 colonnes et des onglets de navigation, ainsi qu'un agencement de couleurs facilement personnalisable. Il est conçu pour permettre à l'internaute de modifier la taille de police à l'affichage. Il a été testé avec Internet Explorer 6 et 7, de même qu'avec Mozilla Firefox 1 et 2.

grigloo.css

La feuille de style est disponible en 2 versions. Dans grigloo.css, les règles de style sont organisées dans un ordre qui diffère de celui habituellement utilisé par yacs, que je trouve plus utile lorsque j'effectue des ajustements au design de l'interface. La version grigloo_0.css comporte les mêmes règles, dans l'ordre familier à yacs.

skin.php

Le fichier skin.php a été modifié pour ajouter le formulaire d'authentification dans la boîte Utilisateurs de la colonne de gauche. Pour éviter le dédoublement, enlevez ce formulaire de la boîte Menu, à partir de la carte du site.

template.php

Dans le fichier template.php, des lignes blanches ont été ajoutées pour séparer les différentes zones de la page (comme main_panel ou extra-panel) afin de faciliter la lecture du code source envoyé au navigateur.

Les images

Le dossier images contient plusieurs images nécessaires au skin, qui sont appellées par la feuille de style. Si vous personnalisez l'agencement de couleurs de la feuille de style, il devrait être relativement facile d'ajuster les images en modifiant leur teinte dans un programme de traitement d'images.

Quelques images du dossier icons ont également été modifiées, notamment celles qui comportaient du texte en anglais, pour les rendre "bilingues" (quoique moins explicites).


Files

Grigloo.tgz 154,426 bytes, 531 downloads
Edited by Lasares on Mar. 16 2007
Zoom

Notes

Lasares on Mar. 16 2007 - #
J'aimerais bien savoir ce que Bernard, et les autres membres de la communauté d'ailleurs , pensent de ma feuille CSS. En particulier, la façon dont j'ai réorganisé les règles de style est-elle acceptable ? Est-ce qu'une sorte de table des matières des règles, ça aide ? Ou devrais-je plutôt me conformer strictement à l'organisation des autres skins ?

Et puis, je croyais que ce serait une bonne idée d'écrire un petit texte de présentation du skin, mais ça ne convient pas très bien à l'affichage choisi pour Skin Factory (jive, si je ne me trompe). À moins qu'on ne mette la description en commentaire ?
Bernard on Mar. 18 2007 - #
Lasares: Je n'ai pas encore pris le temps de rentrer dans le détail de la feuille de style, mais ça a l'air efficace en tout cas. Et puis finalement, la description passe très bien non ? Lorsque nous aurons tout plein de styles à partager, nous reverrons à remplacer jive par autre chose, mais nous n'en sommes pas encore là ...
Lasares on Mar. 19 2007 - #
Bernard :

Si ça vous va, ça me va !
Olivier on Apr. 7 2007 - #

merci je l'ai phagocyté pour mon site http://lapharma.fr

Olivier on Apr. 9 2007 - #

le css est très bien documenté mais je j'arrive pas à changer les couleurs.

par exemple j'ai essayé de changer:
#7b0 : "odd" title color, for header_slogan, h1, some highlights

avec la pipette de colorzilla j'ai pris une couleur que je souhaite utiliser: #00FF73
mais le codage des couleurs semble différent.

avec web developer je ne trouve pas les mêmes codes couleurs que dans le css.

que faut il faire ?

GnapZ on Apr. 10 2007 - #
Olivier : Les codes couleur à 3 chiffres (hexa) ne sont en fait que l'utilisation de codes à 6 chiffres identiques par groupes de 2. Ex: #7b0 = #77bb00 . c'est juste une question de notation. De plus, la codification à 3 chiffres permet d'établir une palette "web" plus homogène et compatible.

Si les nouvelles valeurs ne sont pas visibles, c'est plutôt une question de rafraîchissement (caches yacs et browser).
Olivier on Apr. 10 2007 - #

si je comprends bien, on peut mettre dans yacs indifférement  #0077BB ou #07B ?

Lasares on Apr. 10 2007 - #
Olivier :

Exact.

Et pour plus de précision :

Vous devez ouvrir la feuille de style CSS avec un éditeur de texte et faire un remplacement glogal (search and replace) de toutes les occurences de #7b0 par #00FF73.
Olivier on Apr. 10 2007 - #

est-ce un bug ou est ce voulu ?

dans grigloo, si l'on est pas authentifié, il y a en doublon les champs de saisie de l'utilisateur et de son mot de passe.

Lasares on Apr. 10 2007 - #
Olivier :

C'est voulu. J'ai ajouté le formulaire d'authentification dans le menu Utilisateurs où je le trouvais plus approprié. Il faut par contre l'enlever du Menu principal, comme indiqué dans la rubrique Skin.php de la description de grigloo, en haut de cette page.

Alternativement, vous pouvez modifier skin.php dans le skin grigloo pour éliminer le changement que j'y ai fait.
Olivier on Apr. 10 2007 - #

merci.

si j'ai bien compris, le seul moyen est de modifier le script skin.php ?
le menu n'est pas modifiable dans les sections spéciales.

je n'aime pas trop aller dans les scripts, car c'est du chinois pour moi, mais je ferais un essai à tête reposée....

Lasares on Apr. 10 2007 - #
Olivier :

Pourquoi le menu n'est-il pas modifiable ? avez-vous une configuration spéciale ? n'avez-vous pas les droits d'associé sur le site ?

Normalement, un associé peut modifier ce menu en allant sur la carte du site et en cliquant sur Menus dans les Sections spéciales, puis encore sur Menu, puis enfin sur modifier. Il vous suffit alors de supprimer la dernière ligne qui se lit comme suit (sauf pour une espace supplémentaire volontairement insérée au début) :
[ anonymous][---][login][/anonymous]
Enregistrez et c'est tout. Voyez votre changement en page d'accueil, après avoir clos la session (log out).

Si vous désirez modifier skin.php, c'est assez simple. La modification, clairement identifiée, occupe les lignes 49 à 110. Supprimez-les dans un éditeur de texte en prenant soin de préserver le dernier crochet de fermeture en ligne 112 (qui ferme le crochet ouvert en ligne 17). Retournez le fichier modifié sur votre site par FTP.
GnapZ on Apr. 10 2007 - #
Lasares : Olivier parle d'une modification qu'il a effectué sur le MENU UTILISATEUR (entièrement intégré dans les scripts) et non d'un menu principal géré sous forme d'articles dans la section spéciale Menus.

Voilà pourquoi il a régénéré le menu utilisateur via skin.php et donc pourquoi il ne fait pas allusion au menu principal habituel.

Il souhait un seul et unique menu intégrant les paramètres propres à chaque utilisateur.
Lasares on Apr. 10 2007 - #
GnapZ :

Je ne suis pas sûr de tout comprendre, mais je saisis l'essentiel : on ne parlait pas du même menu.

Olivier:

L'autre façon simple d'annuler la modif que j'ai faite à skin.php, c'est tout simplement de placer le fichier skin.php du skin digital dans le dossier du skin grigloo, en remplacement du fichier skin.php qui s'y trouve déjà. En effet, celui de grigloo n'est qu'une modif à celui de digital qui lui a servi de modèle.
GnapZ on Apr. 10 2007 - #
Lasares :

Exact, il y a le menu principal, géré par un article dans la section spéciale "Menus" et le menu utilisateur (visible une fois connecté avec votre Pseudo comme titre).

Dans le cas d'Olivier, il s'agit du second et sa proposition est de remettre un skin.php original par dessus celui de Grigloo pour retrouver un environnement habituel.
Olivier on Apr. 10 2007 - #

Ok merci à vous deux.

j'ai modifié le menu en enlevant "anonymous---login/anonymous"
(j'ai enlevé les [ et les ] car sais pas comment faire autrement !)

Lasares on Apr. 10 2007 - #
GnapZ :

Je regarde de nouveau le site d'Olivier et je crois bien que la solution que je proposais est la bonne.

Le site présente 2 formulaire d'authentification :

-  l'un dans le Menu principal : placé là par défaut par yacs et que l'on peut supprimer par la carte du site

-  un autre dans le Menu utilisateur : placé là par le fichier skin.php de grigloo et non par une modif apportée par Olivier (et que l'on peut supprimer en modifiant skin.php de l'une des 2 façons suggérées).

Olivier peut peut-être préciser son besoin. On est 3 à vouloir que ça marche bien, on devrait y arriver .


Lasares on Apr. 10 2007 - #
Olivier :

Nos commentaires se sont croisés. Je viens de voir votre site. C'est bien ce que vous vouliez ?
GnapZ on Apr. 10 2007 - #
Bon et bien je me suis bien enmélé les pinceaux. Je fais trop de choses à la fois et ce fil est très actif aujourd'hui.

Donc rendons à César ... c'est Lasares qui est l'auteur du Skin et non Olivier comme j'ai pû le laisser sous-entendre. De plus, C'est Olivier qui pose des questions et Lasares est on ne peut mieux placé pour y répondre.

Afin déviter de perturber encore plus ce fil, je m'efface de la conversation car je crois que tout y est dit maintenant.

A vouloir bien faire, j'en ai trop fait et ça devient inmangeable ! Merci à tous.
Olivier on Apr. 10 2007 - #

Lasares : oui merci, c'est bien ce que je voulais.

Ceci dit, je trouve qu'avoir dans une seul menu toute l'identification c'est très bien aussi.

GnapZ: même si tu t'emmêles les pinceaux (chose que je n'avais même pas remarquée), tes interventions sont toujours utiles et appréciées.

merci à vous deux  clap

Lasares on Apr. 10 2007 - #
GnapZ :

Ben, voyons, Gnapz ! Il n'y a pas de mal. Je crois qu'Olivier a été bien servi et vous avez été le premier à lui répondre. En ces matières, il vaut souvent mieux prendre le risque d'en donner un peu trop que pas assez. Tout le monde en apprend un peu plus à chaque fois.

Merci.
Agnès on Apr. 10 2007 - #
Ben je vois que vous vous débrouillez très bien, tous autant que vous êtes ! Même pas eu le temps d'arriver

Allez, pour faire bonne mesure : auriez-vous quelque chose contre le fait d'ouvrir ce genre de discussion dans le forum des skins plutôt que directement ici ? - je me suis tâtée pour faire cette réponse, mais de fait, je me suis trouvée toute entière et m'en suis trouvée confortée dans ma proposition king
-----
Agnès
Il n'y a pas de problèmes, que des solutions.
Lasares on Apr. 10 2007 - #
Agnès :

Tout à fait d'accord. Je déplacerais ce fil moi-même si je savais comment. C'est faisable, je l'ai vu faire récemment, par Gnapz, je crois.

Merci de remettre l'ordre, chère "solutionneuse" toute entière.
Olivier on Apr. 11 2007 - #

ne me parlez pas d'ordre !  horror

si j'ai choisi YACS, c'est justement qu'il est ouvert au désordre et donc s'adapte bien à ma pensée qui peut partir dans tous les sens !:wink:

heureusement, on peut mettre une grisévaudanaise dans le moteur à yacs pour le remettre dans le droit chemin cool

Moi-meme on Apr. 12 2007 - #

Olivier : rapport à la répétition du formulaire dans l'article "menu" :

une autre solution moins destructrice consisterait non pas à effacer les codes du menu, mais à remplacer les anonymous par des hidden, ce qui aurait pour effet de ne rendre ce menu visible que pour l'associé.

 

Tof on Apr. 30 2007 - #

Merci beaucoup !

Si vous n'y voyez pas d'inconvénient, nous l'utilisons désormais pour notre site altairis.fr qui prend de fait un joli coup de neuf.

Amicalement, Tof


-----
Tof
Bernard on Apr. 30 2007 - #
Tof: Ce qui fait aussi, soit dit en passant, le preuve que YACS sépare réellement les données de leur rendu visuel, et que l'on peut changer ce dernier à tout moment, en jouant sur les feuilles de style, etc.
Lasares on May 1 2007 - #
Tof :

Non seulement, je n'y vois pas d'inconvénient mais ça me fait fichument plaisir. C'est pour être réutilisé que je l'ai placé là, ce skin. Et que vous y trouviez intérêt me fait chaud au coeur.

En passant, vous pourriez remplacer mon image header_image.png (dans le dossier images du skin) par votre propre logo, dont les couleurs s'harmonisent bien.

De plus, je vous soupçonne d'être l'heureux propriétaire d'un grand écran à haute résolution . En effet, le titre du site, sur mon écran du siècle dernier, se place sur 2 lignes, ce qui n'est pas très élégant. Solution : raccourcir le titre ou réduire la police (autour de la ligne 980 du CSS, chercher #header_title). AJOUT : ou utiliser des espaces protégées tel qu'illustré dans Un titre incroyablement long, absurdement long, supercalifragilistiquement long : pour un test.

Enfin, regardez aussi ce qui est dit plus haut dans ce fil si vous désirez éliminer un des deux menus utilisateurs.

Par ailleurs, j'ai trouvé beaucoup d'intérêt au contenu du site. Vous m'y reverrai bientôt, vous avez suscité ma curiosité avec inalta. A+
Tof on May 3 2007 - #

Et bien, merci Lazares !

Agnès vient de diminuer le titre et de remplacer le logo comme tu le suggérais. Elle est super contente de l'avoir fait en 10 minutes grâce aux commentaires que tu as inclus dans tes sources.

Je m'aperçois que je te tutoie; ça me vient facilement; dis-moi si cela te gêne.

Et merci de ton intérêt pour notre site ! Maintenant que l'on a une image qui nous plaît, nous pouvons nous concentrer sur le contenu (réalisation clients, ...).

Au fait, nous avons mis un lien en bas vers lesageconseil.com. Cela te convient-il ?

Cordialement,

Christophe


-----
Tof
Lasares on May 4 2007 - #
Tof :

Merci de ce lien. Quant à moi, j'en ai mis un vers votre site, sur www.siteoueb.com . Ça ne vous fera pas beaucoup de publicité, mais c'est mieux que rien.

Et quand je dis vous, c'est que je pense aussi à Agnès. Le tutoiement m'a fait plaisir.

A+
Moi-meme on May 18 2007 - #

Question à l'auteur du skin : lorsque tu fais une mise à jour d'un yacs skiné avec grigloo, comment récupères-tu les nouvelles fonctions ? Tu compares un skin de référence ligne par ligne ?

Fernand on May 19 2007 - #
Moi-meme :Excuses moi, je ne comprend pas bien ta question.
En l'occurrence, le skin tel quel ne fonctionne pas encore selon mes tests.

Philosophie du skin, pour mémoire: il s'agit de permettre de rajouter un bloc (une colonne ou autre chose). Cela nous savons le faire graphiquement avec les CSS.
Ce que je n'arrive pas à faire, pour le moment, c'est d'appeller dans ce bloc le contenu actif d'une section que l'on crée, faire en sorte qu'elle figure sur la carte du site, normalement, etc.

Mais en aucun cas, il ne devrait y avoir de problème lors des mises à jour, puisque le skin une fois nommé, les choses se cantonneront dans ses fichiers template.php, skin.php (éventuellement) et css...
Fichiers inhérents à ce nouveau (futur) skin.

Il s'agit justement pour moi de démontrer ici si l'on peut oui ou non faire évoluer un design, toucher aux skins pré-validés en rajoutant un bloc actif, sans toucher au coeur de YACS.
La réponse est évidemment oui.
Mais, pour être concrets, prouvons-le par un bon exemple, autrement nous ne serons jamais capable de "libérer" le graphisme de YACS.
Il manque le bout de code précis qui figure dans template. php (Je pense que Tof est vraiment tout près de la solution, même si ça ne marche pas pour le moment).
Bernard doit me le faire parvenir, mais j'ai l'impression qu'il est vraiment débordé en ce moment. Dés que j'aurai quelque chose, je le placerai ici... Si toi-même, GnapZ, ou quelqu'un d'autre avez quelque chose, envoyez-le ici sous forme d'archive zip, ou tgz.
Moi-meme on May 19 2007 - #

Fernand, je m'adressais à l'auteur du skin grigloo Donc ça n'est pas en lien avec les dernières évolutions par tof ou toi, mais bien avec le skin grigloo lui-même tel que présenté au tout début de ce topic par Lasares. Enfin je suppose que d'autres ont des répnses à ma question, mais je précise pour qu'il n'y ait pas plus de confusion.

GnapZ on May 19 2007 - #
Pour éviter de polluer l'article Grigloo avec Grigloo_Fernand, j'ai dupliqué cet article vers grigloo_fernand dans Fernandises.
Fernand on May 19 2007 - #
GnapZ : Ok
Pardon, Moi-même.

***** 1 rate
Source: http://www.360kmh.com/articles/view.php/61
Posted by Lasares on Mar. 16 2007, link updated by ThierryP on Jan. 1, (popular)