• Modifier "Lire la suite"

    Voici comment modifier le bouton "Lire la suite..."

    Modifier "Lire la suite..."


    RAPPELS :

    - Vous pouvez cliquer sur TOUTES les images pour les voir en plus grand
    - Le code CSS est à placer ici :

    Installer une police et l'utiliser

              C R É E R   L E   " L I R E   L A   S U I T E "          

    Oui, car beaucoup se demandent comment faire ça.
    Il y a 3 onglets lorsque vous écrivez un article.
    Modifier "Lire la suite..."

    Vous écrivez le contenu de votre article dans l'onglet "article", mais le texte qu'il y aura affiché avant le "Lire la suite" est à mettre dans le "chapô".

    Modifier "Lire la suite..."


              M O D I F I E R          

    Maintenant, nous pouvons le modifier. Nous allons utiliser la propriété " article_readmore a".

    .article_readmore a
    {color:#COULEUR ;
    background:#COULEUR;
    padding:NOMBREpx;
    border:NOMBREpx STYLE #COULEUR
    font-family:NOM DE POLICE;
    font-size:NOMBREpx;
    font-weight:EPAISSEUR DE LA POLICE;
    }

    color : la couleur du texte du bouton. Il faut la remplacer par un code hexadécimal. Vous pouvez le trouver grâce au Color Picker Pro dans le menu.
    background : la couleur du fond du bouton. Comme pour le texte, il faut la remplacer par un code hexadécimal.

    padding : l'espace entre le bord et le texte. Plus cette valeur est élevée, plus l'espace entre les deux sera grand.

    border : les bordures du bouton. Dans le champ "NOMBREpx", il faut mettre l'épaisseur de la bordure.
    Dans le champ "STYLE", il faut mettre l'une de ces propositions :
    Si vous voulez, vous pouvez également changer le style de la bordure, c'est à dire que :
    solid est la bordure classique
    dotted est la bordure en pointillés
    dashed est la bordure en tirets
    double est la bordure double
    Dans le champ "COULEUR", c'est comme "color" et "background". Il faut un code hexadécimal.

    font-family : la police. Il faut que vous choissiez une police proposée par eklablog : Arial, Arial Black, Comic sans ms, Courrier New, Georgia, Impact, Lucina Console, Lucina Sans Unicode, Palatino Linotype, Tahoma, Times New Roman, Trebuchet MS, Verdana, MS Sans Serif, MS Serif.
    Sinon, vous pouvez mettre une police que vous avez installé vous même. Si vous voulez faire, mais que vous ne savez pas comment, go ici !

    font-size : la taille de la police. Il vous faut un chiffre ou un nombre que vous allez placer juste avant le px selon la taille que vous souhaitez.

    font-weight : pour mettre la police en gras. Pour rendre ça gras, il faut mettre "weight", ou sinon "normal".


    Si vous souhaitez changer le bouton au survol, il suffit d'ajouter :hover après la propriété.


    .
    article_readmore a:hover
    {color:#COULEUR ;
    background:#COULEUR;
    padding:NOMBREpx;
    border:NOMBREpx STYLE #COULEUR
    font-family:NOM DE POLICE;
    font-size:NOMBREpx;
    font-weight:EPAISSEUR DE LA POLICE;
    }


     Si on prend ce code :
    .article_readmore a
     {background:#dbc404;
    color:#ffffff;
    padding:3px;}
    .article_readmore a:hover
     {background:#ffffff;
    color:#dbc404;
    padding:3px;
    font-weight:bold;
    } 

    Ça va donner ceci :

    Lire la suite


  • Commentaires

    Aucun commentaire pour le moment

    Suivre le flux RSS des commentaires


    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :