8 hacks pour le thème Twenty Eleven de WordPress

134 commentaires
8 hacks pour le thème Twenty Eleven de WordPress
Twenty Eleven est le thème WordPress par défaut pour 2011. Il remplace Twenty Ten et nous propose un code en HTML5 / CSS3 et les dernières innovations en matière de SEO.

#1 – Utiliser un child theme pour Twenty Eleven

Cette astuce doit être perçue comme un pré-requis à la mise en œuvre des points suivants de cette liste. Appliquer des changements directement dans le code source d’un thème n’est pas très judicieux dans la mesure où vous perdrez toutes modifications à la première mise à jour du thème.

C’est pourquoi, il convient de créer un child theme qui abritera vos modifications tout en autorisant les mises à jour du thème de base – en l’occurrence le Twenty Eleven.

Reportez-vous donc au tutoriel Créer des thèmes enfants (child themes) avec WordPress et copiez / collez les lignes de code suivantes pour le point 3 :

/*
Theme Name: Nom du thème enfant
Theme URI: URL du site
Description: Une description du thème
Author: Votre nom
Template: twentyeleven

*/
@import url('../twentyeleven/style.css');

#2 – Ajouter une pagination avec WP-PageNavi

Cette technique va nous permettre d’appliquer une pagination numérotée basée sur l’incontournable plugin WP-PageNavi.

Pour ce faire, suivez les instructions de cet excellent tutoriel : http://zeaks.org/easily-add-wp-pagenavi-to-twenty-eleven/

#3 – Ajouter une sidebar sur toutes les pages du site

Par défaut, seule la page d’accueil du thème dispose d’une sidebar (colonne latérale). Or, de nombreux blogs ont besoin d’afficher des informations sur l’ensemble des pages de leurs sites – aussi bien les pages statiques que celles affichant les articles.

Rendez-vous sur ce tutoriel : http://zeaks.org/add-sidebar-to-post-view-in-twenty-eleven-theme/

#4 – Activer des options supplémentaires pour Twenty Eleven

Twenty Eleven Theme Extensions est un plugin spécifiquement conçu pour ajouter les fonctionnalités suivantes au thème :

  • Ajouter une sidebar sur toutes les pages ;
  • Centrer la navigation supérieure dans les pages d’articles ;
  • Changer la taille par défaut de la bannière d’en-tête ;
  • Ajouter votre propre feuille de styles personnalisée directement depuis le back office de WordPress ;

Ceci n’est qu’un aperçu des nombreuses options supplémentaires qu’ajoute ce plugin. A tester pour éviter d’avoir à passer par le code !

Twenty Eleven Theme Extensions

Plugin ajoutant des options supplémentaires pour le thème Twenty Eleven de WordPress.

Taille : 19,9 Ko  • Hits : 4 285

#5 – Changer la taille de la bannière d’en-tête

Pour cette modification, 2 possibilités : avoir recours à un plugin ou utiliser un hack PHP.

Pour la première solution, optez pour le module Resize Twenty Eleven Header :

Resize Twenty Eleven Header

Plugin permettant de redimensionner facilement l'en-tête du thème Twenty Eleven.

Taille : 48,5 Ko  • Hits : 2 601

Pour la seconde solution, modifiez le fichier functions.php du thème enfant puis ajoutez les lignes suivantes :

/* Ajoute un filtre de taille en largeur et en hauteur pour Twenty Eleven */
define('HEADER_IMAGE_WIDTH', apply_filters('twentyeleven_header_image_width', 1000));
define('HEADER_IMAGE_HEIGHT', apply_filters('twentyeleven_header_image_height', 280));

Remplacez les valeurs 1000 et 280 par les valeurs en pixels de votre choix.

#6 – Afficher uniquement les extraits d’articles sur la page d’accueil

Par défaut, le thème Twenty Eleven se comporte comme un thème de blog. Autrement dit, l’intégralité du contenu d’un article est visible en page d’accueil. Si vous souhaitez restreindre ce dernier à son extrait, éditez le fichier content.php – dans le cadre de l’utilisation d’un thème enfant, il convient de dupliquer ce fichier au préalable dans le dossier enfant.

Recherchez ensuite les lignes suivantes :

<?php if (is_search()) : // Only display Excerpts for Search ?>
<div>
<?php the_excerpt(); ?>
</div><!-- .entry-summary -->
<?php else : ?>
<div>
<?php the_content(__('Continue reading <span>→</span>', 'twentyeleven')); ?>
<?php wp_link_pages(array('before' => '<div><span>' . __('Pages:', 'twentyeleven') . '</span>', 'after' => '</div>')); ?>
</div><!-- .entry-content -->
<?php endif; ?>

Remplacez celles-ci par :

<?php if (is_search()) : // Only display Excerpts for Search ?>
<div>
<?php the_excerpt(); ?>
</div><!-- .entry-summary -->
<?php else : ?>
<div>
<?php the_excerpt(__('Continue reading <span>→</span>', 'twentyeleven')); ?>
<?php wp_link_pages(array('before' => '<div><span>' . __('Pages:', 'twentyeleven') . '</span>', 'after' => '</div>')); ?>
</div><!-- .entry-content -->
<?php endif; ?>

Notez que des variantes sont disponibles sur le forum de WordPress.org.

#7 – Contrôler la longueur de l’extrait des articles

Pour limiter le nombre de caractères présents dans l’extrait et ainsi obtenir des blocs d’articles homogènes en hauteur, reportez-vous au tutoriel sur Définir une longueur d’extrait personnalisée des articles sous WordPress. Préférez le deuxième bout de code ou le recours à un plugin supplémentaire.

Pour info, le fichier functions.php du thème Twenty Eleven redéfinit cette longueur d’extrait à 40. Il est également indiqué qu’il est possible de surpasser cette valeur en utilisant un thème enfant. Toutefois, malgré mes nombreuses tentatives je n’y parviens toujours pas. Je pense que le problème tient au fait que je n’utilise pas la balise more.

#8 – Ajouter des miniatures d’articles

Le thème Twenty Eleven n’affiche aucune miniature sur la page d’accueil alors même qu’il s’agit d’un fonction incluse dans WordPress depuis pas mal de temps maintenant. Pour en bénéficier, modifiez le fichier content.php puis ajoutez la ligne suivante :

<?php echo get_the_post_thumbnail($id, 'thumbnail', array('class' => 'alignleft')); ?>

Celle-ci doit être placée juste avant :

<?php the_excerpt( __( 'Continue reading <span>→</span>', 'twentyeleven')); ?>

Comme vous pouvez le constater, nous avons appliqué une classe CSS alignleft qui cale l’image sur la gauche. Le thème disposant de son équivalent alignright pour un placement à droite, libre à vous de modifier cette dernière.

Et vous amis lecteurs, connaissez-vous d’autres hacks pour cet excellent thème qu’est Twenty Eleven ?

Par Aurélien Denis

Consultant & Développeur WordPress / WooCommerce. Un site à créer, à maintenir ou à débuguer ? Contactez-moi.

134 commentaires
  1. sophrologieangers

    Bonjour concernant j’ai un thème élégant thème 3.07 et j’ai également effectué la maj de WP 3.8 et depuis sur mes commentaires j’ai un reply à la place de réponse, j’ai bien réussi à changer le fameux laissez un message au lieu de leave a reply mais impossible de trouver pour mes petites réponses aux commentaires 😉 où aller ?

  2. lisbonnemarcLEGROS Marc

    Bonjour,
    J’aimerai remplacer les 8 images du Header de Twenty Eleven par les miennes et qu’elles tournent également de manière alléatoire comme celles par défaut. Est-ce possible sans entrer dans le code ?
    Merci pour vos conseils

  3. Sophie

    Bonjour,

    J’utilise le thème Twenty eleven dans sa version 1.7 et j’essaie d’utiliser le hack#8 pour ajouter des miniatures sur la page d’accueil qui affiche les derniers articles. Or, j’ai beau avoir ajouter la ligne de code dans le content.php, aucun changement.

    Y-a-t’il autre chose à ajouter pour que cela fonctionne ?

    Merci pour vos réponses

    1. Aurélien Denis auteur de l’article

      Il est possible que le thème ai subit de nombreuses évolutions depuis la rédaction du tutoriel. Essayez d’utiliser la fonction the_post_thumbnail bien que l’exemple du tutoriel doit être fonctionnel.

      A voir si l’emplacement est toujours le même…

  4. RICHARD

    Bonsoir, mon site est nicolasrichard.fr, je me lance sur wordpress et je suis très content.
    J’ai des questions :
    1. Dans mon menu 6G (sixième géographie) j’ai mis 3 liens (le cours, les diapos et le contrôle). J’ai réussi à faire en sorte que quand je clique sur un de ces fichiers = il s’ouvre dans une nouvelle fenêtre. Pour faire ça j’ai cliqué sur l’icône LIEN HYPERTEXTE et coché la case ouvrir dans une nouvelle fenêtre. C’est la bonne manip’ ?
    2. MAIS MAIS MAIS je ne pige pas pourquoi quand je suis sur 6G et que je clique sur l’un des 3 fichiers, il m’ouvre une sorte de page intermédiaire sur laquelle il répète le nom du fichier et là quand je RECLIQUE c’est bon le fichier s’ouvre… une idée ?
    3. j’ai mis dans mon menu 6G une image de la Terre. Et bien quand on clique dessus (en mode NON-admin, simple visiteur) l’image s’ouvre en plus grand (pourquoi pas, ok) MAIS le pb c’est que le site affiche toutes mes images que n’importe qui peut parcourir avec des flèches suivant précédent….

    1. Aurélien Denis auteur de l’article

      OK pour 1 mais à voir pour des questions d’expérience utilisateur si c’est une bonne chose ou pas.

      Il faut modifier le média importé et en optant pour Fichier média dans Lier à.

      Pour le dernier point, là encore mauvaise utilisation des médias insérés.

  5. joël

    J’ai un soucis de traduction, en dessous de l’article c’est marqué ( laisser une réponse) en place (laisser un commentaire).
    J’ai regarder dans le fichier des traductions je ne trouve pas cette expression. Je trouve justement ( laisser un commentaire). Qui peux me dire comment c’est possible que cela mets ( Laisser une réponse ) et comment faire pour le changer.
    J’ai eu une réponse dans un autre forum, la personne avait ( Laisser une réponse ) dans le traduction, mais pas moi, ??
    Merci pour vos éventuelles réponses
    Joël

    1. Aurélien Denis auteur de l’article

      De mémoire, les thèmes par défaut dépendent en partie de la traduction de WordPress qui se trouve dans le dossier /wp-content mais je ne suis pas sûr à 100%.

      1. joël

        Merci pour votre réponse, c’est un peu plus compliqué que cela. La traduction ( laisser un commentaire ) est bien dans le fichier, mais sur le site j’ai (Laisser une réponse) ,. Finalement j’ai corrigé directement sur le fichier en anglais. Je sais que cela n’est pas la plus pro des manières mais voilà c’est en ordre… Je serai attentif au cas de mise à jour.

  6. mat

    Bonjour, j’ai voulu installé le module Resize Twenty Eleven Header mais apparemment il n’existe plus… Je voudrais savoir s’il y a un autre moyen de modifier la taille du header (mon thème est Twenty ten) dans le php, soit en modifiant la taille en px, soit comme sur ton modèle mettre un bandeau sur toute la longueur.

  7. Cécile

    Bonjour,
    J’aurais une question toute bête. Je voudrais changer mon thème actuel par le thème Twenty Eleven (j’ai déjà créé un thème enfant mais je ne l’ai pas activé) et je me demande s’il est possible d’augmenter facilement la taille des photos, et même la largeur de la partie centrale (posts) avec le fichier css? Je voudrais mettre les photos plus en avant. Je l’ai fait manuellement (en élargissant tout) avec mon thème actuel mais le style.css de ce thème semble nettement plus compliqué.
    Et faut-il modifier un autre fichier que le css pour y arriver ?
    Merci d’avance pour votre réponse!

    1. Aurélien Denis auteur de l’article

      Tout est possible mais cela se fera en PHP pour définir des tailles personnalisées ainsi que par les réglages des médias dans le back-office de WordPress. Un plugin comme Force Regenerate Thumbnails sera bien utile pour recréer toutes les tailles d’images des fichiers envoyés.

  8. geerard B

    Bonjour, j’ai installé Twenty Eleven Theme Extensions une première fois et je l’ai activé. Il y a eu un bug …plusmoyen d’accéder à mon /wp-admin. J’ai viré Twenty Eleven Theme Extensions via le ftp et j’ai pu retrouver mon /wp-admin qui m’a dit (de mémoire) que Twenty Eleven Theme Extensions avait été supprimé et que le système avait été raéctualisé ou un truc comme ça…
    J’ai tout de même tenté de réinstaller Twenty Eleven Theme Extensions en suivant bien les instructions et maintenant il n’apparaît plus dans Apparence”. Je vois en dessous:
    “Thèmes endommagés….Les thèmes suivants sont installés, mais incomplets. Les thèmes doivent avoir au moins une feuille de style et un modèle.Nom Description twenty-eleven-theme-extensions La feuille de style manque”
    Pourtant dans le dossier de Twenty Eleven Theme Extensions il n’ y a pas de feuille de style !!!
    Autre chose depuis le bug lors de la première installe, quand je teste un nouveau thème, je ne parviens plus à le modifieer depuis le tableau de bord: ex modifier l’image de fond. J’ai eune erreur: “vous n’avez pas les droit d’accès….”
    Je vais éviter de toucher à mes cheveux de retraité donc rares…. @ vous lire. Merci
    nb: on parle à un débutant avec WP… pas de gros mot svp !

    1. Aurélien Denis auteur de l’article

      Euh il me semble que vous avez confondu le thème et le plugin. Pour installer un plugin, rendez-vous dans Extensions > Ajouter. Twenty Eleven Theme Extensions est un plugin qui agit sur le thème Twenty Eleven. 😉

  9. Delphine

    Bonjour, j’utilise le thème Twenty Eleven qui me convient très bien. Ce que je souhaiterai modifier, c’est la police du titre mais je ne sais pas comment faire.
    Merci beaucoup pour votre aide.

    1. Aurélien Denis auteur de l’article

      Il faut passer par le CSS en s’aidant des outils de développement des navigateurs (F12 en général, Firebug sous Firefox à installer comme extension).

  10. point

    Bonjour,

    J’ai un souci avec le hack 5, la deuxième solution (pouvez-vous) être plus explicite car lorsque je rajoute le bout de code à la fin du fichier function j’ai une parse erreur…

    Vous dites qu’il faut modifier le fichier function du thème enfant et ensuite ajouter le bout de code.

    En fait, mon header fait 1181 par 592, (j’ai remplacer l’image du thème par une image perso qui fait 1181×592) et le résultat c’est que j’ai une partie blanche au-dessus et en dessous de mon image (c’est pas très joli).

    Merci pour votre aide.

    PS: j’ai toujours au-dessus de mon header une barre de recherche (j’ai réussi à supprimer l’icône: la petite loupe mais pas la case… avez-vous une idée?)
    Pour finir, sur la gauche j’ai un espèce de bouton modifier, je ne sais pas d’où il sort…)

    Encore merci pour votre aide.

  11. Pierre-Yves

    Bonjour
    j’ai un soucis avec le hack 6 : lorsque je remplace les lignes de code, cela fonctionne, je n’ai que les résumés sur la page d’accueil. Mais lorsque je clic sur “lire la suite”, cela me renvoie, sur l’article résumé etc… ça tourne en rond…
    une idée ? merci

  12. soniarochel

    Bonjour,

    Petit probleme dans pour le hack #8 : je ne trouve absolument pas l’extrait dans mon fichier content.php du theme twentyeleven :/

  13. Gabriel

    Super content j’étais de trouver enfin quelqu’un qui expliquait comment ajouter la sidebar sur toutes les pages… donc méga déçu quand j’ai vu qu’en fait c’était un lien en anglais..
    Je ne comprends rien à l’anglais j’ai quand même essayé mais rien à faire… merci quand même !

      1. Gabriel

        Merci j’ai essayé… essai non concluant ! (et google traduction… traduction mot à mot ça donne des trucs étranges que je ne suis aps sur de comprendre !) Là j’ai trouvé un truc ailleurs, j’ai bien ma colonne mais tout en bas ! Pourtant j’ai réduit mes marges etc

        1. Aurélien Denis auteur de l’article

          Oui le TwentyEleven n’est pas simple à manipuler pour le CSS. Très puissant mais technique. Essayer de demander de l’aide sur le forum WordPress francophone.

  14. noaneo

    il y a un manque d’info, déjà votre site est bien sous WP3.4.1? Vous avez la dernière version de Twenty Eleven?

  15. Junior Mukendi

    Bsr, encore un souci. le problème, c´est que l´extrait d´infos qui vient sur la page d´acceuil reste le même sur la page qui content l´article et cela sans dialogue de commentaire. Qui peut m´aider !

  16. Junior Mukendi

    Bsr. merçi pour le tuto. tout macrche nickel, mais j ai un souci. Le dialogue des commentaires ne s´ouvre pas à l´ouverture d´un article.

  17. Damien

    Bonjour, impossible de placer une image en une dans un article sans que celle-ci apparaisse en “immense” au dessus de l’article une fois que l’on fait “voir l’article” (ou que l’on clique sur lui dans une liste d’article) et ce quelque soit la “taille” affectée à l’image (miniature, full, etc.). Avez-vous une idée pour “corriger” ce qui s’apparente à un paramètre sur lequel je ne trouve pas comment avoir la main. Je suis sur le child theme NomNom 1.7. Merci Aurélien et beau boulot !

    1. Aurélien Denis auteur de l’article

      Le thème Twenty Eleven est bâti comme cela… il va falloir modifier dans le code pour obtenir le résultat souhaité ce qui n’est pas évident dans ce cas précis…

  18. david

    Bonjour;
    Comment on fait pour changer le texte “Search” par “Recherche” dans la barre de recherche ? ( Theme :Twenty-Eleven)
    Cdt.

    1. Aurélien Denis auteur de l’article

      En éditant le fichier searchform.php bien que cela puisse se faire via l’outil de traduction Poedit il me semble.

      1. david

        super ! merci beaucoup . :p

  19. Julien

    Bonjour,
    je développe un site à partir du thème twenty eleven et j’aimerais changer l’arrière-plan. On peut bien sûr modifier la couleur ou intégrer une image dans les options du thème, mais je souhaite faire ces modifications dans les css (pour avoir plus de libertés de paramétrages) mais je n’y arrive pas, c’est toujours ce qui est définit dans les options du thèmes qui s’affichent en priorité.
    Des idées ?

    Merci !

    1. Aurélien Denis auteur de l’article

      Les options de personnalisation de l’arrière-plan agissent directement sur les propriétés CSS… je ne vois pas bien l’intérêt de passer outre. Tu peux le faire en utilisant Firebug qui te permettra d’identifier les propriétés CSS à modifier sinon. 😉

      Pour augmenter la priorité, ajouter !important après chaque propriété comme ceci :

      background-color:#F1F1F1 !important;

      1. Julien

        En fait je voulais mettre un motif en fond, mais à un endroit bien précis, ce qui n’est pas possible avec les options de thème. Du coup j’ai réussi en modifiant le fichier functions.php en annulant la customisation des arrières-plan :
        add_action( ‘after_setup_theme’,’remove_twentyeleven_options’, 100 );
        function remove_twentyeleven_options() {remove_custom_background();}

        Et ça marche ! Je vais quand même essayer d’augmenter la priorité, c’est plus simple

        Merci !

  20. alex

    Bonjour,

    Tout d’abord merci pour ces précieux conseils qui m’ont bien aidé.
    Je voulais savoir s’il était possible de modifier l’apparence des extraits sur la page d’accueil (et sur les autres pages aussi) : en effet, je souhaiterais que le titre de l’article soit placé à droite de la photo et non au dessus.

    J’espère avoir été assez clair dans la description du problème.
    Merci d’avance,
    Alexis

    1. alex

      Bonsoir Aurélien,

      Je me permets de te relancer concernant ma question, je ne sais pas si tu as eu le temps de jeter un oeil, et je ne sais pas si c’est réalisable.

      Je te remercie par avance,
      Alex

  21. Fred

    Bonjour,

    je cherche à retirer la page “accueil” qui e trouve par défaut sur le thème Twenty eleven ou la renommer pour créer une nouvelle page.
    Pourriez-vous m’aider.
    Merci

  22. Franck

    Bonjour,
    Mode novice : ON.
    Je cherche à traduire en français certains éléments comme “Continue reading” ou “Leave a reply”. Je pense qu’il faut bidouiller dans le fichier “functions.php”. Si quelqu’un a la solution …..
    Merci d’avance

    1. Aurélien Denis auteur de l’article

      Pour traduire un thème, il suffit d’installer le logiciel Poedit. 😉

      Pour le Twenty Elevent, la traduction est déjà fait il me semble si ton WordPress est en français.

  23. Nathalie

    Bonjour,
    je découvre (difficilement) tout ce monde des blogs et souhaite n’avoir sur la page d’accueil (du thème Twenty Eleven) qu’une unique colonne élargie et centrale pour mes articles, bref supprimer la Main Sidebar avec les Widgets “Archives” et “Méta” qui ont l’air d’être là par défaut !
    Le plugin #4 pourrait peut-être m’aider mais ayant hébergé le module WP via OVH, je n’ai pas rien téléchargé sur mon ordi, alors comment utiliser ce plugin ? Pas facile tout ça !
    Merci.

    1. Aurélien Denis auteur de l’article

      Pour la première demande, il faut s’y connaître en template WordPress. Pour les plugins, il faut soit les envoyer sur le serveur FTP soit les installer depuis le module Extensions de WordPress.

      1. Nathalie

        Merci beaucoup !

  24. Coco

    Bonjour,

    J’aimerais utiliser le point 6 mais je ne sais pas du tout ou trouver le fameux fichier content.php, moi attention je n’utilise que l’interface WP via mon navigateur, j’ai tenté un export mais il n’y a rien de dedans qui ressemble à ce code, pourriez vous m’aider svp en me précisant mieux la marche à suivre 🙂 ? Merci!

    1. Coco

      Personne pour m’aider? 🙁

      1. Aurélien Denis auteur de l’article

        En fait, il faut soit passer par un client FTP comme FileZilla pour éditer un tel fichier, soit par Apparence puis Editeur – je le déconseille car en cas d’erreurs on ne peut pas annuler facilement et peut vite se retrouver bloqué.

        Le fichier content.php est présent dans le dossier /wp-content/themes/twentyeleven/

        Attention, ces manipulations sont plutôt réservés à des gens avertis. 😉

        1. Coco

          hun hun!!! c’est ce que je vois 🙂
          Merci quand même !!!
          ++

  25. Nicolas du Développement Produit

    Bonjour,

    Je viens de passer sur ce thème. L’extension m’a vraiment été utile.

    Cependant je souhaiterais diminuer la taille du nom des articles sur les pages et les pages d’articles.

    Merci

    1. Aurélien Denis auteur de l’article

      En CSS ! 😉

  26. visite en bretagne

    Merci beaucoup pour l’article et les réponses aux soucis que je rencontrais, notamment la mise en “extraits” des articles en page d’accueil. EN plus la découverte du plugin qui donnent d’autres options sur le template. Merci, Seb

  27. ben

    Bonjour a tous j’aurai besoin de votre aide concernant le thème twenty eleven j’ai deux problème le 1 er je voudrais élargir un peu plus mon sidebar vers la gauche je trouve que ça fait pas joli comment s’est fait le 2 éme j’aimerai que les gens qui veulent me laisse des commentaires puisse le faire on se connectant avec leurs Facebook

    Merci beaucoup de votre aide cordialement

  28. yahyaoui

    j’ai crée un formulaire du contact avec le plugin “contact form7″dans mon thème wordpress (appelé dev-ii).
    lorsque je clique sur le menu contact je reçois mon formulaire du contact sous le thème 🙁 ,je veux qu’il s’affiche tout seul comment je peut faire pour resoudre ce problème??
    -J’ai une autre question svp comment rendre les archives, les Meta et les commentaires qui s’affichent sous mon thème invisibles et merci ./.

  29. ludovic

    Bonjour,

    Je ne sais pas si mon commentaire plus haut a été lu donc j’en fais un copier / coller ici même. Je recherche toujours une solution.
    —————————————-
    Bonjour,

    En fait, mes sous titres dans mes paragraphes sont passés en format « titre 1″ ou « titre 2″.

    J’aimerai changer les attributs suivant de ces 2 éléments :
    – police
    – taille
    – couleur

    Merci pour votre coup de main.

    Cordialement,
    Ludovic

    1. Aurélien Denis auteur de l’article

      Bonjour,

      tu peux changer ces éléments depuis l’éditeur de contenu (TinyMCE) des pages ou des articles.

      Le mieux consiste toutefois à faire cela directement dans le CSS pour l’appliquer à tout le site.

      1. ludovic

        Justement, pour le faire dans le CSS :
        – ou aller exactement
        – quoi modifier
        – quoi ajouter exactement

        Cordialement,
        Ludovic

        1. britain

          il faudrait utiliser Firebug.Page d’accueil ou Articles seul ?
          je ne comprends pas ce que c’est pour vous les sous-titres.

          “Comment rédiger 8 articles de blog à partir d’une seule idée, et en une journée – La méthode des 7” c’est un titre où est le sous-titre?

  30. britain

    il y a un moyen de détacher les champs “nom”,”adresse de contact” ;”site web” et “commentaire” des cadres de réponses ?
    merci

    1. Aurélien Denis auteur de l’article

      Hum, je n’ai pas bien compris ce que tu cherchais à faire ?

      1. britain

        pas grave j’ai réussi,je n’aimes pas les champs pour les commentaires d’origines,comme ici,on voit le cadre pour le Nom dedans on voit “Nom”,je préfère quand “Nom” est à côté du cadre.Comme sur cette image
        http://demonblack.fr/wp-content/uploads/2010/12/commentluv.jpg

  31. ludovic

    Bonjour,

    Quelqu’un peut il me dire quoi modifier dans le CSS pour changer la taille et la couleur des sous titres d’articles. Impossible de trouver !
    Merci d’avance.

    Ludovic

    1. britain

      c’est quoi les sous titres d’articles ?
      vous avez regardé avec Firebug ?

      1. Satynethe

        Je crois Ludovic parle du menu proposé par défaut dans l’éditeur de texte des articles (à gauche il y a un bouton et en déroulant il est proposé des sous-titres).
        S’il s’agit de ça, comme je trouvais cette fonction peu pratique car ne fonctionnant qu’une fois sur 4, j’ai résolu le problème en téléchargeant le plugin “tinyMCE advanced”, pas compliqué à installer et proposant une foule de boutons dans le menu d’édition… à vrai dire je n’ai pas passé le cap d’intervenir direct en modifiant l’éditeur car mes diverses tentatives de compréhension furent un échec.

        1. britain

          où on voit “Paragraphes” ? Je ne vois pas de sous-titres,mais différents formats, “adresse” ,”pré-formaté” ,”titre 1″,” titre 2″ jusqu’à “titre 6”

          1. ludovic

            Bonjour,

            En fait, mes sous titres dans mes paragraphes sont passés en format “titre 1” ou “titre 2”.

            J’aimerai changer les attributs suivant de ces 2 éléments :
            – police
            – taille
            – couleur

            Merci pour votre coup de main.

            Cordialement,
            Ludovic

    2. Aurélien Denis auteur de l’article

      Merci de préciser effectivement. Sinon avec Firebug.

  32. britain

    peut-on enlever les “bulles” pour les commentaires sur la page d’accueil,pour mettre “0 commentaires” à côté de “Publié dans” ,merci

    1. britain

      j’avance,j’ai réussi.j’ai voulu lire l’article en anglais pour mettre la pagination,mais l’anglais est moi cela fait 2,pas de site en français qui explique la procédure ?
      c’est écrit changer twentyeleven_content_nav par twentyeleven_child_content_nav mais mon thème ne s’appelle twentyeleven_child ça va fonctionner comme même ?

  33. Satynethe

    D’accord, c’est plus compliqué que je croyais en fait ^^.

    Je vais tenter de trouver une solution et si je n’y arrive pas je demanderai à des proches beaucoup moins “quiche” que moi et sinon ben je ferai appel à tes prestations 🙂 et merci pour ta proposition.

    J’ai aussi tenté de mettre en place les miniatures (rajouter un code juste avant la ligne citée plus haut me semblait facile à faire) mais… bizarrement… je n’ai pas trouvé cette ligne dans le fichier “content.php” (j’utilise ctrl F ou ctrl G pour la recherche).
    il y a bien un “the excerpt” mais sa parenthèse ne contient pas de “Continue reading…” elle est vide.
    Par contre le “Continue reading.. span..arrow..twentyeleven” se trouve dans une parenthèse avant un “the content” (4 lignes en dessous de la ligne “the excerpt”.
    J’ai regardé dans le fichier “content.php” d’un autre tableau de bord d’un thème Twentyeleven pour vérifier si celui que je voulais modifier n’avait pas quelques défauts mais ils sont identiques…
    Peut-être il y a eu une modification suite à une Mise à Jour de WordPress ?

    1. britain

      vers la ligne 81,il est préférable d’utiliser un éditeur de texte (notepad++) que de passer l’éditeur de WordPress.
      Attention,pour l’image,le sujet avant parle de passer d’article en entier à extrait,donc de the_content à the_excerpt,il est normal alors de trouver the_content et non the_excerpt, si vous n’avez pas fait le changement.

      1. Satynethe

        Ben s’il s’agit de “sous-titres d’article” je ne vois pas ce que ça peut être d’autre à part ces sous-titres proposés dans la liste déroulante dont tu parles toi aussi (dans le menu d’édition d’articles).
        S’il s’agit de modifier dans le CSS les titres des articles j’imagine qu’il faut copier la partie à modifier dans le css parent et la coller modifiée dans le css enfant, supposant qu’il faille intervenir sur “title article” :
        Là : “/* =Content
        ———————————————– */

        #main {
        clear: both;
        padding: 1.625em 0 0;
        }
        .page-title {
        color: #666;
        font-size: 10px;
        font-weight: 500;
        letter-spacing: 0.1em;
        line-height: 2.6em;
        margin: 0 0 2.6em;
        text-transform: uppercase;”
        Mais là je dis ça au pif car je pédale rude pour installer ce thème Enfant, d’ailleurs Britain, tu y es arrivé toi ?
        Si oui pourrais-tu s’il te plait m’aider dans mes dernières questions ici ?
        https://wpchannel.com/creer-themes-enfants-child-themes-wordpress/#comment-15292

        Pour la pagination c’est le seul plugin que j’ai réussi à bien installer avec son rajout de code, mais je l’ai fait direct dans le dossier function.php du thème parent, ce qui fait que je ne suis pas en mesure de t’aider pour le tuto qui propose de rajouter le code dans le thème enfant.

        Sauf qu’il me semble que la demande de modification c’est juste le “code” qui demande au parent d’écouter ce que propose l’enfant (donc de rajouter la pagination si elle est activée) et que les “nav” etc sont des chemins à suivre pour que ça se fasse..

        J’espère que quelqu’un de moins quiche que moi pourra t’aider mieux que ça.^^

  34. britain

    bonsoir,
    si dans style.css à page je met un fond de couleur blanc (obliger sinon les articles n’ont pas de fond ou si l’article plus court que la sidebar,il y a un “trou” entre l’article et le footer)et que je met une image dans branding ,je pensais que l’image allait cacher la couleur dans header mais non la couleur dépasse au dessus de l’image,pourquoi ?Merci

    1. britain

      j’ai trouvé une solution dans footer.php j’ai déplacé la balise main pour la mettre juste un peu avant la balise page,ainsi j’ai mis background dans style.css dans la partie main ,plus de vide,plus de trou.

  35. Satynethe

    Bonsoir,

    Jusqu’ici je ne souhaitais modifier la taille de la bannière mais en élargissant la taille de la “page” pour reproduire le même espace que j’avais installé sur OB, elle est toute étirée et énorme.

    Je pourrais rétablir la taille de la page mais je tiens à cette présentation plus horizontale. ^^

    J’ai rentré le code proposé tout à la fin du fichier functions.php pour voir ce que ça donne : rien du tout.

    J’avais déjà installé le plugins “Theme extension” mais il ne propose que de redimensionner la hauteur… le résultat est moche, mais je le laisse pour l’instant.

    Est-ce qu’il y aurait un autre moyen ou il faut placer le code à un endroit spécifique de “functions.php” pour que ça marche ?

    Merci à l’avance. 🙂

    1. Aurélien Denis auteur de l’article

      Hum difficile à dire sans intervenir directement dans ton code… je n’ai malheureusement pas le temps de faire cela gratuitement.

  36. yetiranol

    Merci beaucoup pour ce post, ça m’a bien aidé a recréer mon propre “thème”. sais tu quand sortira la prochaine version de WP ?
    merci d’avance

  37. Jack

    Bonjour Aurélien,
    Merci beaucoup pour toutes ces infos utiles que tu nous offres là.
    C’est très généreux.
    Cela m’a permis de rendre plus sympa le thème twentyeleven.
    Cordialement,
    Jack

  38. Sébastien

    Bonjour Aurélien, pourrais-tu m’expliquer comment tu as inséré ton image « logo neticpro » dans la barre latérale sur ton site (thème Twenty Eleven). Je sais coder en html/css/php mais je débute sur wordpress. Dans quel fichier faut-inséré la balise img ? Merci d’avance et merci pour le blog et le partage de connaissance.

    1. Sébastien

      Je me réponds tout seul, c’est dans sidebar.php 😉

  39. grafaction

    Bonjour, je débute et ma formation html css faite à l’INFA à été trop courte pour saisir tout assemblage qu’est wordpress. Malgré tout j’insiste.
    Votre explication me parle. Disons que j’arrive en appliquant les codes à obtenir de très maigre résultat.
    Ceci dit j’applique et comprends. Ce qui est déjà plus encourageant…
    Je bute sur un point qui me semblait simple en HTMLet CSS lors des cours. Comment changer la taille de la Div d’accueil du titre.. franchement j’ai cherché partout et aussi avec l’aide de Firebug qui lui aussi semble perdu…
    Ça serait très sympa si je pouvais placer mon titre en entier sur une ligne. J’ai réussi a enlever la boite recherche et ca n’a rien changé… Si quelqu’un aune idée, merci d’avance.

    1. Aurélien Denis auteur de l’article

      Bonjour,

      premièrement, ne pas se décourager ! 🙂

      deuxièmement, c’est assez difficile de répondre sans avoir accès au site avec la présence du bug mais généralement il convient d’ajouter une propriété width sur la div concernée.

      Pour le titre, il faut modifier le fichier header.php pour savoir plus quant au code. Le Twenty Eleven n’est pas simple à prendre en main : il comporte de nombreuses fonctions dans le fichier functions.php et gère les boucles dans des fichiers séparés.

  40. Gd6d

    Merci pour les liens. En cherchant j’ai trouvé ce plugin “better-backgrounds” qui permet de remplacer les réglages limités pour le background par la possibilité d’affichage pleine page d’une ou plusieurs images. ça marche bien avec Twenty Eleven, il faut juste envoyer par ftp les images dans un répertoire. Voilà le lien :
    http://wordpress.org/extend/plugins/better-backgrounds/
    @+

    1. Aurélien Denis auteur de l’article

      Merci du retour ! 😉

  41. Camille

    Bonjour,

    J’ai suivi consciencieusement vos instructions pour la création d’un thème enfant du thème Twentyeleven (que j’ai donc appelé twentyelevenenfant). Dans le dossier de ce thème, j’ai uniquement placé le fichier style.css avec :
    ————————————————
    /*
    Theme Name: Twentyelevenenfant
    Description: Theme enfant pour Twenty Eleven
    Author: Camille
    Template: twentyeleven
    */

    @import url(“../twentyeleven/style.css”);
    ———————-

    et c’est tout car je ne souhaite pas changer toute l’apparence du thème mais seulement modifier le menu pour le transformer en mega-menu.

    Ensuite je suis retournée dans l’administration du blog et j’ai activé le thème twentyelevenenfant. Et maintenant mon site n’a plus aucune mise en forme !
    Comme vous l’aurez deviné je suis loin d’être une as en termes de code et programmation, j’essaie juste d’utiliser wordpress pour faire un chouette blog pour mon travail (et mon plaisir). Je n’arrive donc pas à comprendre où j’ai fait une erreur. Pourriez-vous m’éclairer ? D’avance merci !!!

    1. Camille

      Je précise, si vous passer sur le site, que du coup j’ai réactivé le thème Twentyeleven parent en attendant de trouver la solution….

    2. Aurélien Denis auteur de l’article

      Bonjour,

      essayez d’indiquer l’URL en absolu dans le @import et pas en relatif pour voir.

  42. Bruno

    Sur l’étape deux dans mon menu de droite et seulement à la page d’accueil j’ai ceci :
    Fatal error: Call to undefined function twentyeleven_content_nav() in /home/bonplani/public_html/wp/wp-content/themes/twentyeleven_enfant/index.php on line 22
    Voici le lien http://bonplaninternet.com/wp/ (blog de test)
    Ce qui est bizard je n’ai pas modifié cette fameuse ligne seulement la ligne 31 comme démontré sur le blog en anglais.

    Bruno

    1. Aurélien Denis auteur de l’article

      Je ne vois pas d’erreur sur ton site. Je suppose que tu as réussi à corriger le souci ?

  43. Bruno

    Bonjour,

    Je suis actuellement étape par étape vos instructions et je suis allé voir la signification de thème enfant.

    J’ai lu que le fichier functions.php, il fallait le laisser dans le dossier parent, mais que les autres pouvaient être mis dans le dossier enfant, et c’est là qui me fait passer à la partie deux de ton tuto, le dossier functions.php je le laisse dans parent mais je le modifie tout de même mais le fichier index.php que je modifie je peux l’enregistrer dans le dossier enfant. Je pense pas trop dans le faut.

    Merci
    Bruno

  44. Ludovic

    Bonjour,

    J’ai 3 questions sur ce thème wordpress. Comme tu as l’air pointu dans le domaine, je vais en profiter ! :-)) …

    1/ Dans quel fichier php francise t-on les ← Précédent Suivant →
    des pages articles ? (comme tu l’as fait)

    2/ Sur la page accueil où figure tous les articles, il n’y a pas de mentions “lire la suite” pour chacun des articles. Peut y remédier ?

    3/ Comment grossir la taille des sous titres de mes articles. Les balises h1, h2, h3, h4… n’ont aucun effet. J’aimerai modifier h1 par exemple avec une taille de caractère et une couleur précise si possible…

    Merci d’avance pour tes réponses.

    Cordialement,
    Ludovic

  45. darknote

    bonjour,
    est ce possible de supprimer la sidebar sur la page d’accueil puis de center les derniers articles en prenant tout la place disponible mais que la sidebar soit présent pour le reste du site?
    Merci

    1. Aurélien Denis auteur de l’article

      Oui ! Définis 2 pages : l’une ayant le modèle par défaut et l’autre le modèle avec sidebar puis indiques-les dans les options de WordPress. Regardes aussi dans les options du thème sous Apparence.

      1. asatru14

        Bonjour,

        Je n’arrive pas à supprimer la sidebar de recherche qui se trouve à gauche de mes pages.

        J’ai essayé de suivre votre commentaire, mais je n’arrive a rien. Comment puis-je faire pour supprimer définitivement celle-ci et dans toute les pages?

        Je précise que je débute en informatique et que c’est mon premier wordpress.

        Cordialement

        1. Aurélien Denis auteur de l’article

          Il faut obligatoirement passer par le code et cela n’a rien d’évident. Je ne me rappelle plus des lignes à supprimer (et des fichiers).

          Je n’ai malheureusement pas le temps de regarder et je t’invite à demander de l’aide sur le forum de WordPress francophone ou de faire appel à mes services pro.

  46. Ben

    Salut,

    Croyez vous qu’il soit possible sur ce thème d’afficher dans l’entête l’image que l’on veut sur la page de son choix !? En gros, imaginons 3 pages : Accueil / Infos / Contact. J’aimerais que une image soit associé à Accueil, une à Infos et une autre à Contact.

    😉

    Ben

    1. Aurélien Denis auteur de l’article

      Chaque image envoyé à la une mesurant plus de 1000 px de large (soit la taille du header) s’affichera sur la page en question.

      Mais sinon oui c’est possible avec tous les thèmes en fait.

      1. Ben

        C’est à dire “envoyé à la une” ? C’est paramétrable dans chaque page ? (j’ai raté un épisode 😀 )

        1. Aurélien Denis auteur de l’article

          Oui dans chaque page tu peux définir une Image à la une via le module en question. S’il n’est pas affiché, coches-le depuis les Options de l’écran situées en haut à droite.

          1. Ben

            Merci m’sieur 😉

  47. zampai

    Bonsoir,

    Merci pour tous ces hack.

    Cependant, chez moi (dernière version WP propre), l’affichage des résumés fonctionne mais les miniatures ne fonctionnent pas. J’ai pourtant modifié “content.php” dans le thème enfant.

    1. zampai

      Au temps pour moi, cela fonctionne si on ajoute par exemple le pluggin “auto post thumbnail” qui génère des vignettes automatiquement avec la première image de chaque article.

  48. Clément

    Merci beaucoup pour ta réponse mais le truc c’est que je n’ai pas créé de menu personnalisé car je souhaite avoir des sous-menus déroulants et le menu personnalisé n’inclut pas cette fonction, sauf erreur de ma part, … ???

    1. Clément

      En fait si, erreur de ma part ! En creusant j’ai trouvé comment créer un menu personnalisé avec des sous-menus déroulants mais je ne vois pas l’option “invisible” ou pas pour les pages et catégories. Peut-être que cette fonctionnalité n’apparaît pas par défaut dans le thème Twentyeleven ?

      Merci par avance pour ta réponse !

      1. Djeje15

        En fait quand je dis “invisible” c’est juste que tu ne déplaces pas la page que tu veux cacher dans l’arborescence de ton menu personnalisé.

  49. Clément

    Bonjour,

    J’aimerais créer une page sans que celle-ci apparaisse dans la barre de menu de mon site avec le thème Twentyeleven et la dernière version de WordPress.
    Savez-vous comment je peux faire?
    Merci par avance pour votre aide !

    Un fan de WordPress

    1. Djeje15

      Bonjour Clément,
      Dans l’admin, tu choisis les pages et/ou catégories que tu veux afficher dans ton menu en te rendant dans Apparence > Menus.
      Il te suffit donc de NE PAS mettre ta page “invisible” dans ce menu que tu auras créé

  50. bitox

    Hello et merci pour ces hacks bien pratiques!
    J’ai une question concernant #6, j’aimerais aller plus loin et les forums WP ne m’ont pas aidé. J’aimerais faire sur la home page : que des excerpts sauf le premier post (= le dernier post publié), en full. J’arrive grâce à ta méthode à n’obtenir que des excerpts,
    et en créant un home.php depuis index.php, en le bidouillant, j’arrive à avoir le premier post en full, mais sans le header titre + date (rha). Je ne comprends pas bien les i++. Aurais-tu un hack facile pour cela, sous le coude et à tout hasard ? 🙂 Merci, B

    1. Aurélien Denis auteur de l’article

      Effectivement, cela fonctionne avec les i++ et là il faut s’y connaître un tant soi peu en PHP. Désolé mais de techniques faciles… à moins que tu ne parviennes à trouver un thème WordPress fonctionnant sur ce principe et que tu t’inspires du code source pour arriver à tes fins. 😉

  51. luc

    Encore moi à nouveau 🙁

    Toujours dans Twentyeleven je souhaite modifier le background, sidebar et footer d’une rubrique (qui est une page) si celle-ci est appelée.
    Quelle méthode me recommandes-tu ?
    Merci

  52. Aurélien Denis auteur de l’article

    @Luc : tu souhaites devenir guest-blogueur ?

    1. luc

      C’est à dire ?
      Tu peux me contacter directement par mail si tu le souhaites.

      1. Aurélien Denis auteur de l’article

        Voila qui est fait ! 😉

  53. Aurélien Denis auteur de l’article

    Évidemment, WordPress sert à tout type de besoin ! 😎

  54. luc

    A propos de ce menu personnalisé. Sais-tu si c’est possible qu’une nouvelle page associée à une page-parent (donc en sous-menu), peut s’ajouter automatiquement sans passer par apparence>menu>… ?

    Parce ce que sauf erreur de ma part l’option “attribut de la page>parent” n’est plus fonctionnel en passant par le menu personnalisé.

    1. Aurélien Denis auteur de l’article

      Tout à fait, cette fonction n’a plus de sens si l’on utilise un menu personnalisé car la commande PHP présente dans le code n’est pas la même.

      Tu peux donc t’en passer à moins que tu ne veuilles disposer d’un affichage hiérarchique de tes pages dans l’administration.

      1. luc

        Mais alors si elle n’a plus de sens, as-tu une astuce pour que la personne qui va gérer le site (client) ne voit pas l’option “page parent” dans le BO quand il gère les pages de son site (hormis les options à l’écran par défaut).

        D’ailleurs à ce sujet, il y a t’il dans twenty eleven et depuis la version 3.0 de WP une façon plus simple de ne pas afficher certaines options dans le BO?
        Par exemple mon site n’est pas un blog, il n’y a pas d’intérêt à laisser l’onglet “commentaires” dans le BO, hormis embrouiller l’administrateur (ou éditeur) lambda. Comment ne pas l’afficher ?

        1. Gilles

          Mode crétin ON : si c’est pas un blog, pourquoi WP ?

          1. luc

            Oulah, Mode diplomate: off !
            Parce que WP est très bien pour un site sans blog également !

          2. luc

            Je précise, je ne sais pas trop comment prendre le “Mode crétin on”

          3. Gilles

            Dans le sens de “naïf” 🙂
            Et pour moi bien sûr !

          4. luc

            ah ok, je ne l’avais pas pris comme ça dans un premier temps… 😉 Oui donc je précise WP est très bien (et de mieux en mieux) pour créer un site sans blog. En quelques manips, c’est ni vu ni connu. Reste les “problèmes” du back-office…

        2. Aurélien Denis auteur de l’article

          Oui tout ceci est faisable mais il faudrait que j’écrive les tutoriels correspondants… 🙂

          1. luc

            Je veux bien t’aider à le réaliser, si tu me donne les bases de ta façon de faire 😉
            PS: Sans blaguer

  55. luc

    J’ai un problème avec Twentyeleven qui est que je n’arrive pas ordonner mes pages même avec un plugin du type “my page order”.

    Avec un menu basé sur des pages c’est embêtant. Voyez-vous pourquoi est-ce que le plugin n’est pas actif et comment résoudre le problème?
    Merci

    1. Aurélien Denis auteur de l’article

      Ordonner ces pages dans un menu sous WordPress est proposé en natif… je ne comprends pas le besoin d’un plugin comme My Page Order en fait. 🙂

      1. luc

        En fait, ordonner nos pages dans le menu est proposé uniquement si on se sert d’un menu crée dans apparence>menu dans lequel on peut ordonner notre menu à souhait et très facilement. Je parlais du menu par défaut. Mais je reconnais qu’il est préférable de passer par le menu personnalisé.
        Donc c’est vrai qu’un plugin dans ce cas est inutile. 😉

        1. Aurélien Denis auteur de l’article

          Tu peux toujours éditer le code source en indiquant des paramètres supplémentaires dans la fonction wp_list_pages – je n’ai pas vérifié qu’elle était présente mais je pense qu’il doit s’agir de celle-ci, mais comme tu le dis, préfères la gestion d’un menu personnalisé qui t’offrira plus de flexibilité – et pas uniquement sur l’ordre des pages. 😉

        2. Djeje15

          Pour ma page j’utilise le plugin PageMash pour l’ordonnancement de mes pages sur les sites de mes clients

  56. Gilles

    Pour le #6 : la balise “more” dans l’article sert à ça non ?

    1. Nicolas TAFFOREAU

      En fait Gilles, le point 6 permet justement de s’en affranchir en plaçant cette balise de façon permanente et fixe (ce qui est très souvent utilisé sur les thèmes magazines).

      1. Gilles

        Ok, je comprends.
        Je pensais à cette balise car s’il y a bien un truc que je déteste, c’est de voir un long article dès l’arrivée sur un blog, ce qui oblige un bon scroll bas pour voir les suivants et ainsi jauger l’intérêt potentiel du blog.
        Donc perso, “more” est obligé chez moi, avec rédaction d’une accroche, histoire de donner envie.
        Merci pour les idées en tout cas 🙂

        1. Aurélien Denis auteur de l’article

          D’ordinaire, je gère l’extrait avec la zone de saisie correspondante dans l’éditeur de WordPress. Toutefois, après avoir compris les avantages et les inconvénients de chacun, il est conseillé de passer par une balise more. Ce sera le cas dans la prochaine version du site ! 😉

Les commentaires sont fermés.