Personnaliser sa feuille de style avec Blow up

Une des nouveautés majeures de la version finale de Dotclear 2 est l’arrivée du thème entièrement personnalisable Blow up. Il s’adresse clairement au grand public et aux personnes peu familières avec le langage CSS. Désormais, plus besoin de vous plonger dans le code, tout est paramétrable en quelques clics : changements des couleurs, du header, polices… Avec un peu de temps et de goût, vous pourrez obtenir un blog à votre image très facilement. Attention toutefois, un résultat peu harmonieux peut avoir des répercussions négatives. N’hésitez donc pas à demander conseil autour de vous ! Voici une présentation de ce nouveau thème et des possibilités offertes.

Pour personnaliser le thème Blow up, rendez-vous sur votre tableau de bord. Allez ensuite dans « Apparence du blog », sélectionnez Blow up puis validez. Il ne vous reste qu’à cliquer sur Configuration du thème (à droite). C’est parti !

• Les styles prédéfinis

Ce thème ne propose pas une feuille de style, mais pas moins de 10 styles prédéfinis. Libre à vous de repartir d’un de ces pré-réglages voire de l’adopter. Voici un aperçu de ces styles (cliquez pour agrandir et naviguer d’image en image).

• Général

Vous pouvez y régler les paramètres globaux de votre feuille de style. Vous pouvez ainsi choisir la couleur de fond, son dégradé, la couleur du texte de vos billets, sa taille, sa police ainsi que l’interligne. Cliquez sur la pipette pour régler la couleur voulue. Attention aux couleurs trop flashy ! Trop de couleurs n’est également pas une bonne idée, le mieux pour le texte est généralement de la laisser en noir.

• Liens

Il est important de faire ressortir vos liens pour qu’ils ne se perdent pas au milieu de votre texte. Vous avez la possibilité d’en distinguer trois. Les liens non-cliqués, les liens cliqués et les liens survolés. Vous l’avez sans doutes remarqué sur de nombreux sites, les liens cliqués ont généralement une couleur plus terne que les autres. N’oubliez pas de garder cet aspect pour que vos visiteurs s’y retrouvent 😉

• Haut de page

Vous pouvez ici changer la couleur du prélude (la bande tout en haut du blog). Vous pouvez surtout customiser votre titre : taille, couleur, alignement (centre, gauche, droite), police… Encore une fois, attention à garder une harmonie sur le blog : les couleurs et les polices ne doivent pas se mélanger à l’excès.

• Image d’en-tête (header)

Vous avez le choix entre une dizaine de headers. Mais vous avez une possibilité intéressante : choisir votre propre header. Attention, l’image utilisée doit être au format 800*130 pixels. Attention également à ne pas charger une image trop lourde qui ralentirait votre blog. De nombreux sites proposent des headers gratuits de qualité. Vous pouvez également faire parler votre créativité. Le header est un des points forts du blog, il convient donc d’y prêter attention !

• Bandeau (sidebar)

Vous retrouverez ici tout ce qui se rapporte au bandeau de navigation (sidebar). Vous pouvez y changer tous les éléments (de design) : couleur, police et taille des titres, sous-titres et des textes. Vous pouvez également changer la couleur des différents types de liens mais aussi des lignes.

• Billets

Encore une fois, tout est paramétrable à l’intérieur de vos billets : couleurs, taille et police des dates, titres et commentaires. A noter : vous pouvez différencier la couleur du fond et du texte de vos propres commentaires pour les démarquer des autres. La couleur du texte du billet se règle dans la partie Général.

• Pied de page (footer)

Cette partie concerne la partie basse de votre blog. Vous pouvez personnaliser les différentes couleurs (texte, fond, liens) ainsi que la taille et la police du texte.

• Import / export de configuration

Une fois vos réglages effectuées, il ne vous reste plus qu’à sauvegarder. Une fois sauvegardé, vous pouvez garder une copie des paramètres de cette nouvelle feuille de style. Pour cela, dépliez la partie « Import / export de configuration » (tout en bas) puis conservez précieusement ce code. Il permettra à un autre membre de la plateforme de récupérer cette configuration. Cela peut également vous permettre de réaliser plusieurs créations sans les perdre. Pour revenir sous une précédente feuille de style, il vous suffit de coller le code au même endroit et de cliquer sur « Appliquer le code ».

Une bonne manière de construire votre propre feuille de style est d’observer auparavant comment sont faits les styles prédéfinis. Vous remarquerez que des codes ressortent : police, couleurs des titres et de la sidebar… Des rappels sont faits pour donner de la cohérence. Le nombre de couleurs utilisées est généralement limité, de même que les polices utilisées.Enfin, pensez à opter pour des couleurs qui s’accordent bien ! De nombreux sites vous proposent des codes couleurs. Bonne exploration !