top

Aller au contenu | Aller au menu | Aller à la recherche

 

mardi 1 juillet 2008

Configurer le thème : freshyOne, sober et tabsOne

Depuis la RC1 de dotclear 2, il est possible de définir des préférences pour des thèmes. J'ai utilisé cette possibilité pour trois thèmes freshyOne, sober et tabsOne. Pour configurer les thèmes, je suis parti du travail de dsls et du portage du thème Freshy 2.

sober

sober.jpg sober2.jpg

Ce thème a été créé dans l'optique d'avoir plusieurs variations chromatiques : blanc/rouge, blanc/bleu/orange, noir, orange, olive et ciel. Il fallait modifier à la main le fichier style.css pour choisir la couleur ou prendre un thème particulier. Maintenant, il suffit de choisir sa variation.

freshyOne

freshyOne
Ce portage de thème Wordpress contient à l'origine la possibilité de choisir l'image d'en-tête ainsi que la couleur de fond lors du choix d'un élément. Ces deux paramètres sont accessible à partir de l'administration de DC2.

tabsOne

tabsOne.jpg
Ce thème contenait deux fichiers de style - bleu et magenta -, il suffit de choisir maintenant classique, bleu ou magenta.

jeudi 18 octobre 2007

greyOne, photoblog thème

greyOne.jpg

Après plusieurs tentatives peu heureuses, j'ai fini par mettre en forme le thème photoblog qui me convient. Un cadre arrondi pour visualiser la photo, un style noir/gris aperture ou lightroom like, un peu web 2.0… Le menu est en javascript mais simple. Pas de librairie complémentaire à charger…

… sauf en utilisant dclightbox ou dcthickbox. Petit détail esthétique qui a son importance, le positionnement des images doit être soit aucun soit centré.

greyOne est un thème liquide de 950 px avec une colonne et peut accepter des photos de 800 px.

Support opérationnel à partir de novembre 2007. :roll:

Télécharger le thème.

mardi 31 juillet 2007

Ornamentals, mon premier thème pour photoblog (màj : 05/08/07)

Ornamentals prévisualisation

Ceci est mon premier thème pour photoblog, il utilise le greffon photoblog 0.1 pre-alpha--2--4 de Julien Mudry ou zeiram sur le forum de Dotclear. Pour la présentation de ce greffon, je vous invite à lire le billet de présentation. Petite mise en garde, le greffon est en alpha donc il fonctionne mais il est encore en phase de débugage.

Le thème est, lui aussi, en version beta. Il a été testé sous Firefox 2 (Mac & PC), Safari 2 et 3 (Mac & PC), IE 6 & 7 (après de longues épreuves…) ainsi que sous Opera 9.2 (Mac). En dehors du greffon photoblog, il y a une condition obligatoire pour qu'il soit pleinement fonctionnel : cocher, lors de l'ajout d'une photo, En tant que lien vers l'image originale. Et pourquoi ?

Ornamentals est un thème utilisant la librairie jQuery et les librairies Accordion et imagebox en version modifiée. Pour mettre en valeur les photos, la barre latérale ne montre qu'une division à la fois en accordéeon. Imagebox est la version la plus proche de lightbox en jQuery, il suffit de cliquer sur la photo. D'où la présence d'un lien sur la photo.

Il est possible de mettre du texte dans un billet en plus de la photo. Par contre, il faudra séparer la photo du texte soit par 2 retours à la ligne ou l'utilisation du retour chariot dans la barre d'outil de l'édition de billet sinon cela perd de son charme…

L'explication de texte et débugage pour plus tard. Après quelques retours et autres demandes. Cliquez sur la photo pour accéder au photoblog de test.

màj 05/08/07 : J'ai adapté le thème à la dernière version du greffon et de ses nouveaux templates. La barre de navigation utilise l'effet N&B/couleur, les flux RSS sont envoyés dans le footer et J'ai corrigé quelques bugs.

Télécharger le thème.

dimanche 22 avril 2007

Bréderode, Slottsbacken & Thames Street, pattern is hype

brederode.jpg slottsbacken.jpg thamesstreet.jpg

En cette journée toute présidentielle, trois nouveaux thèmes avec une barre de navigation à gauche, à droite et au centre - en bas quoi. Surtout rien à l'extrême-droite ni rien sur l'identité nationale. Fini les grands aplats de couleur, le papier peint est à la mode. Nostalgie quand tu nous tiens ! Un cadre tout doré pour encadrer des photos, des tableaux.

Avec les navigateurs modernes - suivez mon regard… -, la transparence laisse paraître les motifs gris et bleus. Le rouge se marrie avec l'orange mais juste dans les rêves éveillés. Sous l'ineffable IE 6, la transparence disparaît et la structure devient fixe mais tout est fonctionnel. Ouf ! Un grand au revoir avant la prison.

Les thèmes sont plutôt adaptés à une résolution 1024 x 768 px même si le 800 x 600 px est fonctionnel.

