Share
WordPress vous propose quelques options intégrées pour la page d'accueil de votre site Web: un affichage de vos articles de blog les plus récents ou une page statique de votre choix. Mais si vous voulez créer quelque chose d'un peu plus intéressant que ça?
Si votre site contient de nombreuses données utilisant des catégories, des taxonomies ou des types de publication personnalisés pour l'organiser, vous souhaiterez peut-être afficher des données de plusieurs types sur votre page d'accueil. La bonne nouvelle est que vous pouvez le faire en utilisant un modèle personnalisé pour la page d'accueil. Dans ce modèle, vous écrivez un certain nombre de requêtes personnalisées pour répertorier les données comme vous le souhaitez. Dans ce tutoriel, vous apprendrez comment:
Les requêtes répertorieront les publications standard plus un type de publication personnalisé enregistré pour ce projet, appelé "animal". Vous pouvez trouver le fichier de modèle avec les quatre requêtes dans la liasse de codes.
Avant de commencer à configurer le modèle de page d’accueil, prenez un peu de temps pour identifier le contenu de la page d’accueil:
La page d'accueil contient:
Les éléments de cette mise en page avec lesquels vous allez travailler sont le contenu de la page d’accueil et les trois listes..
Avant de commencer, vous devez disposer de quelques éléments pour que vos requêtes fonctionnent:
Accentsconagua
register_post_type dans le codex WordPress. Alternativement, le functions.php le fichier dans le paquet de code inclut le code qui le faitLa première étape consiste à créer un fichier modèle pour contenir votre code. Créez un fichier vide dans votre dossier de thèmes et nommez-le. front-page.php. Ajoutez le code suivant au fichier:
// le contenu de la page d'accueil va ici
Enregistrez votre fichier. Comme vous pouvez le constater, cela inclut les fichiers de modèle d'en-tête et de pied de page sur votre page d'accueil. Aucune barre latérale n'est incluse car cela ne fait pas partie de la conception de la page d'accueil. Lorsque vous visitez la page d'accueil de votre site, une page vierge contenant uniquement l'en-tête et le pied de page s'affiche:
En plus d'afficher les résultats des requêtes personnalisées, votre page d'accueil affichera le contenu de la page statique 'Home'. Pour ajouter ceci à votre fichier de modèle, insérez le code suivant pour remplacer le '// le contenu de la page d'accueil va ici' ligne:
> ?>
C'est la boucle standard. WordPress l'utilisera pour afficher le contenu de la page statique que vous avez enregistrée en tant que page d'accueil. Votre page d'accueil contiendra maintenant le contenu statique:
WP_Query Pour les requêtes personnalisées, vous utiliserez le WP_Query classe. Cela vous permet de configurer des requêtes personnalisées et d'exécuter une boucle basée sur chacune d'elles pour afficher les publications..
En utilisant WP_Query est bien meilleure pratique que d'utiliser le query_posts fonctionner comme ce dernier réinitialise complètement la requête principale et peut causer des problèmes de performances. WP_Query prend un ensemble de paramètres qui définissent la requête que vous voulez exécuter. Quelques exemples de paramètres que vous pouvez spécifier incluent (sans toutefois s'y limiter):
Type de poste - posts, pages, pièces jointes ou un type de post personnaliséposts_per_page - le nombre de messages à afficherordre - ASC ou DESC commandé par - vous pouvez commander par date, nom, auteur, menu_order ou de nombreux autres paramètresPour plus de détails sur les paramètres que vous pouvez utiliser avec WP_Query, voir WP_Query dans le codex WordPress. Utiliser WP_Query, vous insérez le code suivant:
have_posts ()): $ query-> the_post (); // publie le contenu à afficher ici endwhile; ?>
Sur votre page d'accueil, vous souhaitez répertorier les huit derniers articles de la catégorie "Mises à jour". Pour ce faire, ajoutez le code suivant entre la requête principale et l'appel au pied de page:
/ category / updates / "> Mises à jour
'post', 'category_name' => 'Mises à jour', 'posts_per_page' => 8)); while ($ query-> have_posts ()): $ query-> the_post (); ?>
- "> -
Cela crée un élément pour contenir votre liste et ouvre la liste avec un lien vers la catégorie archive dans un étiquette. Il définit ensuite les arguments pour WP_Query et exécute la boucle en fonction de cette requête. Les classes supplémentaires peuvent être utilisées pour styliser chaque liste individuelle.
La deuxième requête personnalisée est presque identique à la première, il ne s'agit que de requêtes de publications d'une autre catégorie. Ajouter ce qui suit après la première requête et immédiatement avant la seconde fermeture étiquette:
/ catégorie / en profondeur / "> en profondeur
'post', 'category_name' => 'En profondeur', 'posts_per_page' => 8)); while ($ query-> have_posts ()): $ query-> the_post (); ?>
- "> -
Cela ajoute une deuxième liste de publication pour les publications de la catégorie "En détail"..
La troisième et dernière requête n'interroge pas les publications standard, mais le type de publication personnalisé 'animal' que vous avez enregistré avant de créer votre fichier de modèle. Après la deuxième requête personnalisée, ajoutez ce qui suit:
"> Nos animaux préférés
'animal', 'posts_per_page' => 8)); while ($ query-> have_posts ()): $ query-> the_post (); ?>
- ">
Vous avez maintenant toutes les requêtes en place et affichées sur la page d'accueil:
La dernière étape consiste à ajouter un peu de style. Pour le moment, les annonces sont l'une en dessous de l'autre, avec très peu d'espacement ou de décoration.
Dans cette étape, vous allez ajouter un style simple pour améliorer ceci. Dans la feuille de style de votre thème, ajoutez ce qui suit:
.clear float: none; clarifier les deux; .home section.archive width: 31%; marge: 10px 1%; border-top: 1px solid # 222; float: gauche; .home section.archive ul li line-height: 1.4em;
Cela garantira que les listes sont effacées sous le contenu principal et les placera côte à côte. Il ajoute également un espacement entre les éléments de chaque liste:
Vous avez maintenant une page d’accueil personnalisée qui comprend le contenu de la page statique ainsi que trois requêtes personnalisées répertoriant différents types de contenu. Vous pouvez adapter cette approche à différentes exigences. Par exemple:
WP_Query the_thumbnail () afficher des miniatures de messages (ou des images en vedette)Quelques ressources utiles:
WP_Query classe: http://codex.wordpress.org/Class_Reference/WP_Query 