Pierre

14 mars 2017
w

Des questions ?

Besoin de prendre contact, de présenter votre projet ?

w

Contactez-moi !

Je serai heureux de répondre à toutes vos questions.

Contact

Personnaliser facilement votre page « Catégorie »

Codage, Divi | 210 commentaires

[EDIT]Le thème bénéficiant depuis sa version 4.0 du « theme builder », et celui permettant la personnalisation de tous les aspects des pages, le contenu de cet article est laissé sur le site uniquement pour archivage.[/EDIT] Le thème Divi créé par ElegantThemes est proche du sans faute ; néanmoins il lui manque une chose dont son petit frère […]
Surfing

[EDIT]Le thème bénéficiant depuis sa version 4.0 du « theme builder », et celui permettant la personnalisation de tous les aspects des pages, le contenu de cet article est laissé sur le site uniquement pour archivage.[/EDIT]

Le thème Divi créé par ElegantThemes est proche du sans faute ; néanmoins il lui manque une chose dont son petit frère a hérité et qui est la personnalisation facile de la page des catégories.
Ainsi, avec le thème Extra on peut facilement changer le rendu graphique et le contenu de chacune des pages de nos catégories mais il n’existe aucune manière pour le faire facilement avec Divi.

En partant du code de Fabrice Esquirol que je remercie au passage ;), j’ai voulu assouplir la méthode permettant cette personnalisation. Pour cela j’ai créé pour vous un fichier « category.php« . Je l’ai préparé pour les langues les plus couramment utilisées. C’est-à-dire :

  • l’anglais : la catégorie que vous souhaitez personnaliser devra se nommer « Category suivie du nom de votre catégorie »,
  • le français : la catégorie que vous souhaitez personnaliser devra se nommer « Catégorie suivie du nom de votre catégorie »,
  • l’espagnol : la catégorie que vous souhaitez personnaliser devra se nommer « Categoria suivie du nom de votre catégorie »,
  • l’italien : la catégorie que vous souhaitez personnaliser devra se nommer « Categoria suivie du nom de votre catégorie »,
  • l’allemand : la catégorie que vous souhaitez personnaliser devra se nommer « Kategorie suivie du nom de votre catégorie ».

Maintenant la procédure pour pouvoir l’utiliser 🙂 !

  • placer le fichier « category.php » dans le dossier de votre thème enfant de Divi :).
  • Créez un modèle avec le nom d’une catégorie existante que vous souhaitez personnaliser de votre site avec la syntaxe suivante. Pour la catégorie « Exemple » nommez votre modèle « Catégorie Exemple« .
    Comme WordPress va remplacer tous les caractères spéciaux/accentués et les espaces, le slug de mon modèle deviendra « categorie-exemple » (et c’est ce type de nom que mon fichier « category.php » va chercher pour savoir si une catégorie doit être personnalisée ;)…).
  • Personnalisez votre modèle comme vous le souhaitez en ajoutant tous les éléments que vous voulez. N’oubliez pas d’ajouter un module blog avec la catégorie en cours sélectionnée et un nombre d’articles égal ou supérieur à la valeur entrée dans le champ « Nombre d’articles affichés sur la page des catégories » des options de Divi, sinon vous n’afficherez rien pour votre catégorie ou vous aurez des problèmes avec la pagination 😀 !
  • J’ai ajouté une nouvelle possibilité. Définir un modèle par défaut pour tourtes les catégories 😀 ! Pour cela, comme pour les catégories que vous souhaitez personnaliser, ajouter tous les éléments que vous souhaitez y voir (n’oubliez pas le module « blog ») et enregistrez votre modèle « Catégorie ».
  • Merci à Surya grâce à qui j’ai découvert que les anglais utilisaient une version spécifique de WordPress (avec l’encodage « en_GB ») et qui m’a permit d’ajouter cette « particularité » à mon fichier
  • Merci à Gary Armstrong qui m’a permit d’optimiser l’aspect international de la page category.php 😉 !
  • Appréciez le nouveau rendu de votre catégorie 😀 !!

Cliquez-ici pour télécharger le fichier « category.php » à placer dans le dossier de votre thème enfant de Divi.

Information : Utilisateur convaincu depuis de nombreuses années par ce thème, je suis inscrit en tant qu’affilié sur le site d’elegant themes. Ainsi en cliquant sur le logo ci-dessous, vous bénéficierez d’une remise de 10% sur l’achat du thème et si vous l’achetez, je recevrai une commission :).

