Comment créer un bouton »lire la suite » ? (Créer un compte)

  • Statut : non résolu
15 sujets de 1 à 15 (sur un total de 28)
  • Auteur
    Messages
  • #499398
    Invite 40
    Membre
    Initié WordPress
    24 contributions

    Bonjour,

    Ma configuration WP actuelle
    – Version de WordPress : 3.2.1
    – Thème utilisé : LightWord
    – Extensions en place : WP Forum Server, Akismet, reCAPTCHA, etc.
    – Adresse du site : http://micro-informatique.fr

    J’ai certains articles qui sont longs, et cela m’embête de les mettre en entier; j’utilise donc la balise HTML , mais le lien « lire la suite » est en gris et n’est pas très visible. J’aimerai pouvoir créer un bouton « lire la suite » avec un fond orange, gris ou bleu très pâle et par la même occasion apprendre comment faire avec les autres liens du site, si ce n’est pas trop demander 👏

    Merci d’avance,

    Filsmick.

    #791519
    ombres-et-lumieres
    Membre
    Chevalier WordPress
    147 contributions

    En voulant aller voir le site, j’ ai trouvé l’ insulte 😎 :rolleyes: 😗 suivante:
    Parse error: syntax error, unexpected ‘<' in /home/xxx/public_html/microinf/wp-content/themes/lightword/functions.php on line 1

    Mais, en tout état de cause, tu dois reconfigurer le css: les balises qui entourent tes liens dans le html doivent être (re)définies dans la feuille de style. Tu pourras leur donner la forme, la calligraphie, la couleur que tu souhaite. Ceci est valable pour chaque lien car ils sont toujours entourés de ….

    Pour en savoir plus sur le css, voir les tutos du site http://www.alsacreations.com

    #791520
    Invite 40
    Membre
    Initié WordPress
    24 contributions

    Pour l’erreur, c’est réglé 👏 Mais je n’y connais absolument RIEN en CSS, et je voudrais juste un bout de code à coller simplement. Déjà, quel est le fichier qu’il faut modifier ? Quelles balises mettre pour créer un bouton ?

    #791521
    Flo563
    Participant
    Chevalier WordPress
    148 contributions

    Je ne suis pas un expert, mais je serai tenté de dire que ça dépend de ton thème.

    Pour notre assoc on a crée notre propre thème, donc dans les fichier de template « index.php » on a quelque chose comme ça

    <a href=" » rel= »bookmark » title= » »>

    Cherche dans les fichiers de ton template « Apparence->Editeur » l’endroit où tu souhaite que ces liens apparaissent (cherche le mot clef « excerpt » par exemple).

    Ca affiche le lien dans une classe css « plusinfo », et après dans le fichier css du style « Apparence->Editeur » on a ce code CSS à adapter à ta guise (taille, police, couleur)

    .plusinfos, .plusinfos a, .plusinfos a:hover {
    font-size:0.9em;
    font-family: »Trebuchet MS », Arial, Helvetica, sans-serif;
    color: #000;
    }
    .plusinfos a:hover {
    text-decoration:none;
    }

    Si tu préfère une image, il suffit de remplacer le texte par ton image

    <a href=" » rel= »bookmark » title= » »>

    #791522
    Invite 40
    Membre
    Initié WordPress
    24 contributions

    Désolé, je ne trouve pas le mot-clé « excerpt » dans mon fichier index.php 😕

    #791523
    Flo563
    Participant
    Chevalier WordPress
    148 contributions

    Sur ta page d’accueil je ne vois pas d’extraits de tes articles, tu as un exemple où le lien « lire la suite » apparaît ?

    #791524
    Flo563
    Participant
    Chevalier WordPress
    148 contributions

    Ah si, en fait c’est tellement gris que je l’avais pas vu en effet 🙂

    Dans ton code y’a ça

    Donc il faut que tu cherche maintenant « continue » dans ton fichier CSS « Apparence->Editeur »

    Et si tu trouve pas, bah tu peux ajouter ça justement

    .continue a, .continue a:hover {
    font-size:0.9em;
    font-family: »Trebuchet MS », Arial, Helvetica, sans-serif;
    color: #000;
    }

    Ensuite joue avec le CSS, tu aura toutes les expliquations sur le site donné au début du post.

    #791525
    ombres-et-lumieres
    Membre
    Chevalier WordPress
    147 contributions

    Pour faire court, dans un site tu as trois langages qui se côtoient: le php qui sert à dialoguer et à afficher du contenu dynamique comme un article, le html qui sert à structurer ta page avec des balises (pense en terme de texte à structurer avec des titres, des paragraphes,…), est la feuille de style, le css, qui sert à dire que telle balise du html entourant tel partie de texte, donnera au texte une forme bien définie.
    Dans le cas de wordpress c’ est normalement le fichier style.css.

    Je sais que tout ceci peut paraître difficile mais en fait dans ce cas-ci il te suffit de reprendre ce qui existe et de le modifier un peu. D’ abord je te conseille l’ utilisation de firefox avec le plugin « web développer » qui te permettra de visualiser les blocs logiques entourés des balises html et leur css. Tu comprendras de suite l’ utilité de celles-ci.

    Exemple: ton dernier lien de navigation est repassé en dessous des autres, ce qui peut poser une problème en lecture. C’ est parce que la somme des dimensions des liens est trop grande pour l’ espace réservé.
    Cet espace se trouve sous la balise

      qui, si tu regarde dans le css a une taille de 720px en largeur (#front_menu). Mais si tu rajoutes quelques pixels, il faudra aussi modifier les propriétés du bloc « wrapper » qui contient le bloc « front_menu ». C’ est à cela que servent les css.

      Une petite remarque: si tu veux adapter ton thème, il vaut mieux le faire « en local » c’ est-à dire sur ton ordinateur, où tu pourras sans risque tester toutes le modifications avant de les transférer en ligne, sinon en cas de grosse erreur, tu es parti pour une grosse galère.

      Je sais que ma réponse peut sembler hors sujet mais les infos précédentes répondaient à ta question. J’ ai donc cherché à t’ inciter à regarder de plus près les css

    #791526
    Invite 40
    Membre
    Initié WordPress
    24 contributions
    Flo563 wrote:
    Ah si, en fait c’est tellement gris que je l’avais pas vu en effet 🙂

    Dans ton code y’a ça

    Donc il faut que tu cherche maintenant « continue » dans ton fichier CSS « Apparence->Editeur »

    Et si tu trouve pas, bah tu peux ajouter ça justement

    .continue a, .continue a:hover {
    font-size:0.9em;
    font-family: »Trebuchet MS », Arial, Helvetica, sans-serif;
    color: #000;
    }

    Ensuite joue avec le CSS, tu aura toutes les expliquations sur le site donné au début du post.

    J’ai trouvé ça :

    .cat_tags .continue{float:right;padding-right:10px;width:100px;text-align:center;}
    .cat_tags .category{float:left;}
    .cat_tags a,.cat_tags .continue a{color:#2C2C29;}
    .cat_tags a:hover{color:#ACACAB;}

    Je mets où ton code, dans tout ça ?

    Et j’aimerai poser une question, quand on doit ajouter du code dans un fichier PHP ou CSS, où faut-il le mettre ? Car chaque fois que j’ai ajouté du code, mon site a buggé…

    #791527
    ombres-et-lumieres
    Membre
    Chevalier WordPress
    147 contributions

    Première chose, entre ta page d’ article et celle du blog, je ne vois aucune différence dans le texte. Ce qui semble signifier que ta balise « more » est mal placée.
    Deuxièmement, dans le code de index.php, au niveau de la boucle générant les articles, tu devrait trouver les fonctions wordpress générant les extraits d’ articles, soit the_excerpt, soit the_content. Si tu veux utiliser « more » au niveau de l’ article, ce doit être cette dernière. Ensuite tu devrais trouver la fonction « the_permalink » dans une balise de lien: <a href='’ class= »suite »>suite. Le nom de la class peut varier d’ un auteur à l’ autre, mais les balises sont du html, ce qui devrait t’ aider à trouver la classe.
    Ensuite tu vas dans le fichier style.css, tu la retrouves (cela peut avoir la forme #truc .machin .bazar .suite) et modifie ses propriétés.

    Quant à « où mettre le code », je vais commencer par le plus simple: le css se met dans un fichier « .css ».Avec cela tu risques peu de faire bugger ton site, mais il risque d’ avoir un air bizarre. Par contre, le html et le css, si tu n’ y connais rien, c’ est infiniment plus dangereux. Relis ce que je te disais un peu plus haut. Dans une page web, ils sont intimement mélangés et tu dois penser en terme d’ algorithme.
    Donc une fonction wordpress doit être écrite dans une position logique et suivant une sémantique (orthographe et grammaire) précise.

    #791528
    Flo563
    Participant
    Chevalier WordPress
    148 contributions

    Mets le code CSS après ce que tu as trouvé pour faire au plus simple, déjà tu devrais constater un changement. Une fois que tu as constaté ce changement tu pourra jouer avec le CSS, changer la couleur « fff », changer la taille, changer le fond, etc etc

    #791529
    Invite 40
    Membre
    Initié WordPress
    24 contributions

    @Flo563J’ai essayé de jouer avec le CSS, mais les modifications n’apparaissaient pas 😕


    @ombres-et-lumieres
    : C’est parce que je ne la mets plus en attendant de trouver un beau bouton, c’est que sur les vieux articles qu’elle est présente.

    #791530
    Flo563
    Participant
    Chevalier WordPress
    148 contributions

    C’est toujours en ligne ? Je ne vois pas le code CSS en allant sur ton site.

    #791531
    Guy
    Participant
    Maître WordPress
    14817 contributions

    je viens de regarder, le lire la suite est bien visible ou je n’ai pas cherché au bon endroit?

    #791532
    Invite 40
    Membre
    Initié WordPress
    24 contributions

    @Flo563 : ce n’est plus en ligne, je l’ai retiré comme ça marchait pas.


    @Guy
    : Cherche dans les articles plus vieux, les récents n’ont pas de balise more.

15 sujets de 1 à 15 (sur un total de 28)
  • Vous devez être connecté pour répondre à ce sujet.