By paille | novembre 7, 2009 - 8:07 - Posted in blog


Votre blog reprend, comme sur le Pingouin.info, un thème "presse papier". Vous souhaitez ajouter une lettrine pour "renforcer" votre thème ?
Ce n'est pas très compliqué, voici comment faire...


Dans votre fichier style.css :
(dans l'admin WP : Apparence/éditeur/style.css)
Ajoutez :

.lettrine {
color:#110808;
float:left;
font-family:"Times New Roman",serif;
font-size:5.1em;
margin:-7px 4px -14px 0;
}

Vous pouvez personnaliser votre lettrine en modifiant la couleur, la taille ou la police. (dans l'exemple, c'est le code de celle du Pingouin)

Une fois ceci fait, inserez dans votre article (en mode html)

<span class="lettrine">D</span>

Et voila, vous obtenez votre lettrine !
(N'oubliez pas, évidemment, de remplacer la lettre "D" par celle voulue ! ) 😉


Creative Commons License Ce blog est mis à disposition sous un contrat Creative Commons.

Étiquettes : ,

Cet article a été posté le samedi, novembre 7th, 2009 a 20 h 07 min et est classé dans la catégorie : blog. Vous pouvez suivre les commentaires de cet article viaRSS 2.0 . Vous pouvez commenter :, ou faire un trackback depuis votre site.

Articles relatifs :

no nofollow

Les commentaires sont en dofollow, mais ne sont acceptés que les commentaires "non commercial".
Je supprime allègrement (et avec plaisir) les url non désirées....
Svp postez des com que si vous avez quelques choses à dire (et non pour le référencement)....
Merci :)

11 Comments

  1. novembre 7, 2009 @ 20 h 21 min

    Euuu y a encore plus simple pour pas avoir à mettre un à chaque fois, la class first letter. Tu l’applique sur ta div et la première lettre du texte de cette div sera stylisée comme tu le désire 🙂

    Posted by Touchcream
  2. novembre 7, 2009 @ 20 h 38 min

    Effectivement plus simple à l’écriture de l’article.
    J’voulais être le + simple possible pour que ça soit accessible à tout le monde, (même ceux qui ont peur des lignes de code)…
    Les autres auront compris grace à ton commentaire,
    Merci. 🙂

    Posted by Paille
  3. novembre 7, 2009 @ 21 h 28 min

    Tu as curieusement fermé ta balise ! Ça donne 🙂

    Posted by Yann
  4. novembre 7, 2009 @ 21 h 49 min

    Oups ! 🙁
    Merci, j’ai corrigé…
    Remarques c’est vrai que c’était marrant ! 🙂
    (Pour ceux qui n’ont pas vu j’avais mis « spam » à la place de « span »….)

    Posted by Paille
  5. novembre 7, 2009 @ 22 h 31 min

    Il est curieux mon commentaire ! On dirai qu’il manque la fin.
    Pas grave. C’est vrai que c’était rigolo 🙂

    Posted by Yann
  6. novembre 8, 2009 @ 0 h 18 min

    Bonsoir,

    Il y a encore plus simple avec ce plugin : DropCap First Character (http://www.rc.au.net/blog/2006/07/27/dropcap-first-character-wordpress-plugin/).

    On le télécharge, on l’installe, on l’active et hop, le tour est joué…

    Enjoy it !

    Posted by patkban
  7. novembre 8, 2009 @ 7 h 30 min

    @ Yann il manque la fin ?

    @Patkban : Merci pour ce plugin,
    personnellement je préfère éviter les plugins lorsqu’il y a moyen de faire autrement….

    Posted by Paille
  8. avril 25, 2012 @ 3 h 41 min

    Merci pour cette article, je cherchais un plugin pouvant remplacer par des images, mais c’est bien plus propre en css. Reste plus q’un beau style a appliqué avec un bel ombrage et ca sera parfait.

    Posted by julien
  9. mars 2, 2013 @ 18 h 37 min

    Bonjour,

    ce billet n’est pas tout récent, mais merci beaucoup. Après avoir essayé plusieurs plugin qui n’allaient pas, cette solution est parfaite, et juste ce que je cherchais.

    Posted by Lionel
  10. mars 25, 2013 @ 12 h 40 min

    Oui le billet est vieux mais ça fonctionne toujours.
    Content que ça puisse vous servir. 🙂

    Posted by Paille
  11. juillet 31, 2013 @ 13 h 18 min

    Merci pour ce truc très sympa.
    Je viens de le tester sur un site qui me sert à mes expériences avant de le mettre en place pour de bon.(je ne mets pas l’url pour n’indisposer personne !)
    Comme j’utilise Mystique, j’ai réduis la taille à 3em et c’est parfait.
    Il est vrai que chaque fois que l’on peut éviter un plugin, c’est bon à prendre.
    On évite souvent les ralentissements et les failles de sécurité.
    Je vais essayer la class first letter, comme tu l’imagines, je ne suis pas un expert en css !
    Encore merci pour ce partage.

Leave a Comment