210 Commentaires

  1. Bonjour, je m’arrache un peu les cheveux, savez vous s’il y a un moyen pour n’afficher que les articles mis en avant dans le module Blog du builder ?
    Je n’ai trouvé que le système d’étiquettes pour y arriver mais ce n’est pas idéal …

    En vous remerciant!

    • Bonjour Malex :).

      Désolé, mais je ne pense pas que cela soit possible…

      Amicalement,

      Pierre.

  2. Hello ! merci pour ce tuto ! Je suis vraiment novice je tiens à le préciser ???? et je bloque pour « placer le fichier « category.php » dans le dossier de votre thème enfant de Divi ». Je fais tout le reste et j’ai télécharger le fichier mais je ne sais pas où le « placer ». J’ai tenté dans functions.php mais on m’indique cette erreur « syntax error, unexpected ‘<', expecting end of file". Auriez-vous l'amabilité de m'éclaircir ? merci d'avance

    • Bonsoir Samantha :).

      Cette technique est obsolète depuis la sortie du theme builder de Divi 🙂 !
      Je te suggère de te documenter sur ce nouvel « outil » qui te permettra d’obtenir facilement toutes les mises en forme que tu souhaites !

      Passe une très belle soirée !

      Amicalement,

      Pierre.

  3. Merci bcp pour cet article.
    En fait je voudrais savoir si on peut utiliser cette méthode avec n’importe quel thème qui dispose d’un thème enfant (c’est mon cas avec le thème Flatsome) ?
    Merci de votre réponse.
    Pierre.
    Ps : soyez indulgent, mon site est en construction.

    • Bonjour Pierre :).

      Hélas non, tu ne pourras pas utiliser le fichier category.php pour un autre thème que Divi puisque celui va chercher dans la bibliothèque Divi le modèle de personnalisation de la catégorie.

      Passe une très belle journée.

      Amicalement,

      Pierre.

      • Merci quand même pour votre réponse. Je vais trouver une autre solution. Bonne continuation.

  4. Bonjour,
    Merci pour ce beau travail.
    J’ai un soucis avec les méta-descriptions, il semblerait après analyse SEO de mon site que les catégories ont toutes la même description (je crois que c’est celle de la page d’accueil). J’ai tout vérifié sur mon site, les descriptions des catégories sont bien remplies, celles des pages catégories de la bibliothèque divi aussi (j’ai fait une page par catégorie) et l’option divi SEO pour l’affichage des méta sur les catégories est bien activée. Je me demande sur le coup si ça ne pourrait venir du fichier category.php ?
    Merci d’avance.

    • Bonjour Céline :).

      J’ai été jeté un œil sur ton site et j’ai vu que tu utilisais Divi 4.4.5 (la dernière version actuelle), cette technique est donc obsolète :). Tu devrais te documenter sur le Theme builder qui permet de très jolies choses et abandonner ta méthode avec la page « category.php » 🙂 !!

      Passe une très belle journée 😀 !

      Amicalement,

      Pierre.

  5. Bonjour, Superbe méthode !
    Est elle utilisable pour les pages étiquettes ?
    Merci

    • Bonjour Papa Ibrahima :).

      Non, cette méthode n’est utilisable que pour les catégories, mais maintenant, avec le theme builder, tu pourras faire à peu près tout ce que tu veux ;).

      Amicalement,

      Pierre.

      • Hello,

        Aucun moyen de les modifier du coup ?

        Merci d’avance !

        Tom

      • Hello Tom :).

        Non, désolé.

        Amicalement,

        Pierre.

  6. Bonjour, merci pour ce tutoriel qui est vraiment très pratique.
    Par contre j’aimerais faire la même chose mais pour les catégories de projets…
    J’ai testé et ça ne fonctionne pas ici.

    • Bonjour k333 :).

      Désolé pour cette réponse tardive, mais je n’ai pas trop surveillé les coms de mon site ces derniers temps…
      Pour ce qui est des projets ou des catégories maintenant, et depuis la sortie de Divi 4.x, cette astuce est devenue inutile puisque tout est configurable à l’aide du Theme Builder ;).

      Amicalement,

      Pierre.

  7. Bonjour Pierre, pensez-vous qu’il est possible d’utiliser cette méthode pour les catégories Woocommerce ? Y a t’il des spécificités dans ce cas-là Merci d’avance !

  8. Bonjour,

    Merci pour ce tuto très sympa !

    J’utilise wpml et j’ai un problème similaire à d’autres. Tout marche pour la langue par défaut, le français, mais pour l’anglais, le site utilise la page archive par default ?
    l’url des traduction ajoute /?lang=en et j’ai synchronysé les taxonomie ainsi ma catégories actu en français correspond à news en anglais
    résultat
    monsite.net/categorie/actu marche
    monsite.net/category/news/?lang=en ne marche pas

    J’ai fouillé les commentaire et sur le net, mais je n’ai pas trouvé de solution.

    Un idée serait la bienvenue
    merci !

    • Hello jbbj :).

      Désolé mais comme pour Lucia, je n’ai pas vraiment le temps de débugguer ton code :)… De plus je n’ai pas et n’utilise pas (plus) WPML (que je trouve trop lourd) je suis donc bien incapable de t’aider avec ton soucis.
      J’espère que tu as ou vas trouver une solution à ton problème.

      Passe une très belle soirée 🙂 !!

      Amicalement,

      Pierre.

    • Bonjour jbbj,

      j’ai le même problème que toi apparemment en sachant que j’ai paramétré mes urls sur wpml différemment vu qu’elles s’affichent en /en/nom de mon article/.

      Si jamais tu as trouvé une solution depuis le temps je suis preneur.

      Sinon merci Pierre pour ce tuto super sympa.

      Bonne journée à tous.

      • Hello kino :).
        De rien 😉 !
        Passe une excellente journée 🙂 !

  9. Salut. Tout d’abord merci pour cette merveilleuse méthode ! Malheureusement, je ne peux pas le faire fonctionner, je ne comprends pas pourquoi ! J’ai un modèle standard pour toutes les catégories (que j’ai appelé « standard »). J’ai inséré le module « Blog » et j’ai choisi « Inclure les catégories » > « Catégorie actuelle ».
    Dans le fichier category.php que j’ai inséré de cette façon :
    get_header() ;
    chat = get_category( get_query_var(‘cat’))) ;
    $cat_slug = $cat->standard ;
    the_cat_id = $cat->cat_ID ;

    Le permalien est défini comme suit : « domainname.it//%category%/%postname%/ ».

    Qu’est-ce que je fais de mal ?

    • Hello Lucia :).
      Pas vraiment le temps de débugguer ton code mais « $cat->standard » ne me parle pas vraiment :)…
      Je te suggère de mettre des « traces » de ton code pour regarder ce qui est généré en sortie et de découvrir ainsi où ça coince :).

      Passe une très belle soirée 🙂 !!

      Amicalement,

      Pierre.

  10. En effet, c’est une excellente méthode merci beaucoup !

    Je me demandais si elle était aussi applicable pour les articles ?

    J’ai pu modifier la page catégorie pour mettre un bandeau, j’aimerai en faire de même avec les articles : un bandeau sous le menu, suivi du titre et de l’article. La mise en page de base mettant un espace blanc entre le menu et le titre, qu’on ne peut pas personnaliser, puis la création de l’article.

    Merci dans tous les cas !

    • Bonjour Stefano :).

      Heureux que l’astuce te plaise et te soit utile :).
      Voilà une bonne question :). Peut-être sera-ce le sujet d’un future article :)… Rien n’est prêt pour l’instant, mais si j’ai du temps, je tâcherai de me pencher sur le problème et voir si je peux créer un code simple et portable facilement :).
      Passe un excellent WE 😀 !

      Amicalement,

      Pierre.

  11. Top, ca marche

    Une question comment je fais pour afficher la description de la categorie en cours dynamiquement ?

  12. Bonjour Pierre, merci pour ce tuto ! le résultat est génial 🙂
    Selon vous le même procédé est-il réalisable pour personnaliser les pages des étiquettes ? Merci par avance !
    Bonne journée
    Benoît

    • Bonjour Benoît :).
      Heureux que ça te plaise :). Par contre pour les tags le soucis est que tu ne peux pas utiliser le module blog pour cette taxonomie car le module n’utilise que les catégories…
      Désolé…
      Passe une très belle journée 😀 !!

      Amicalement,

      Pierre.

      • Merci pour ta réponse ! c’est déjà top de pouvoir le faire pour les catégories. Très belle journée à toi aussi 🙂

      • Re-Bonjour Benoît :).

        Je t’en prie :). Nous n’avons plus qu’à attendre patiemment la sortie tant attendu du Theme Builder de Divi :)…

        Passe une très belle journée 😀 !

        Amicalement,

        Pierre.

  13. Bonjour Pierre!

    Merci beaucoup cela à très bien fonctionné pour moi!
    J’ai voulu par la suite changer mes permaliens pour enlever le préfixe « category » et dans ce cas de figure cela ne fonctionne plus… Du coup j’ai remis les permaliens en configuration classique, mais peut-être existe-il un moyen de supprimer ce préfixe?

    Amicalement,
    Perrine

    • Hello Perrine :).
      Alors là tu me poses une colle :). En fait la page « catégorie » que j’ai créé, utilise le nom de la catégorie, mais quand elle est « supprimée » par le biais de la page « Permaliens », je ne sais pas comment ça se passe en coulisses :)…
      Donc si tu me dis qu’en supprimant le préfixe par la dites option, ça ne marche plus, je crains qu’effectivement il faille la laisser « activée ».

      Passe une très belle journée ensoleillée 🙂 !

      Amicalement,

      Pierre.

      • Je vais laisser comme ça, ce n’est pas très grave…
        Merci encore et très belle journée à toi aussi Pierre!

        Amicalement,
        Perrine

  14. Exactement ce que je cherchais, super efficace, bravo !
    Cependant une chose que je ne comprends pas. J’ai tester sur iPad, iPhone, firefox mais sur safari le module blog ne s’affiche que si on scrolle vers le bas.
    Une idée ?

    • Bonjour Joel :).
      Non désolé, aucune idée :)…
      Et j’avoue être un peu beaucoup occupé et ne pas avoir de Mac, donc test impossible sous Safari pour ma part.

      J’espère que tu trouveras la solution.

      Amicalement,

      Pierre.

      • Pierre, merci pour ta réponse, le soucis ne viendrais de chez élégant themes, apparement je suis pas le seul.

  15. This works! Thank you so much!

    • Hi alan :).

      Happy you like it :D!

      Have a great day!

  16. Bonjour, je débute avec divi, et est bien réussi à installer divi child,
    mais je me retrouve coincée sans savoir où ajouter votre fichier!
    « placer le fichier « category.php » dans le dossier de votre thème enfant de Divi :). »

    Merci beaucoup pour toutes ces explications qui nous simplifient énormément la tâche!

    Audrey.

    • Bonjour Audrey :).

      Alors si tu as installé un thème enfant à Divi (divi child) tu dois avoir sous le répertoire wp-content/themes de ton installation WordPress le dossier en question :). C’est là qu’il faudra placer le fichier category.php.
      Je suis sûr que tu vas trouver ;).

      En attendant, je te souhaite de très belles fêtes de fin d’année 😀 !

      Amicalement,

      Pierre.

    • hello Audrey peux tu me dire comment tu a affiche la description de la catégorie ? ( meme sur toute les pages , )

  17. Bonjour,
    Je cherche depuis maintenant quelques bonnes heures, la manière pour afficher la description de la catégorie uniquement sur la première page, et non sur les suivantes, pour éviter toutes duplication de contenu.

    J’ai cherché sur le net, j’ai trouvé ce conseil :

    ———————————————————————————————————————————————————

    C’est une bonne solution mais comment éviter que cette description se répète sur les pages suivantes en cas de pagination? Ce code à insérer dans votre fichier category.php, résoudra le problème.

    Remplacez :

    if ( ! empty( $category_description ) )
    par

    if (!empty($category_description) && $paged == 0)

    ———————————————————————————————————————————————————

    Malheureusement, je ne trouve pas la ligne if ( ! empty( $category_description ) ) dans mon fichier catégorie.php…

    Ni dans divi, y’a t’il une solution ?

    Merci

    Belles fêtes de fin d’année

    Nelly

    • Bonjour Nelly :).

      Désolé et pour le temps que j’ai mis à te répondre et pour la réponse que je vais t’apporter :)… Je suis un peu beaucoup occupé en ce moment pour être capable de tester une solution et t’apporter une réponse technique.
      Il va donc falloir que tu trouves la réponse seule ou que tu attendes que je revienne sur sujet pour voir si je peux t’apporter la réponse que tu attends :).

      En attendant ça, je te souhaite de très belles fêtes de fin d’année 😀 !

      Amicalement,

      Pierre.

  18. Salut! Merci de ton article! J’ai un doute:
    Dissons que j’ai 4 categories sur mon blog:
    1. Rouge
    2. Vert
    3. Jaune
    4. Bleu

    J’aimerais construire un model comme ça:

    Full header (image)
    2 columns: titre – description

    Comment devrais-je le faire pour que l’image header de la categorie Blue fut une image blue, et celle de la categorie jaune, un jpeg jaune. Même pour la personalisation des titres.

    Merci beaucoup!

    • Bonjour Sara :).

      Et bien c’est simple tu crées 4 modèles dans ta bibliothèque Divi.
      Un qui s’appelle « Catégorie rouge » et qui contient un full header avec l’image que tu souhaites puis ta rangée avec tes 2 colonnes, un qui s’appelle « Catégorie vert » avec ta personnalisation et ainsi de suite :).
      Comme ça tu auras personnalisé chacune de tes catégories comme tu le souhaites ;).

      Passe une très belle soirée 🙂 !

      Pierre.

  19. I want to share an easyear method.
    Making the shortcode inside the theme file to never touch Divi Layouts again.

    Here is my category.php, it automatically sets the category id based on the current category page.
    It’s very easy to personalize the behaviour, you only need to read it.
    Enjoy.

    « `slug;
    $the_cat_id = $cat->cat_ID;
    $the_cat_name = $cat->name;

    ?>

    « `

    • Hi pad52 :).

      Sorry but it seems that your code have been cut by WP…
      Perhaps you can give us a link where we can see it more easily ;).

      Have a great day!

      Pierre.

  20. bonjour Pierre,
    Merci pour ce tuto. En revanche, je n’arrive pas totalement à le faire fonctionner chez moi. Je souhaite afficher les articles de mes catégories en mode Grille, mais il ne veut pas le prendre en compte alors que tout les autres modifications que je fait sur mon  » modèle  » catégorie fonctionne bien. Aurais tu une piste ? la seule petite différence que j’ai vu avec ton tuto c ‘est que quand j’ai créé ma page catégorie modèle dans le menu déroulant je n’ai pas  » disposition ». merci de ton aide.

    • Bonsoir chinouk :).

      On a vu ensemble ton « problème » sur FB ;).

      Passe une très belle soirée :).

      Pierre.

  21. Salut Pierre,
    j’ai une question pour ton excellente page catégorie : y aurait-il un bout de code à ajouter, par chance, pour qu’un modèle Divi qu’on applique à une catégorie s’applique aussi directement aux sous-catégories de cette catégorie ? Ca permettrait de faire des modèles à de grande familles de Post. Je doute que ce soit possible, mais on ne sais jamais…

    Merci !
    Laurent

    PS : Je partage aussi un soucis que j’ai eu mais que j’ai résolu : je créais un modèle nommé par exemple « Catégorie bateau », puis je changeais pour tester un autre, genre « Catégorie voiture ». Et ça ne marchait plus. Puis j’ai voulu tester le global « Catégorie ». Rien à faire.
    Sauf que… quand on modifie le nom d’un modèle, le slug ne change pas. Donc ta page catérogy.php ne reconnait pas la catérorie concernée. Donc quand on change le titre d’un modèle, changer aussi le slug… Ca semble évident, mais j’ai perdu un peu de temps avec ça…

    • Bonsoir Laudag :).
      merci pour ton partage d’expérience :). Effectivement en cas de renommage ne pas oublier le slug puisque c’est lui qui prime ;)… Pour les sous-categories cela risque de faire un peu usine à gaz :)… Je laisse le soin à l’équipe de ET de nous sortir rapidement la nouvelle version de notre thème fétiche avec son fameux Theme Builder :).
      Je croise les doigts pour une sortie rapide :).

      Amicalement,

      Pierre.

  22. thank you very much! works fine!
    here is the website : http://janainacintas.com.br/

    muito funcional! parabéns!
    well done! congratulations!

    • Hi Weber :).

      You’re welcome. Happy you like it :).

      Have a great day.

      Pierre.

  23. Re-bonjour Pierre,

    Après vous avoir posté mon commentaire, j’ai eu l’idée de créer un modèle nommé Category et non Catégorie. Et là ça fonctionne. Donc c’est du à mon problème de langue.

    Désolé.

    Cordialement

    • Bonjour Joseph :).

      Heureux que tu es réussi seul à t’en sortir. Bravo et merci pour ton retour :).

      Amicalement,

      Pierre.

  24. Bonjour Pierre,

    Je suis en train de tester votre méthode pour afficher des posts en fonction d’une catégorie choisie. J’ai opté pour la méthode « un modèle par défaut pour toutes les catégories ».
    J’ai donc ajouté dans ma bibliothèque Divi un modèle nommé Catégorie qui possède une ligne avec un texte d’intro, une ligne avec une sidebar à droite et le blog à gauche, et une ligne avec un CTA.
    Lors de la prévisualisation du module blog dans la bibliothèque ça fonctionne bien mais lorsque je regarde normalement la page archives pour une catégorie, mes posts ne s’affichent pas au format Grid.
    Je ne vois pas où est le souci.
    Est-ce le fait que j’ai, depuis la dernière mise à jour de Divi, un problème sur le réglage de la langue du site ? En effet je ne peux plus passer en langue Française quand le thème Divi est activé.
    Le lien vers la page concernée : http://new.ckelprocess.fr/caisse-enregistreuse/logiciel/

    Merci d’avance pour votre aide.

    • Salut,
      pour info, pour récupérer la langue française dans Divi, il faut aller dans « Divi> options du thème>Désactiver les traductions.
      Tu vas récupérer tout en français.

  25. Merci Pierre 🙂
    Malheureusement si j’ai bien tout compris l’anglais cela ne fonctionne pas avec les « Projets » et les « Catégories De Projets » !
    Le module Blog n’affiche pas les « Catégories De Projets ». Il n’y a que le module « Portefeuille » qui les affiche.
    L’URL qui s’affiche dans mon cas est http://tepe-studio.fr/project_category/print/ et même en nommant le modèle « Project Category » cela ne fonctionne pas.
    C’est dommage mais merci quand même.

    • Bonjour tépé :).
      Oui le code que je fournis est prévu pour les catégories d’articles pas de projets, mais en cherchant un peu tu pourras peut-être utiliser à peu près la même chose pour tes projets ;).
      Amicalement,
      Pierre.

  26. Bonjour Pierre, Merci pour ce tuto bien pratique pour les pages Cat. + usage de WPML. J’ai toutefois un problème majeur puisque la pagination ne fonctionne pas et ce malgré un gestion adéquate des nombre d’articles à présenter. https://www.test.lemaitreantiques.com/category/peintures/

    Une idée ?

    • Bonjour Thibault :).

      Là j’avoue, je sèche :)… Pas d’explication pour ce problème. C’est la première fois que ça se produit. Peut-être une « incompatibilité » avec WPML, bien que j’en doute.
      Désolé de ne pouvoir t’aider, Thibaut.

      Amicalement,

      Pierre.

      • J’ai fini par trouver, un snippet PHP qui devait implémenter en « Product Per Page » pour la page Woocommerce. Etonnant tout de même 🙂 .

        Encore merci. Et Vivement que E.T. nous apporte une solution clé en main pour gérer toutes les pages d’Archives+

      • Hello Thibault :).
        Chouette 🙂 ! Tu devrais partager ta trouvaille avec tout le monde 🙂 !
        Ça permettra aux utilisateurs qui sont coincés comme tu l’as été d’avoir une solution à leur problème 😉 !
        Amicalement,
        Pierre.

  27. Bonjour Pierre, super tuto merci ! J’ai testé ton fichier category.php en généraliste (un pour toutes les catégories) … mais est-il possible d’afficher le nom de la catégorie en h1 de manière automatique ? J’ai testé avec la fonction single_cat_title mais il semblerait que ça ne passe pas. Une idée? Merci pour ton travail dans tous les cas !

    • Bonjpur Amélie :).

      En t’inspirant de l’astuce de Lisa, tu peux ajouter cette petite fonction dans le fichier « category.php » que j’ai créé ou dans « function.php » de ton thème enfant :
      function get_cat_title () {
      $post_title=single_cat_title( '', false);
      return $post_title; }
      add_shortcode('show_post_title', 'get_cat_title');

      En ajoutant le shortcode « [show_post_title] » dans un champ texte tu pourras le mettre en forme comme tu le souhaites 😉

      Amicalement,

      Pierre.

      • Super merci beaucoup, cela fonctionne très bien !

  28. Excellent travail ! Mais puis-je l’adapter pour les catégories de produits WooCommerce ? Si oui comment ? 🙂

    • Bonjour Rémi 🙂 !

      Désolé mais pas testé ;).
      Passe une belle journée 😀 !

      Amicalement,

      Pierre.

  29. Should I create layouts for every category to apply that template / if I do for one is it enough?

    • Hi Salma :).

      You can create a global category template or distinct tempate like category-test, category-exemple, etc ;).

      All the best,

      Pierre.

  30. bonsoir,
    Je n’arrive pas à faire marcher votre process… J’ai un prefix sur mon site qui s’appelle guide au lieu de categorie…
    Cela veut dire qu’il faut que les url des catégories soit du style /categorie/XXX/ pour que cela marche ?
    Merci d’avance pour votre eclaircissement
    JL Lopez

    • Bonjour Lopez :).
      Désolé mais je ne peux pas tester tous les cas de figures ;). A priori, je dirai que ton changement de slug ne devrait pas avoir d’incidence sur le comportement du code.
      N’oublies pas de bien nommer tes templates précédé par « catégorie » (exemple : « catégorie test ») même si ton « slug » est guide ;).

      Amicalement,

      Pierre.

  31. Hello Pierre,

    Avant tout, merci pour ton travail ! Ton code m’a permis d’améliorer la hiérarchie de mon site, cela a un impact très positif sur le seo.

    Je bloque cependant sur un sujet concernant ces catégories custom. J’utilise Toolset, qui me permet par exemple de créer un champs perso qui sera disponible lors de la création de ma catégorie custom dans la bibliothèque Divi.
    Je vois ce champs, je peux le remplir mais lorsque j’interroge la page catégorie générée (avec un get_post_custom() ), je ne vois aucune information lié à ce champs custom.
    Si je fais le même exercice sur un article, je retrouve les valeurs de mon champs avec le get_post_custom().

    Est-ce que tu vois une solution à ce problème ?

    • Bonjour Eric :).

      Malheureusement je ne peux pas me pencher sur tous les « cas particuliers » qui se présentent ;)… Je te suggère de faire des « print_r » de tes variables/champs pour tracer tout cela. Ensuite est-tu sûr de ne pas avoir créé des catégories avec tes CPT ? Auquel cas il va falloir te pencher sur la hiérarchie des templates WP ;). Un petit oeil ici vaut mieux que de grands discours : https://codex.wordpress.org/images/1/18/Template_Hierarchy.png.
      Amuses-toi bien :).

      Amicalement,

      Pierre.

  32. Hi Pierre, Awesome job!! This is a life saver..

    Are there any plans to do the same for the posts with the single.php file? I want to do the same but not sure where to start. It seems it will be the same approach but not quite sure since I am not creating custom post type, just using the default one.

    Any pointers will be highly appreciated!

    • Hi Karim :).
      You’re welcome :). If you want to push the customization I think you could have a look to one of the Sean Brton plugin :)… I use « CPT Layout Injector » to customize my layout for posts ;)…
      Have a great day !

      All the best,

      Pierre.

  33. Bonjour Pierre,
    Merci pour votre tuto qui rend les catégories divi bien plus agréables à regarder. J’ai tout de même une question : Auriez-vous un morceau de code CSS pour afficher le blog sur les mobiles avec une ligne et non deux comme actuellement ?
    merci

    • Bonjour Edith :).
      Je suis content que tu ai pu utiliser cette astuce pour ton propre site :).
      Quant à ta demande de CSS, j’avoue ne pas comprendre ce que tu veux :). Et comme c’est mon métier, tu pourras sans doute bénéficier de mon mon aide pour ce(s) problème(s) dans une prestation ;).
      N’hésites pas à me contacter si tu souhaites plus d’informations.

      Amicalement,

      Pierre.

      • Désolé, je me suis mal exprimé !
        Je voulais dire afficher le blog sur 1 colonne sur les mobiles. Car actuellement le blog est sur deux colonnes et ce n’est pas trop top.
        Voilà Pierre

      • Décidément, un problème de cache sûrement car, maintenant l’affichage est correct.
        Merci Pierre ……

      • Tes articles s’affichent bien sur 1 colonne jusqu’à 767px de large. C’est une comportement normal de Divi ;). Au delà de 767px tu « bascules » vers un affichage à 2 colonnes.
        Si tu veux changer ce comportement, il faut ajouter cette règle dans le fichier style.css de ton thème enfant :
        @media (max-width: 980px) {
        .et_pb_column .et_pb_blog_grid .column.size-1of1, .et_pb_column .et_pb_blog_grid .column.size-1of2 {
        width: 100%!important;
        margin-right: 0!important;
        }
        }

        Après si tu veux plus de personnalisation, je te propose de me contacter pour connaître le tarif de mes prestations ;).

        Amicalement,

        Pierre.

  34. Hi,

    Does your new element

    ‘I’ve added a new possibility. Define a template by default for all categories ????! For that, like for the categories that you want to customize, add all the elements that you want to see (do not forget the « blog » module) and save your layout with the name « Category » (« Category » in French, « Categoria » in Italian and Spanich, « Kategorie » in Deutch).’

    Mean I only have to create one Template in Divi Library for all Product Category Page?

    Many thanks in advance, if this is second post, it is because when I posted earluer I got an error about incorrect email. 🙂

    • I have just realised that maybe your solution is for Blog post only? Not WooCommerce categories?

      • Hi Rob :).

        you’re right I’ve tested my solution only on standard and simple blog posts ;).
        So, for interact with Woocommerce I suggest that you have a look to the plugins from Steve Barton that permit to really extend the template usage ;).

        Have a great day.

        Pierre.

      • Salut Pierre, le plugin de Sean Barton n’est pas compatible avec WPML donc ça ne fonctionne pas. (En tout cas pas avec plus d’un modèle). Raison pour laquelle je venais refaire un tour ici. Je vais chercher si c’est possible de modifier ton code pour les page de catégorie de WooCommerce mais je ne suis pas développeur 🙂

      • Bonjour Bruno :).

        Que le plugin de Sean ne soit pas compatible avec WPML, m’étonne un peu mais je te crois si as essayé :). Par contre, je ne comprends pas pourquoi tu utilises un plugin payant lorsqu’il existe son excellent petit frère (Polylang) gratuit :)…

        Bon code 😀 !!

        Amicalement,

        Pierre.

  35. I have not read all 117 posts and I don’t speak French. I appreciate this tutorial and hope someone can help me complete the work. I’m very close! I’m currently between paying projects and spinning my wheels making over my own personal cycling site from an outdated and no longer supported WooTheme to Divi. I’m experienced with Divi but I’m not a coder.

    Live site is at: http://s2cycle.com/
    Divi Staging at: http://staging4.s2cycle.com/

    I’ve added the provided category.php to my child theme.
    I’ve saved a few category templates per instructions. They’re all the same with a blog masonry and a sidebar.
    One question is that the instructions say to save as « Catégorie Exemple« so I’ve done « Category Sheila«
    But I suspect that the second chevron is supposed to face to the right and possibly have a space so it’d be « Category Sheila » instead…right?
    Maybe that doesn’t matter?
    I’m very excited about the potential for this.
    I saved them all with the same category selected initially, but then went into each one in the Divi Library and set the correct category to display and the correct sidebar to display. The sidebar displayed in the original that I saved but now as templates they do not display the sidebar anymore.

    Here’s what I am seeing and need help with…
    This is Category-Sheila: https://staging4.s2cycle.com/category/sheila/
    It’s correctly pulling the blog masonary. However, it’s not displaying the selected sidebar.
    You can see the correct sidebar on each of this category’s single posts: https://staging4.s2cycle.com/sheila/sheila/
    So it’s there and correctly selected.

    I’m so close. Why won’t the sidebar display on the top category archives?
    Thanks for any help.

    • I’ve successfully converted all my 40 categories to have custom templates and they’re lovely.

      My only remaining “issue” is how to make the search results and tag archives take the same format. I tried making a template tag-arizona but it didn’t work. I’m guessing I need to copy the custom category.php file and make a tag.php file but I don’t know what ELSE may need doing to it. And maybe the same for search results? I don’t know how to do this but can follow directions or download an example. Any help there?

      Thanks.

      • Hi Sheila :).

        If you want to go further, I suggest that you have a look to the plugins from Steve Barton that permit to really extend the template usage ;).

        Have a great day.

        Pierre.

    • i have the same problem did you find a solution for this?

  36. Bonjour,

    Ça ne marche pas pour moi. J’ai copié le fichier « category.php » dans mon thème enfant. Je crèe un modèle dans ma biliothèque DIVI avec un module blog. Quand j’ouvre ce modèle avec le visuel Builder, c’est parfait. Mais lorsque je clique sur ma catégorie sur mon site, j’ai toujours la mise en page par défaut. 🙁
    Je ne comprends pas ce que j’ai oublié. Mes pages categories sont nommées par des chiffres ?cat=9, est-ce pour celà ?

    • Bonjour Vial :).

      Oui, je crains malheureusement que ce soit le problème. Ne peux-tu pas modifier les permaliens ?

      Amicalement,

      Pierre.

  37. Bonjour Pierre, et merci pour ce très beau travail ! ça fonctionne parfaitement. Idéalement, il faudrait qu’on puisse habiller les pages single.php sur cette même méthode. Le top étant que Divi permette un jour ces customisations en natif 😉
    Dans les options du thème, il est possible de définir quelles meta on souhaite afficher. Comment faire pour que ton code permette cela ?
    Merci beaucoup.

    • Bonjour Nathalie :).

      Ravi d’avoir pu t’aider :). L’équipe de Divi permettra un jour, peut-être (je l’espère aussi), d’utiliser le personnalisateur de catégories comme dans Extra. Ce sera alors un vrai plus !
      Pour ce qui est d’utiliser les métas par contre il va falloir que tu « mettes les mains dans le code ». Mais cela est très bien documenter dans le codex de WP.
      N’hésites pas à nous faire un petit retour pour les partager avec nous si tu fais de belles découvertes 🙂 !!
      Désolé mais en ce moment, je n’ai que très peu de temps pour moi et je ne peux donc me consacrer à la personnalisation de tous ;)…
      Passe une très belle journée.

      Amicalement,

      Pierre.

      • Je suis confuse, j’ai mal préparé mon modèle de page et les meta auteur, catégories, commentaires etc… étaient cochées. En réglant correctement mon module « Blog », les meta sont bien pilotées depuis Divi. Toutes mes excuses, je t’ai fait perdre du temps.

      • Je t’en prie Nathalie 🙂 !

        Pas de problème :).

        Passe une très belle journée.

        Amicalement,

        Pierre.

  38. Hello Pierre,
    i have a problem when the category and post are both fullwidth layout.
    the problem happens when both category and posts use fullwidth header or fullwidth post title.

    the fullwidth header background image at category page will replace the image on the fullwidth post title on blog post. that means the fullwidth image on category page affect the post’s fullwidth image. they are not individual.

    do you have any idea to fix it ?

    does anyone have the same problem? or do i have do something wrong ?

    thank you for sharing the category.php. it’s really awesome!
    btw, Happy New Year 🙂

    • Hi betty 🙂

      Sorry but I really have no time actually to have a look on your problem ;)…
      I hope that someone else can give you an answer on that one :).

      I wish you an happy new year 😀 !!

      All the best,

      Pierre.

      • Hello Pierre,
        no problem. finally i find a solution. i just change the Divi setting and it works.
        i enable the “Output Styles Inline” (Divi Theme Options -> Builder -> Static CSS File Generation), the fullwidth image on the category page and posts shows up. it shows exactly what i design. here is the theme seeings: https://www.screencast.com/t/Kbq29iw8Kbw

        the you supplied, i need to modify a little bit so that it can be worked. not sure if it is related to my wordpress is in Chinese language. below is what i change for the

        default:
        $my_cat = ‘category’;

        hope this message helps others

      • Great 😀 !
        Good work betty 😀 !! And thanks for sharing your solution 🙂 !!

        Have a great day!

        All the best,

        Pierre.

  39. Salut Pierre,
    excellent travail, ça a marché du premier coup pour moi.
    voir ici : http://www.bluehouse.fr/JB6/rickshaw/
    le site est toujours en construction.
    Une question, j’aimerais faire la même chose avec les ‘Articles récents’ et les ‘Archives’ peut-on adapter ‘category.php’ en ‘recent.php’ et ‘archive.php’ ?
    Pour moi, le fichier ‘categoty.php’ c’est du chinois …
    Merci (et encore bravo pour ton travail !)
    Jacques

  40. C’est intéressant et j’ai exploré un peu plus loin votre solution pour réaliser un modèle général autour du module blog (en terme de design et de fonctionnalités) pour les catégories, tags, authors etc…
    En fait le plus simple, une fois que l’on a préparé les modèles (category.php, tag.php, etc, il suffit :
    – de faire passer une variable globale dans le module blog, par exemple pour les tags => global $tag_slug,
    – de créer une commande dans le module blog => ‘active_templates’ sur off / on ,
    – de modifier les arguments wp-query avant la boucle pour faire passer la variable, par exemple pour les tags modifier la ligne 1022 avec le code suivant:

    if ( ‘on’ === $active_templates) {
    global $tag_slug;
    $args = array( ‘posts_per_page’=> (int) $posts_number, ‘tag’=> $tag_slug,);
    } else {
    $args = array( ‘posts_per_page’ => (int) $posts_number);
    }

    J’ai essayé avec une copie du module blog dans le thème enfant et ça fonctionne parfaitement. On peut généraliser pour categories, author, voir search…

    Amicalement et merci.
    Alain

    • Bonjour Alain :).

      Oui c’est intéressant :). Pourquoi ne pas faire un joli petit tutoriel pour développer et partager cette jolie découverte avec tout le monde 🙂 ?
      Par contre, si tu modifies actuellement les fichiers « natifs » de Divi, il va sans doute falloir trouver une méthode un peu plus propre afin de ne pas toucher aux fichiers orignaux et surtout de ne pas avoir à re-modifier le code à chaque (nombreuse) mise à jour du thème ;).
      Passe une belle soirée 🙂 !

      Amicalement,

      Pierre.

  41. Hi Pierre,
    Unfortunately, it doesn’t work. So what did I forget:
    I created category.php within my child theme. Lanhuage is Dutch, so ‘categorie’ is used, which is set as default.

    The pages I create show the posts the way I want to, with the correct sidebar. But when clicking on the category name within the post itself (which is stated just below the title of the post) then the posts are presented in another way.

    The blogs / posts can be found under NIEUWS in the menu.

    So what did I miss?
    Thanks in advance

    • Hi Anne-Rose :).

      I’m not sure to understand you. The code in category.php is intended to customize the render of categories not the posts ;)…
      If what you mean is about posts I can’t do nothing. Otherwise, I’ve noticed that you use page (without category in the url) to display posts belonging to categories, so the template (category.php) is not used in this case ;).
      BTW if you want to customize them, you just have to customize each page but the render may differ with the display of categories.
      I hope that I’m understandable :).

      All the best.

      Pierre.

      • Hi Pierre,
        I want to render the categories indeed: to display all blogposts in a certain category.
        I didn’t pay attention to the URL. You say it mentions the page, not the category.
        At this moment: http://nieuw.withatouchofrose.nl/blog/ shows it the way I want it to be, but
        http://nieuw.withatouchofrose.nl/category/blog/ shows it differently and not the way I want to.
        The first one is a page, the second one automatically created. I thought that by using category.php I could make sure that the second URL would show the same as the first

      • Hi Pierre, I found a different solution to get it done. Thanks for looking at it.

  42. Hi Pierre,
    Thank you so much for this 🙂 It works perfect with all my « normal » categories.

    I have one special designed plugin that makes some « odd » category slugs like mydomain.com/?pregnancy_weeks=week-20

    Would it be possible to modify your category.php to include this type of slug also?

    • Hi Michael :).

      Sorry but I have no time actually to help you on that one :)… I think you’ll have to find it by yourself.

      All the best 😀 !!

      Pierre

  43. Salut et merci pour cet excellent tuto ! Pour optimiser un peu le seo des catégories, j’ai ajouté à ton code quelques lignes de php pour afficher titre de la cat et description.

    Juste une question, quand on créé un modèle qui s’applique à toutes les catégories, comment fais-tu pour spécifier la catégorie d’articles de blog qui sera appelée via le module « blog » de divi ? un truc m’échappe 🙂

    • Bonjour Guillaume :).
      Et bien en fait c’est « simple », j’annule le critère de Divi (en le remplaçant par une balise ignorée « unknown » puis « j’injecte » la catégorie en cours grâce à ma variable « $the_cat_id » que je définis dans les 3 premières lignes de mon code (à partir de la ligne 3).
      J’espère avoir été clair ;)…
      PS. De mon côté, j’ai aussi une ou deux questions :)… Je suis allé voir ton site et j’ai vu que tu avais un site avec 150 000 visiteurs uniques par mois :).

      1. Comment fais-tu pour que ton site tienne la route avec autant de visiteurs sans plugin de cache 🙂 ?!! Gros dédié ?
      2. 200 000 inscrits à la newsletter 🙂 !! Tu utilises quel outils avec autant d’inscrits ?

      Merci pour tes réponses 🙂 !!

      Amicalement,

      pierre.

      • salut ! Tu parles de quel site ? (il y en a plusieurs 🙂 (diantre, je ne reçois pas tes réponses, je suis repassé ici par hasard.. si tu veux papoter je te propose twitter @netgui ?)

        AU plaisir !

        G.

      • Re Guillaume 🙂 !
        Je ne trouve plus ta page de références :)… Donc je ne sais plus sur quel site tu as ces stats…
        Quant à twitter, je ne l’utilise que très, très peu (oui je sais, j’ai tort 😀 ).

        Amicalement,

        Pierre.

      • ok, en tout cas j’utilise Mailchimp ET/OU Mailjet, selon les besoins et cas de figure. Et pour les sites, en général oui un dédié généré par un admin serveur expérimenté et tout ça à Paris. Je n’ai pas installé de plug de cache ni CDN ni autres joyeusetées parce que j’ai une horripilante horreur des plugin WordPress qui s’accumulent en général par dizaine et rende le truc instable (mais ce n’est que mon avis) 🙂

      • :).
        Merci pour le retour Guillaume 😀 !

  44. Thank you for this! Works brilliantly.

    Can this solution work for customising the blog post single.php with a Divi builder layout?

  45. HI! Thanks a lot!!!

    On Divi 3.0.76 still working.
    For Hungarian language: category slug is:
    kategoria
    Edit category.php as follows:

    case ‘hu_HU’:
    $my_cat = ‘kategoria’;
    break;

  46. Bonjour Pierre,

    C’est génial ce que tu as fait. J’utilise les extensions KK Mods. J’ai regardé ton code et j’ai adapté pour le KK Blog Grid Ext.
    Si tu veux rajouter une note pour ceux qui utilisent ces extensions …
    Voici le code :
    $html = str_replace(‘[et_pb_kkblogext_grid ‘, ‘[et_pb_kkblogext_grid include_categories= »‘.$the_cat_id.' » ‘, $html);
    $html = str_replace(‘[et_pb_blog ‘, ‘[et_pb_blog include_categories= »‘.$the_cat_id.' » ‘, $html);

    Il y a d’autres modules dans la collection, en suivant ton principe, ça doit le faire (comme on dit chez nous).

    Merci pour ton travail 😉

  47. Pierre,

    Thank you very much for this!! Clients often ask for their category pages to match their blog pages. And now we can have individual styles for each category! 🙂

    It should soooo much be standard in Divi. i think everyone has already suggested it to Elegant Themes though!

    Dave

  48. Hi,

    All working well thanks for that, but has any noticed or mentioned that the divi visual editor stops working? So having to use to get the correct paragraph break.

    Does anyone have a solution?

  49. This is excellent thank you. Is there a way to call the woocommerce product catagories, not blog catagories? I would love to use this to beable to edit my woocommerce shop. Thanks so much for sharing your efforts.

  50. Sorry for all if I don’t respond quickly to your requests, but since I lost my father a short while ago, I really live complicated moments currently: (…

    Do not hold it against me

    Amicably,

    ***************

    Désolé pour tous si je ne répond pas rapidement à vos demandes, mais comme j’ai perdu mon père il y a peu de temps, je vis vraiment des moments compliqués actuellement :(…

    Ne m’en tenez pas rigueur

    Amicalement,

    Pierre

  51. Bonjour,

    Merci pour ces explications tout marche très bien. Mais est-il possible d’avoir un modèle qui permette d’intégrer dans la même page la catégorie et ses sous-catégories de manière classée ? Merci

  52. Hello Pierre, thanks for your excellent work!!!

    I have tried: « Define a template by default for all the categories »
    It works perfect!
    But I want to show the name of the category as a h1
    How do I do it?

    Thanks Silke

    • Bonjour,

      J’ai exactement la même question s’il te plaît Pierre.

      Merci pour ton aide et bravo pour cet excellent tutoriel qui apporte beaucoup.

      • Bonjour Aurore :).
        Je te renvoie vers le commentaire de Lisa, notamment à la fin sur la partie shortcode qui moyennant quelques tous petits efforts te permettra de faire exactement ce dont tu as besoin ;)…
        Passe une belle soirée 🙂 !

        Amicalement,

        Pierre.

  53. Hi Pierre

    I have a problem. My wordpress is installed in danish so the code you wrote doesn’t work, is there a way to make it work in other languages? do you have a piece of code i can add to the original code, so i can use it in danish?

    Looking forward to hearing from you.

    • Hi Sabrina.

      in fact it should work. You just have to name your template « Categorie » or « Categorie-your-slug » replacing « your-slug » by the slug to your category.

      Amicably,

      Pierre.

      • Hi Pierre

        Thank you for the response. My only problem is that it still doesn’t work.
        Do you have any other things i could try to make it work?

        Kind regards Sabrina

      • Hello again

        It works now, my bad 🙂

        Thank you!!

  54. Thank you. Excellent solution.

    • You’re welcome Whit :).

  55. Hi. Thanks for the file. It saved me a lot of hours of work.
    For this to work in Brazilian language (pt-br) you need to rename the default to ‘category’.
    Original is:
    default:
    $my_cat = ‘categorie’;
    Change to
    default:
    $my_cat = ‘category’;

    Thanks,

    • Hi Luiz :)!

      As you name like you want your templates in the Divi library, I’m not sure to understand the interest to rename the variable $my_cat to call your category template ;)…
      Anyway thanks to share your experience. I’m sure it will serve someone else here :).

      Amicably,

      Pierre.

  56. Merci pour ces explications, j’ai suivi tes instructions et j’ai défini un modèle par défaut pour toutes les catégories.
    Mais je rencontre un petit problème, comment est ce que je peux modifier le contenu de chacune des catégories (car si le modèle est le même le contenu est différent) ?
    j’espère que tu auras l’occasion de répondre, merci d’avance

    • Bonjour Stéphane 🙂 !

      Désolé mais je crains que sans plugin supplémentaire et sans codage dans ton fichier category.php tu ne puisses obtenir une vraie « personnalisation » de tes catégories :)… Je ne peux que te suggérer de te tourner vers un des plugin de Sean Barton, comme https://elegantmarketplace.com/downloads/taxonomy-layout-injector/ (17$) et/ou https://elegantmarketplace.com/downloads/custom-post-type-layout-injector/ (22 $).
      Avec ce type de plugin tu feras, à peu près, tout ce que tu voudras :).

      Passe une très belle fin de journée 😀 !!

      Amicalement,

      Pierre.

      • Bonsoir Pierre
        Du coup je vais créer un modèle pour chacune de mes catégories.
        Encore merci et bonne fin de journée à toi aussi.
        Amicalement
        Stéphane

  57. Hi Pieree, thank you for this possibility. I’m searching for this for a long time. But I still have one Problem. I used the second variantion with one Template for all categories. The Blog Module of the Template hasn’t any categories marked. The desired design pops up when i test it, but on all category pages, i get all posts from WordPress but i obviously only need to show the ones within the category.

    Did i miss something, do you have an idea? Thank you very much in advance.

    • Hi Christian 🙂 !

      I’m really sorry but I don’t understand what is your problem and what you need :)…
      Can you be more clear, please :)?

      Amicably,

      Pierre.

      • Hi Pierre, Thank you for you feedback.
        I did everything according to ythis article. (Copy category.php, design Divi Layout including Blog Module and named it Kategorie.) Works fine. But creating the Blog module, i didnt’t mark any categories, as this should be filtered by category.php, right? so now, when i click on my category « travel » , i can see the right design, but the articles are not filtered by that category, so just every article of my blog is shown, but there should be only the « travel » articles. Where did i do the mistake? Thank you in advance

      • Hi Christian.

        Sorry for the delay… Yep I have noticed that problem on one of a my development website and actually do not find why and how to correct it :(…
        Sorry to announce you that for the moment I have no solution for you :(…
        Give me feedback if you find a solution by your side.

        Amicably,

        Pierre.

  58. Please ignore/delete my previous post. I figured it out! Silly mistake on my part.

    Thanks,
    Michael

  59. I’d been using this for a few category pages that default in En, which worked fine. When we started implementing the German translations, I successfully created 1 to work in DE, but cannot get the other two to work.

    All the Layout titles match their Category titles exactly with the prefix of either « Category » or « Kategorie ».

    Category Content Management Blog – (works)
    category-content-management-blog

    Kategorie Content Management Blog DE – (does not work)
    kategorie-content-management-blog-de

    ——

    Category News – (works)
    category-news

    Kategorie Neuigkeiten – (does not work)
    kategorie-neuigkeiten

    ——

    Category Digital Asset Management Case Study – (works)
    category-digital-asset-management-case-study

    Kategorie Digital Asset Management Case Studies DE – (works)
    kategorie-digital-asset-management-case-studies-de

    Anyway, I’ll probably just resort to the shortcode method, as there’s only 6, and include them manually via an if statement based on the category slug, but curious if anyone else has run into this with multi-lingual sites.

    Thanks,
    Michael

  60. Is there anyway to modify this so that the children get the same theme as the parent?

    Perhaps by manipulating the slug so that all children are preceded with the parent’s name, then we could use a wild card loop?
    category-parent
    category-parent-child1
    category-parent-child2

    Additionally, Is it possible to have my template utilize the typical category query? My goal is to not spend 4 hours in the very tedious job of duplicating the same template for each category and subcategory, and editing the template each time.

    I have great difficulties for JavaScript for some reason (though PHP is not a problem)

    PS, I have shortcode to show the Category Friendly name, which I think others will find useful. One can use the shortcode to display the Category name instead of having to type it out for each template, feel free to share!

    function get_post_title ()
    { $post_title=single_cat_title( », false);
    return $post_title; }
    add_shortcode(‘show_post_title’, ‘get_post_title’);

    • Hi Lisa 🙂 !

      I’m sorry, but I have really no time to investigate on that actually ;)…
      Anyway thanks a lot for sharing your code with us.
      I’ll try to implement it later in the file.

      Have a great day :D!

      Amicably,

      Pierre.

    • Hello,

      i found this to put in functions.php in your child theme :

      function categories_list_func( $atts ){
      $categories = get_the_category();

      if($categories) {
      foreach($categories as $category) {
      $output .=  ».$category->cat_name. »;
      }
      $second_output = trim($output);
      }
      $return_string =  » . $second_output .  »;

      return $return_string;

      } // END Categories
      add_shortcode( ‘categories-list’, ‘categories_list_func’ );

      It perfectly works for me.

      • Hi Nicolas :).

        Thanks for sharing. But I have just a small remark. As your categories list do not contain link to category, I’m not sure of the interest to list them ;). And as it’s used on each category page why do no simplify the code this way:
        function categories_list_func( $atts ) {
        $categories = get_the_category();
        return esc_html( $categories[0]->name );
        }
        add_shortcode( ‘categories-list’, ‘categories_list_func’ );
        BTW we get easily only the name of the current displayed category ;).
        Just my two cents.
        Anyway thanks a lot for sharing your code bro ;).

        Amicalement,

        Pierre.

  61. Hi, Pierre!
    Thank you so much for this. It has truly helped me!
    However, I was wondering how I can make this on other archive pages, such as the search results page especially.

    I know almost nothing about php, so I am really lost on how I could make this work.
    Especially since my search results page is not only impossible to customize, but it’s not showing only excerpts, even when I styled it to show in a grid.

    I would really appreciate if you could reference me to something that could help me out. Thank you!

    • Hi Racquel 🙂 !

      Happy you like it ;). For the search customization you have to use code or a plugin. In that case I suggest that you have a look to that cool plugin from Sean : https://elegantmarketplace.com/downloads/search-layout-injector/ It will do what you’re waiting for :).

      Have a great day 😀 !

      Amicably,

      Pierre.

  62. Bonsoir,

    Je viens d’installer le thème enfant, tout était ok, j’ai ensuite copier/coller le contenu du fichier et j’ai tout planté, je n’ai plus ni accès au BO ni au front : HTTP ERROR 500, je ne sais pas quoi faire :/

    • Bonjour Aurore :).

      Pas de panique :). Comment as-tu transférer ton fichier par FTP ? Si c’est le cas supprime-le et tout devrait rentrer dans l’ordre si c’est lui qui est incriminé.
      Je te contacte par mail pour avoir plus de détails ;).

      Amicalement,

      Pierre.

  63. I’m having a problem with the fullwidth post slider working. It is only pulling posts from one particular category no matter my selection. In this case, it is a sports blog and I am trying to make a nice category page for each sport.

    Also, it doesn’t matter where I put that module. I can do it in a standard or specialty section and the slider still doesn’t display the post from the category selects.

    Here are a couple screenshots that will hopefully help you understand the issue. Hopefully you can give me some insights.

    https://www.evernote.com/l/AODRcm8Qwy5MiIWJL57hcsevWQ64RyYAbh8

    https://www.evernote.com/l/AOAan12-JDFEGJts7_obcRI_Z3GnIYmRInE

    • Hi Brad.
      Sorry for that :(… I haven’t the time to test it now. I’ll make you a feedback when I could try.

      Have a great day 😀 !

      Amicably,

      Pierre.

  64. Hi Pierre, thank you so much for sharing this. After adjusting the slugbit worked very nice. Can i also use this for the ‘tag’ pages? If not: does the recommended plug-in from Sean?
    Best regards,

    Michael

    • Hi Michael :).

      Nope, you can’t use for the tag page ;). For that, I really advise you to use the plugin from Sean 🙂 !

      Have a great day 😀 !

      Amicably,

      Pierre.

      • These Sean plugins do not work properly and they lack many features.
        I bought these plugins, I wrote many emails with problems to them, but they did not solve any of the problems I had. Luckily they gave me back the money.

  65. Not able to use when category base is set to « . » under permalinks. Please help

    • Hi Yash :).

      Sorry about that, Yash :(…
      I didn’t know and for the moment U have no solution…

      Nevertheless, have a great day 😀 !

      Amicably,

      Pierre.

  66. This is amazing, thank you sooooo much for this!

    • You’re welcome Spanksen ;).

  67. J’ai également testé de créer un modèle qui s’appliquerait à toutes mes catégories en créant un modèle divi intitulé « Catégorie » et cela ne fonctionne pas du tout, le modèle n’est pas appliqué.

    • Re-Bonjour Guilamu :).

      Bon et bien là, sans URL, pas évident de pouvoir t’aider… As-tu bien vérifié que le « slug » (le « nom cours ») de ton modèle est bien « categorie » ? Tu peux le voir en plaçant ta souris au-dessus de ton modèle dans ta bibliothèque Divi et en cliquant sur « Modification rapide ».
      Tiens-moi au courant.

      Amicalement,

      Pierre.

    • Bonjour Guilamu 🙂 !

      Et bien tu dois procéder exactement de la même manière qu’avec une catégorie. C’est-à-dire que si ta sous-catégorie s’appelle « test » tu va devoir créer un modèle « Catégorie Test » dans ta Bibliothèque Divi ;).
      Passe une très belle journée 😀 !!

      Amicalement,

      Pierre.

  68. Bonjour,
    Merci pour votre tuto, par contre cela ne fonctionne pas pour les page catégorie produit de WooCommerce ?

    En attente de votre réponse merci bien 🙂

    • Bonjour Alexandre 🙂 !
      Je n’en ai aucune idée, je n’ai pas d’install de test avec Woo ;). Mais à toi aussi, je ne peux que te conseiller de jeter un oeil sur le plugin de Sean Barton (https://elegantmarketplace.com/downloads/woo-layout-injector/) qui je pense devrait parfaitement répondre à tes besoins ;).

      Passe une belle journée 😀 !

      Amicalement,

      Pierre.

  69. So… thanks for your work here. Just one small change I’d make to the code is to allow for other countries who speak the same language. It’s great that you accounted for en_US and en_GB, but what about en_CA, or how about fr_CA. If you added Portuguese, you’d have Portuguese in Angola and Brazil… which have 10x as many Portuguese speakers than Portugal.

    From a development perspective, it may be a better idea to only use the first two characters in the locale.

    I wrote a blog post detailing how to refine this code for any country.

    • Hi Gary 🙂 !

      Yeah, great idea!! Just read your post, it’s simple, logic and brillant 😀 !! I think that, I will follow your idea and implement it in the next release (I’m not going to do it just now, because it’s very late, here, but I’ll try to do it tomorrow).

      Thanks again for your code 😀 !

      Have a great day 😀 !!

      Amicably,

      Pierre.

      • Hi Pierre,

        Thanks so much for this template. It’s great.

        Question. Is the locale setup WPML compatible? I’m doing a site in English and German using WMPL, and not sure if I add separate Library templates, or use the WPML translation method.

        By default, the German translations in WPML are set up at domain.com/de/ while English, the main language pages for the site is just at domain.com/.

        Thanks,
        Michael

      • Hi Michael :).
        Happy you like it. Sincerely I don’t know at all if the « category.php » is WPML compatible because I haven’t tested with it ;). But why should he not :)?
        If you test it, do not hesitate to give us a feedback, I’m sure it can help someone else ;).
        Have a great day 😀 !
        Amicably,
        Pierre.

  70. Wow thanks a lot a solved my problem was about 3 weeks a was looking for a solution for change the structure of category, and the support of divi don’t give me any nice support for this … Thanks a lot Pierre
    Divi is very nice, but may obvius change need a customization

    Thanks a lot, and sorry but i can read french but i prefer don’t write on in it i’m not able to write in correct way

    thanks
    Fulvio (from italy)

    • Hi Fulvio 🙂 !

      Great 🙂 ! Happy you like it and to be able to help you 😉 !! I can read italian a little but for the same reason, I do my best to write in english ;)…

      Have a great day Fulvio 😀 !!

      Amicably,

      Pierre.

  71. Bonjour Pierre,

    Merci beaucoup pour votre article.
    J’ai suivi vos instructions à la lettre, cependant je me retrouve avec deux problèmes…
    (Je précise que je suis novice en la matière).

    J’aurais souhaité faire une mosaïque d’images cliquables (sans texte dessous) dans chaque catégories (5 sur mon site), cela apparaissant impossible avec un seul module image, je décide d’en ajouter un au dessus du module blog et je copie l’ensemble pour en avoir 2 par lignes en pleine largeur.

    > Avec ce modèle type, pour qu’un visuel remonte automatiquement dans le module image, faut-il obligatoirement ajouter une image en UNE des articles ? (car je ne peux malheureusement pas la masquer de mon bloc de contenu par la suite et cela fait doublon avec les vidéos des articles).

    > Mais le vrai problème est que les articles se dédoublent, ce qui parait logique puisqu’il y a un second ensemble modules image/blog vide à côté, mais si je n’en ajoute pas, les nouveaux articles se mettent automatiquement sous le premier (aligné à gauche) laissant un grand vide à droite de la page… (> https://feedmenow.fr/category/afternoon-delight/)

    Je suis assez confuse, j’espère être suffisamment claire, mais tout cela me semble compliqué je me demande s’il ne vaut pas mieux abandonner l’idée d’apparence en mosaïque…

    Un grand merci d’avance pour votre avis professionnel sur la situation…

    Céline.

    • Bonjour Céline :).

      Puis-je me permettre le tutoiement ? Ce sera plus simple et plus sympa ;). Bon alors je vais être clair, j’avoue ne rien comprendre à ce que tu cherches à faire :)… Du coup, j’ai du mal à savoir quelle piste te donner pour pouvoir t’aider. Si tu veux mettre plusieurs modules « blog » (c’est la seule chose que je crois avoir compris), tu peux très bien n’afficher qu’un seul article pour chacun d’entre eux et leur définir un nombre de décalage à chacun ;). Pour le premier tu laisse la valeur de « Nombre de décalage » à 0, puis tu incrémentes les suivants à chaque fois de 1.
      A mon tour j’espère avoir été asses clair pour que tu puisses me comprendre ;).

      Passe une belle soirée 😀 !!

      Amicalement,

      Pierre.

      • Bien sûr et merci pour ton retour rapide 🙂
        En effet, je ne suis pas claire du tout (et entre temps le pb image est résolu !).

        Je pense être obligée de mettre deux modules blog pour essayer d’avoir un effet « mosaïque » (je vais trouver un moyen d’enlever les extraits textes par la suite).

        J’ai bien essayé le décalage, cela fonctionne car les articles ne se mettent plus les uns sous les autres mais ils se dédoublent toujours (sûrement du au fait des deux modules blogs côtes à côtes… ?)

        Aurais-tu une idée de ce à quoi c’est du ?

        Encore merci beaucoup vraiment !

        Céline.

      • Bonjour Céline :).

        Bon concrètement, je ne comprends toujours pas ce que tu tentes de faire :)…
        Si tu souhaites afficher les articles d’une catégorie à l’aide du module « Blog » pourquoi ne tentes-tu pas de l’utiliser de manière classique avec un affichage en « grille » pour x enregistrements ?

        Amicalement,

        Pierre.

      • Bonjour Pierre,

        Ce n’est pas grave du tout, j’ai trouvé un compromis 🙂
        Et quand j’aurai plus d’articles, j’utiliserai l’affichage en grille !

        Merci tout de même car je viens de loin avec ces catégories !!! 🙂

        Amicalement,

        Céline.

  72. Hello Pierre,
    Thanks a lot for this trick. It’s working fine for me except for one thing. Could you please help me?

    When I try to go to a category with just 2 posts it shows no results. It works with all the rest with more than 5 posts..

    I set in Divi options to show 8 results in Categories, and set the same in the template.
    What am I doing wrong? Any ideas?

    Here you can see my blog with the categories list https://buscopilates.com/i-love-pilates/

    Thank you very much

    • Hi Belen 🙂 !

      Sadly, if you want to make it works, you have to the set the number of posts equal to or greater than the value entered in the « Number of Posts displayed on Category page » section of the Divi options…
      Otherwise you’ll have pagination problems ;)…

      Have a great day 🙂 !

      Amicably,

      Pierre.

      • Thank you Pierre,
        I’ve realised someting happens with categories. The list says there are 14 posts for example, but it only shows 11. Or says 5 and shows 1… Weird.

        And for some categories page it doesn’t show pagination…

        I don’t know whats wrong.
        Thank you anyway.

      • Hi Belen :).

        It can’t be the category.php that doing that :)… All you’re talking about is in your back-office, that’s it?

        I’ve sent you a mail ;).

        Amicably,

        Pierre.

  73. Haaa mais c’est exactement ce que je cherchais ! Merci beaucoup ! Ma vie serait encore plus merveilleuse si on pouvait aussi appliquer le modèle aux résultats de la page de recherche…tu n’aurais pas une petite idée de comment étendre la mise en page jusque là par hasard ? 😉

    Merci beaucoup en tout cas !

    • Bonjour Emilie 🙂 !

      Je t’en prie :). Content que tu trouves mon fichier utile ;). Pour ta page de recherche, il va falloir que tu te tournes vers un plugin.
      Je te suggère, à toi aussi, de faire un saut sur le site d’ElegantMarketPlace sur la page de Sean Barton, ici : https://elegantmarketplace.com/downloads/search-layout-injector/ pour éventuellement acheter son plugin « Search Layout Injector ». Il t’en coûtera 15 $ ;).

      Passe une belle soirée 😀 !!

      Amicalement,

      Pierre.

  74. Hi Pierre! Thanks for your great tutorial and file category.php. It works great!
    Do you know if it is good also for SEO ?
    I mean: category pages built in this way will be easily founded by Google?
    Thanks 😉

    • Hi Pascal :).

      Don’t worry, there’s no reason that the category page will be less or less well indexed than your normals Divi page ;).
      Have a great day 😀 !!

      Amicably,

      Pierre.

  75. Hi
    How would i go about doing this for my search results page?

    • Hi Samuel :).
      If you want to customize your search page, I suggest that you have a look to the « Search Layout Injector » (https://elegantmarketplace.com/downloads/search-layout-injector/), here too, from Sean Barton.
      It will cost you 15$ but I’m sure it will do the job for you, even if I haven’t yet bought it myself ;).

      Have a great day 😀 !

      Amicably,

      Pierre.

  76. Bonjour !
    Merci du post! Par contre j’aimerai savoir si vous avez une solution pour ceux qui utilisent WooCommerce ? J’ai envie d’utiliser des catégories très personnalisées de produits sans utiliser la mise en forme standard de WC … Une idée? Merci !

    • Bonjour SaliX :).

      Je t’en prie :).
      Pour le plugin, oui, je pense que Woo Layout Injector de Sean Barton que tu pourras trouver ici :
      https://elegantmarketplace.com/downloads/woo-layout-injector/
      remplira exactement les fonctions que tu recherches ;). Il est à 22 $ avec une licence « à vie » et illimitée ;).
      J’ai toujours été ravi des achats des plugins que Sean a développé (mais je n’ai pas encore acheté celui-ci).

      Passe une belle journée et un excellent week-end.

      Amicalement,

      Pierre.

  77. I have tried for 4 hours to get this working. I think I must be missing out an important step.

    I have moved the category.php into my child theme folder. I do not edit this file.

    I then go to divi library and create a template for my uncategorized category. I save this template with the file name ‘category uncategorized’ I build a template using the blog module and select the uncategorized category from the module.

    I save this layout. Then I go to my blog and click uncategorized and nothing. Just the same as before. I would really appreciate any help you can give me to get this working.

    Surya.

    • Hi Surya.

      Could you verify in your Divi Library that the slug of your file is: « category-uncategorized »?
      To do that, go in your Divi Library and click on the « Quick Edit » link and verify the slug.
      The « common » error is to rename the layout. BTW the title seems to be the good one but the slug is keeping its old name.
      For being sure too, could you confirm, after you’ve verified the slug of your layout, that the « uncategorized » category exists ;)?
      Last but not least, don’t you have an other category that would permit to do the test?

      Waiting for your feedback ;).

      Amicably,

      Pierre.

      • Pierre, bonjour, merci pour votre rapid reponse a mon commenatire.

        Back to English.

        The slug names seem to be correct. I have tried with other categories, e.g. simple things which I tried to get it working.

        I have 1 post in uncategorized and one in simple things. I tried making a layout for category-simple-things when uncategorized didn’t work.

        Do you mean to say uncategorized has to exist in the Divi library or in the blog categories? It exists in both.

        Yours very gratefully, Surya.

      • I just had a look to your website and try to show the « simple-things » but it shows me a 404 error ;)…
        I just sent you an email ;).

        Amicably,

        Pierre

      • finally it is worked until i see this comment.
        the slug didn’t change on the Divi Library once i renamed the template name.

        thank you so much, Pierre. 😀

      • Hi betty 🙂 !

        Happy you’ve found the solution by yourself and make it work :)!

        Have a great day 😀 !

        Amicably,

        Pierre

  78. Excellent !

    Merci beaucoup de ce tips tip top
    Ça faisait un moment que je cherchais

    • Je t’en prie Eric 🙂 !

      Heureux d’avoir pu répondre à ton attente 😉 !

  79. Hi Pierre,

    Thanks for your trick, it worked great for me!

    However, what if I don’t use the blog module in my layout? I’m asking because I want to use your trick to create a layout for my project portfolio archive page as well.

    The trick seems to work with a layout that contains no blog module but a portfolio module instead… However I’m not sure if I’ll run into problems at a later stage?

    Thanks again!

    • Hi Reinout :).

      Happy you like it. You can do a test and give me feedback ;). There no risk to do that. But I confess I have not tried your solution ;).

      Have a great day !

    • would you be willing to help me out a bit with getting it to work for projects

      • Hi nowe :).

        I’m sorry, nowe, but as I said to you before, for project customization, I suggest that you have a look to the « Taxonomy Layout Injector » from Sean Barton :).
        I’m sure it will do the job for you : https://elegantmarketplace.com/downloads/taxonomy-layout-injector/ it costs 17 $ ;).

        Amicably,

        Pierre.

  80. Hi Martin 🙂 !
    Great, you make it to work without any help from me (you’ve been too speed and/or wake-up too soon for me 😉 )
    Thanks for sharing the video it may help some other users ;).

    Have a great day 🙂 !!

    • Would it be possible that you could help me out with this
      I can not seem to figure this out

      • Hi NoWe.

        I would like to be able to help you, but without any information/link… I can’t ;).
        Waiting for your feedback :).

        Amicably,

        Pierre.

      • sorry
        I am trying to do the same for the project archive.
        The site is bilingual Norwegian and UK
        question is how do is set this up

        ps working local until all works fine

  81. Hello Pierre, thanks for this excellent post. This worked for me (mostly)!
    My blog is running WPML. For the German defaults it is 100% working, but on the English version I still get the « old » category/archive pages.
    My categories are accessed like this:
    Development in German: « development »
    Development in English: « development-en »

    Do you have any idea how to get it working?

    I’m quite sure to know the issue: I can’t set the category « Development » in the English layout-builder in divi-lib. There is only shown « Entwicklung » (the German word for development)..
    Even echoing the ID of the « cat » and use it in the translation of the builded layout didn’t work.

    $catID = get_query_var( ‘cat’ );
    echo $catID . «  »;
    echo $cat_slug;

    • Got it working 🙂 Had to name it « Category Android En » AND(!) this must be done under the English WPML-setup. Video https://youtu.be/pEnK1ogAUGA

      Thank you so much!

      • thank you for the information!
        my website is working too. 🙂

Trackbacks/Pingbacks

  1. Creating Custom Category Layouts using the Divi theme – Armstrongest - […] it turns out someone has done the hard work and published this tutorial on how to easily customize a category…