Dans ce tuto WordPress en vidéo, nous allons découvrir ensemble comment créer un Portfolio pour présenter vos projets facilement avec un système de filtres par catégories.
Il est important d'avoir suivi les 2 premiers épisodes avant de visionner celui-ci :
- Episode 1 : Créer la base du thème en moins d'une heure
- Episode 2 : Améliorer le thème en ajoutant des fonctionnalités
Ce que nous allons voir dans ce tuto Portfolio avec WordPress & Bootstrap :
- Mise en place d'un custom post type pour créer des projets dans l'administration
- Ajouter des images dans la partie médias pour pouvoir créer des nouveaux projets + utiliser le loop WordPress avec WP_QUERY pour les récupérer sur la page du Portfolio
- Afficher les projets sous forme de "card" grâce à Bootstrap avec un système de grille à 3 colonnes
- Créer une taxonomie pour pouvoir trier les projets et afficher la catégorie de chaque projet dans leur card respective
- Récupérer les catégories pour ajouter des filtres au-dessus des projets
- Créer un template pour les pages de taxonomie afin d'afficher seulement les projets qui sont dans la catégorie sélectionnée
- Créer un template de single dédié aux projets du portfolio avec une pagination pour passer d'un projet à l'autre facilement
- Rectifier le menu actif sur la page de recherche et sur le portfolio
Les fichiers sources sont inclus avec le tuto.
N'hésitez pas à me soumettre des questions dans le salon d'entraide si vous rencontrez des difficultés pendant ou après le visionnage de la vidéo.
Bon tuto !
Table des matières de cette formation WordPress, Bootstrap (durée : 1h23m)
-
- Mise en place d'un custom post type pour créer des projets dans l'administration 00:08:37
- Ajouter des projets et créer une boucle personnalisée 00:13:23
- Afficher les projets sous forme de card grâce à Bootstrap 00:14:23
- Créer une taxonomie pour pouvoir trier les projets 00:08:56
- Récupérer les catégories pour ajouter des filtres au-dessus des projets 00:11:18
- Créer un template pour les pages de taxonomie 00:06:23
- Créer un template de single dédié aux projets du portfolio 00:10:48
- Rectifier le menu active sur la page de recherche et sur le portfolio 00:09:38
- Fichiers sourcestélécharger
- Certificat
Formateur : Adrien Gazaix
-
Encore un très bon tuto. Pas eu trop de problème.
-
Vraiment super ce tuto qui mêle wordpress et bootstrap ! Merci beaucoup :-)
-
Merci beaucoup, c'est assez clair et concret ! Je poursuis sur l'épisode 4 !
-
Avec quelles versions de logiciels ce tuto est-il compatible ?WordPress 5, Bootstrap 5
-
Que contient le fichier source ?Le thème Wordpress obtenu à la fin du tuto, ainsi que les images pour illustrer les projets du portfolio.
-
Quel est le niveau requis pour suivre ce tuto ?débutant
note moyenne
avis laissés