Woof
Par Kozlika. lundi 15 décembre 2008, 23:00. Thèmes pour Dotclear 2 | Lien permanent.
Vous avez vu ou entendu parler de Hair ? C’est à cette comédie musicale que ce nouveau thème doit son nom. Woof en est l’un des personnages. Cette œuvre aussi emblématique des années 70 que le combi VW du footer et les illustrations et couleurs ici utilisées.
Sur deux colonnes (disons trois si l’on tient compte du sidebar divisé en deux verticalement) de largeur fixe (940px), Woof fait pousser les fleurs, rend les joues roses, favorise la barbe et les cheveux longs et apporte la paix aux esprits chagrins.
Attention si vous placez souvent des images dans vos billets : pour faire jouli j’ai appliqué une transparence au fond des div.post. Sur les images ça donne un p’tit brouillard que vous aimerez… ou pas. Si vous n’aimez pas, deux solutions s’offrent à vous :
- supprimer les règles de transparence dans style.css ;
- placer tout élément pour lequel vous voulez un fond mat dans une
<div class="opaque">.
Les fonds transparents sont en effet automatiquement transmis à leurs « enfants » sauf si l’enfant est une div avec des règles spéciales. Autrement dit, pour ceux d’entre vous auxquels je ne cause pas chinois, une règle appliquée à .post img {} est hélas sans aucune efficacité. En revanche on peut annuler la transparence sur une div, d’où la création dans style.css d’une class “opaque”.
J’espère que vous vous amuserez autant à utiliser ce thème que moi à le faire :-)
Woof sur DotAddict :
Commentaires
Mouarff, c'est trop super cool comme théme. Un super Karma moi je dis... si le blogue avait existé en 70 je suis certain que ce théme aurais fait un tabac! bon manque juste les pattes d'eph...
Rhaaaa lovely ! je ne sais pas encore si je vais l'utiliser, mais en tout cas félicitations ce thème est superbe :)
Je voudrais utiliser le combi à la place de l'arbre, est-ce que par hasard tu l'as en plus grand ?
Je l'ai achetée (j'ai d'ailleurs oublié d'en créditer l'auteur, je le ferai dans une prochaine mise à jour, j'attends un peu les retours de bugs ou améliorations)
Tu me diras où le voir quand tu auras fini ton thème ? :-)
J'en reste … baba :-*
C'est plutôt sympa... après je ne l'utiliserai pas personnellement. TU dis que tu as acheté les images... mais peut-on redistribuer (via un thème comme le tien) ses images ?
Après plusieurs téléchargements, je me retrouve toujours avec ce petit souci: l'archive de ce thème ne contient dans son dossier "tpl" que les fichiers "archives_months" et "post".
Il en manque pas quelques uns là ? :-)
Jean-Michel > je n'ai pas le droit d'en distribuer le fichier vectoriel ni de la revendre ; la distribution de ce thème ne me plaçant ni dans un cas ni dans l'autre, tout va bien.
Tony, non il ne manque rien. Dotclear va chercher les fichiers dans le répertoire du thème ; s'il ne les y trouve pas il va les puiser dans le thème par défaut. Il n'est donc nécessaire de placer dans le thème que les fichiers qui diffèrent de ceux par défaut.
Bon ça demande sans doute quelques ajustements, mais l'idée générale ressemble à ça : http://www.oum.fr/.
Très peu de changement comme tu vois ^^
En revanche le fond orange pour le formulaire des commentaires... là j'ai un doute :D
Oum : j'adore ! Si tu as besoin d'aide pour poursuivre tes ajustements, n'hésite pas :-)
Intéressant… j'avais jamais lu leur contrat comme ça. Je note !
Mmmm j'ai un problème avec IE7 (étonnant non ?), je pense que c'est le #wrapper qui est trop haut, as-tu une idée ?
Erf ça ne va pas être simple, j'ai un Mac. Déjà, première chose de premièrement, le thème sans modif (par exemple à visualiser depuis la démo de dotaddict) présente-t-il le même souci ? Si oui il faut que je corrige ce bug. Si non c'est que c'est consécutif à ta (tes) modifs.
Si donc tu peux me répondre sur la deuxième question et si cette réponse est que ça passe bien sur la démo, liste-moi les modifs que tu as effectuées.
(Sinon sur un plan sémantique, la description de ton blog serait plus mieux bien dans un paragraphe, auquel d'ailleurs il faudrait donner une marge gauche suffisante pour que ça ne vienne pas par dessus le van :-))
Je te confirme que le problème du wrapper trop haut sur IE7 est visible aussi sur la démo de dotaddict (si tu veux je te fais parvenir une copie d'écran).
Pour la description qui passe sur le combi, effectivement, ayant un écran large 16/10 je ne m'en étais pas rendu compte, je vais corriger cela.
Merci pour ton aide en tout cas :)
Ben c'est malin, mon simulateur d'IE le place correctement :/
Je regarde ça et je reviens…
Zut je n'arrive pas à accéder à mes fichiers pour le moment. Dans le fichier layout.css essaie de remplacer la règle de margin de #wrapper par :
13ème jour sans internet, je te fais un retour dès que je peux :|
Pas de souci, Oum !
Salut,
Bravo pour le thème qui est très réussi. Dommage qu'il ne passe pas bien sur IE6 et IE7. Ca sera sympa de le préciser dans son descriptif.
Je vais refaire complètement le CSS qui est selon moi bien trop complexe. Souhaites-tu que je te communique après ?
a+
Bonjour Waddle, as-tu lu les commentaires précédents ?
oui, j'ai regardé lu les commentaires, mais il y a bien plus de problèmes que ça. L'arbre a la sidebar par dessus, la sidebar est en bas de page sur IE 6, il n'y a pas d'arrondis aux angles des posts, le hover des lien est rose a fnod blanc, etc.
J'ai pas tout regardé, donc il y en a surement d'autres. Sachant que IE 8 sort bientôt, je préfère reprendre le thème et refaire tout le CSS plus "simplement".
Quoi qu'il en soit, bravo pour ton thème qui est vraiment sympa.
Le sidebar est évidemment par dessus l'arbre sous IE puisqu'il fait partie du wrapper ! Ce problème sera donc résolu par le code indiqué dans le commentaire que tu as lu. Cette modif sera intégrée à la prochaine mise à jour du thème ainsi que je l'ai indiqué, en attendant il suffit de la faire dans la css une fois le thème téléchargé.
Le sidebar en bas de page sous IE6 n'a pas été constaté par les testeurs ni sur le blog de démo de Dotaddict, vérifie le contenu de tes billets ou la validité de ton xhtml, ils sont sans doute en cause.
La couleur des liens est volontaire. L'absence d'arrondis aux angles des posts pour qui utilise IE aussi, de même que l'absence de transparence en fond des billets ; je ne veux pas surcharger le thème avec des images de coins arrondis ou du javascript, il reste très présentable avec ses coins carrés pour ceux qui ont la malchance de naviguer avec Explorer.
Quant à faire la CSS « plus simplement », vu qu'elle n'a strictement rien de compliqué ça me laisse pour le moins dubitative, sauf à appauvrir la présentation en réduisant les variations de couleurs. Et ça n'est certainement pas en voulant avoir un rendu strictement identique sur tous les navigateurs que tu vas réussir à la « simplifier »...
En tout état de cause, ce thème est en GPL tu en fais ce que tu veux du moment que tu en respectes les termes et les crédits de leurs auteurs pour les illustrations.
Ce n'est pas la peine de te braquer comme ça. Je vais refaire le CSS, et on en discutera après. On pourra échanger, ce qui sera plus productif.
Oui, c'est du GPL donc j'en fais ce que je veux, mais je suis pas dans une démarche de "vol" mais de collaboration.
Dernier point, je déteste IE au moins autant que toi, mais je trouve dommage de ne pas faire un thème aussi beau sur IE qu'il l'est sur FF. Je comprends que tu aie un Mac, que tu utilise FF pour le dev, mais c'est malheureusement un effort à faire. GPL c'est aussi de la collaboration, et tu aurais pu en trouver pour te le valider nickel sur IE (j'ai du mal à croire à cet argument de "lourdeur"...)
Bonjour,
je commence à tester ce thème pour un « client » qui a besoin d’une compatibilité optimale des navigateurs et je suis donc cette discussion avec intérêt.
Contrairement à toi, Waddle, je ne dirais que Kozlika se « braque ». Je fais partie, comme elle, des gens qui défendent leur démarche, sans pour autant être réfractaire au dialogue. Et, si tu veux mon avis, la bonne méthode pour ouvrir une discussion constructive n’est pas de laisser entendre : « c’est sympa, mais je vais tout refaire parce que ça ressemble à rien ».
Je ne te connais pas, et n’ai donc pas de moyen d’estimer ta compétence en css, mais je fais largement confiance à celle de Kozlika qui y baigne de longue date…
En tout état de cause, je ferai état ici de mes avancées z’où hésitations.
Waddle, tu devrais lire le Tao du design web. L'objectif d'un design web n'est pas d'avoir un rendu similaire en toutes circonstances (navigateur, résolution d'écran, etc.) mais un rendu satisfaisant partout. Je tiens à corriger le wrapper qui remonte parce que c'est un bug, s'il y a d'autres bugs je les corrigerai également, on avait d'ailleurs commencé le diagnostic avec Oum, qui m'a lâchement abandonnée ;-)
En revanche, je ne modifierai pas les points que j'ai évoqués plus haut, car, comme je te l'ai dit, avoir un rendu similaire demande des acrobaties parfaitement inutiles à une présentation correcte et agréable de Woof.
Il m'arrive souvent d'utiliser des hacks ou des contournements quand la « dégradation » (à prendre au sens anglais) du graphisme y perdrait ; quand ça n'est pas le cas je m'en abstiens.
Et il faut prendre au pied de la lettre ce que je disais au sujet du GPL : tu peux faire d'autres choix que moi et modifier ton thème en conséquence, c'est à ça que cette licence sert. D'ailleurs si je commente beaucoup les sources de mes thèmes et si je veille à les organiser clairement c'est précisément pour aider au mieux leur personnalisation par leurs utilisateurs.
Je viens juste pour dire que j'aime beaucoup le thème :)
Et pourtant je ne suis pas fan des 70s, mais j'aime beaucoup les couleurs. En cette période de grisaille, ça me fait du bien de voir des couleurs pétillantes sur mon blog.
Tu donnes envie de mettre ses mains dans le cambouis et de créer son propre thème, mais pas le temps malheureusement. Merci en tout cas pour ce thème !
Arf désolé kozlika, je n'étais plus vraiment sur le coup ces derniers temps ^^
Quoi qu'il en soit j'ai trouvé un petit bug dans la feuille de style, ligne 174 il y a une virgule en trop à la fin de la ligne, du coup la définition qui fonctionne correctement dans IE n'est pas du tout prise en compte dans les autres navigateurs... enfin pas sous Vista en tout cas.
Sinon j'ai apporté quelques modifications mineures, notamment la couleur du formulaire de commentaires, décidément l'orange j'accrochais pas du tout ;-)
J'ai aussi dû ajouter une bordure et un fond au #top pour compenser le fait que le vertical.png rendant le titre pas trop lisible... c'est la solution la moins vilaine que j'ai trouvé mais j'en reste pas trop convaincu... si tu as une autre idée je suis ouvert ^^
Beaucoup de choses fonctionnent étonnamment bien dans Opera Mobile 9.5 (pour Window Mobile), que ce soit en css ou en javascript, mais la transparence est gérée bizarrement : les images incluses dans les billets s'affichent, mais aucun texte... quelqu'un a-t-il une idée là-dessus ?
Légère optimisation css : concernant la transparence, les propriétés -moz-opacity et -khtml-opacity ne sont en fait plus utilisées dans Firefox depuis longtemps, et il existe une propriété spécifique pour IE8.
On peut donc remplacer les lignes du genre :
-khtml-opacity: 0.8;
-moz-opacity: 0.8;
opacity: 0.8;
filter: alpha(opacity=80);
par :
opacity: 0.8; /* Firefox, WebKit (Safari, Chrome), Opera */
zoom: 1; filter: alpha(opacity=80); /* IE 4-7 */
-ms-filter: alpha(opacity=80); /* IE 8 */
Voir ci : https://developer.mozilla.org/en/CS...
Et la transparence fonctionne partout :)
J'utilise ce thème depuis plusieurs mois maintenant, je l'ai pas mal modifié pour l'occasion (ou charcuter, si on considère mon niveau en code^^).
Bref, juste pour te remercier, tu as accomplie un super travail, j'en suis tombé amoureux dès le premier clic.
Par là si tu veux voir : http://samkat.free.fr n_n
Bonjour Kozlika J'espère que tu passeras dans le coin rapidement parce que j'ai été bluffée par un drôle de site trouvé lors d'une recherche aujourd'hui et je voulais t'en parler. Surtout que ton thème n'est absolument pas commun et tape à l'oeil illico (/zlika) quand il se promène sur le web :
http://www.biotechno.fr/Construire-...
Est-ce que ça voudrait dire qu'on peut ne pas mentionner le créateur du thème qu'on utilise ?
ou qu'il n'y a pas de droits d'auteurs pour les thèmes ?
Je continue mes recherches sur l'utilisation de ton thème.
Ah mais je vois que tu avais donné ton accord en 2005 ! soit 3 ans avant de concevoir le BB Woof. C'est bien toi, plus vive que l'éclair, plus prompte que la foudre!
En suivant les liens j'ai donc trouvé ceci:
http://www.spip-contrib.net/Spip-Cl...
" Spip-Clear 14 avril 2005 – par ben.spip, James
Un squelette de blog parmi les autres, entièrement pompé (avec la permission du concepteur) sur le thème par défaut de DotClear. "
Je ne savais pas que ton Woof était le thème par défaut de DC. Effectivement c'est un peu Woof.
Uh uh ! Merci de ta vigilance, Verveine :-)
En fait en 2005 ce site avait en effet utilisé le thème par défaut de l'époque avec l'accord du papa de Dotclear (Olivier Meunier). Depuis je vois qu'ils ont en effet adopté Woof, qui n'est pas crédité en partie « publique » (mais dans celui que je livre non plus), mais dont ils ont conservé la mention de licence dans le fichier de style. La licence est donc bien respectée :-)
ben Ouf alors
Bonjour, j'utilise ce thème pour mon blog de fille ^^, et je le trouve super, c'est tout à fait mon style.
Salut!
Je voulais juste te signaler que j'ai adapté ton (superbe) thème à Wordpress, pour le site web de ma compagne: http://www.miniueca.net/
(les crédits sont cachés dans la feuille de style, mais je vais essayé de trouver un petit coin pour les rendre plus visibles)
En tout cas merci pour le thème!
Bonjour,
super thème! Par contre comment rendre les cadres blancs transparents (comme sur la page principale) sur les pages billets? Ou bien carrément les supprimer?
Par avance merci!
Bonjour Jack,
Il y a une règle pour
.dc-post .post {}, qui débute ligne 529 de style.css pour moi :opacityle fond sera comme sur la page d'accueil ;background– actuellement #fff – partransparent, il n'y aura pas de fond du tout.Merci bien!