Télécharger Bréderode, Slottsbacken et/ou Thames Street.

mardi 6 février 2007

Troisième pas en jQuery avec Dotclear 2, création d’onglets avec effets de transition et intégration au thème Freshy

freshyOne La mise en œuvre d’un menu de navigation par onglet demande de modifier les fichiers de structure de Dotclear 2, cela va permettre un peu de créativité et donc de chambouler la structure classique d’un blog DC2.

Le script jQuery utilisé est Tabs. Deux exemples, tout d’abord celui de l’auteur, exemple des différents possibilités et effets de transition, et, ensuite, celui de Pep tant qu’il ne change pas de thème.

La première partie portera sur la construction et l’intégration d’un menu de navigation par onglet s’insérant dans la structure de Dotclear 2. La deuxième partie s’intéressera à l’imbrication des effets affichage/masquage dans un menu de navigation existant – celui intégré dans le somptueux thème Freshy -, à l’utilisation des templates de Dotclear 2 et à la bataille de la comptabilité avec les principaux navigateurs internet.

Télécharger le thème freshyOne.

Lire la suite...

vendredi 19 janvier 2007

monster in love, rouge sang

monsterinlove

monsterinlove est un thème fixe 2 colonnes de 950px. J'avais envie d'un thème flamboyant, un joli rouge sang, et de titres bien gras, ce sera monsterinlove. Avec des petites giclées... de sang.

Bref, c'est un thème un peu concept...

Télécharger le thème.

vendredi 8 décembre 2006

123 Ice

123Ice.jpg

Dans ma collection 3 colonnes, voilà 123 Ice. C'est une adaptation monochromatique de 123 Blue. J'essayais de placer la photo du top - plateau de Retord - et j'ai trouvé qu'elle allait bien.

Ce thème hivernal est un thème liquide 3 colonnes qui permet de mettre des photos de 500px. Pour gagner de la place et éviter les problèmes de correspondances de couleur, j'ai coupé le top en deux images. Dans #top, il y a l'habillage et dans #top h1, il y a la photographie proprement dite. De fait, cela permet de personnaliser plus facilement le top.

Télécharger le thème.

samedi 4 novembre 2006

Chocolate & biscuit : caisson de résonance

Chocolatandbiscuit.jpg

Pas de structure particulière, juste une envie de faire un thème avec une baffle. Des couleurs chocolat et biscuit avec un peu de bruit pour faire la patine du temps.

C'est un thème 2 colonnes en version large en taille et en poids aussi. Le png, c'est W3C mais cela reste lourd…

Télécharger le fichier.

Maj : pour avoir une police plus grande avec le formulaire de commentaire, il faut supprimer dans #comment-form input, #comment-form textarea :

font-size: 0.8em;

Ajout du survol de lien pour les pièces jointes et les commentaires.

#attachments a:hover { text-decoration: underline; color: #421806; }

#comments dd a:hover, #pings dd a:hover { text-decoration: underline; color: #421806; }

lundi 30 octobre 2006

Pastel like en version large & suite des overflow d'IE

Pastellarge.jpg

Pour mes besoins personnels, j'ai eu besoin de créer une version Pastel light avec la possibilité d'avoir des photos de 700px de large. J'aime bien voir mes photos en version large… ;-)

Télécharger le fichier.

Orange.jpg

Pour d'autres besoins, j'ai créé une version orange de Pastel large. Je suis assez mono-maniaque et je pense qu'il sera mon thème par défaut quand je passerais mon blog sous DC2. Cela sera le cas dés que dsls aura finalisé le plug-in Galery pour DC2.

Télécharger le fichier.

J'ai remarqué des problèmes d'italique avec le thème ! Lors de test, je n'avais rien vu et m'amusant avec Orangeworld sous IE 6, l'horreur apparu. Après, j'ai vu la catastrophe dans les commentaires chez [SIMON], c'était pire…

Il suffit de mettre rajouter overflow: visible à #main et #content. Les thèmes Pastel et Pastellight sont à jour. Vivement qu'IE 7 envahisse la planète…

samedi 23 septembre 2006

123 Blue

123blue.jpg

Dans ma nouvelle collection de thèmes, je demande le deuxième des thèmes 3 colonnes.

Ce thème nuageux est un thème liquide qui permet de mettre des photos de 500px. Les barres de navigation sont flottantes pour permettre aux différentes divisions d'être correctement à leur place tout en ayant un habillage en images, c'est un peu tarabiscoté en terme de construction. Après m'être battu entre l'installation de windows sur un mac intel et mon fil ethernet définitivement trop court, j'ai trouvé le dernier - ? - bug d'affichage.

Màj : Correction du bug d'affichage sous IE avec le style italique.

Màj 2 : Changement de la structure. En terme d'affichage, il n'y a pas de changement. Pour modifier le thème, la nouvelle version est plus robuste et facile à modifier.

Télécharger le thème.

- page 1 de 2