WordPress CMS : les pages

Publié par Gui dans Tutoriels, Wordpress

Dans une approche CMS, la partie la plus importante est donc la gestion des pages.

De la classique page de contact et de présentation jusqu’à la page de portfolio et de blog, nous allons voir comment gérer nos différents types de contenus et comment les mettre en page.

La gestion des pages est présente depuis bien longtemps dans WordPress. Cependant, Si l’on ne veut pas réaliser uniquement de simples pages à partir de l’éditeur de texte, il faut recourir à l’utilisation de templates.

Les templates

Les templates sont des fichiers PHP dans votre thème permettant de modifier l’affichage d’une page. Pour déclarer un template, il suffit de créer un fichier PHP (basé sur le template de base de page.php par exemple) et d’insérer en haut le commentaire suivant :

<?php
/*
Template Name: Blog
*/
?>

Ceci indique à WordPress que la page est un template et qu’il peut donc être utilisé pour les pages.

Le template Blog

Voyons comment réaliser un template de page qui afficher les derniers articles.

Pour cela, le plus simple et propre de récupérer les articles du blog est de créer un nouvel objet WP_Query auquel nous allons passer nos arguments :

  1. paged : permet de gérer la pagination
  2. post_type : définit le type de contenu que l’on veut afficher (post pour articles)
  3. posts_per_page : le nombre d’articles à afficher

La liste complète des options est disponible ici sur le codex WordPress.

<?php

get_header();

if(is_front_page())
	$_paged = "page";
else
	$_paged = "paged";

$paged = (get_query_var($_paged)) ? get_query_var($_paged) : 1;
$args = array(
	'paged' 			=> $paged,
	'post_type' 		=> 'post',
	'posts_per_page'	=> 12
);

$my_query = new WP_Query($args);

if ($my_query->have_posts()) : ?>

<div class="posts">
<?php while ($my_query->have_posts()) : $my_query->the_post();

	get_template_part("entry");

endwhile; ?>
</div>

<?php echo paginate_links();

get_footer();

Les shortcodes

Les templates de page, c’est bien, mais on peut aussi dynamiser la création de pages en permettant de constuire du contenu « à la volée » via l’utilisation de shortcodes.

Les shortcodes sont des fonctions très utiles pour la gestion des pages car elles permettent de mettre en page du contenu (qui peut être dynamique) de manière simple.

Colonnage

Vous pouvez créer des shortcodes pour afficher votre contenu sous forme de colonnes.

add_shortcode('display_one_third', 'display_one_third');
add_shortcode('display_two_third', 'display_two_third');

Voici un exemple de shortcode que vous pouvez insérer dans votre éditeur :

[display_one_third]Lorem ipsum ...[/display_one_third]
[display_two_third]Lorem ipsum ...[/display_two_third]

Voici le code des fonctions associées :

function display_one_third($atts, $content = null)
{
	$output = "<div class='one-third'>$content</div>";

	return do_shortcode($output);
}

function display_two_third($atts, $content = null)
{
	$output = "<div class='two-third'>$content</div>";

	return do_shortcode($output);
}

Et voici les déclarations CSS associées :

.one-third{ width:30.66%; float:left; margin-right:4% }
.two-third{ width:65.34%; float:left }

Voici une liste de suggestions de shortcodes qui vous permettront de gérer vos mises en pages plus facilement :

  1. http://www.catswhocode.com/blog/10-super-useful-wordpress-shortcodes
  2. http://smashingwall.com/wordpress/shortcodes-resources/
  3. http://wp.tutsplus.com/articles/general/resource-roundup-20-creative-shortcodes-to-use-in-your-projects/

Grâce à l’utilisation de shortcodes, nous pouvons arriver à concevoir des pages complexes et dynamiques, telles que la page d’accueil de ce site :

Les metaboxes

Afin d’aller encore plus loin dans la personnalisation des pages (et des différents types de contenu en général), nous pouvons utiliser les meta-boxes.

Ce mécanisme permet d’ajouter pour un contenu spécifique des informations utiles, par exemple pour modifier l’affichage du contenu.

Retrouvez tout ce qu’il faut savoir sur cette page : WordPress : Les Meta Boxes

Page d’accueil

La différence fondamentale entre un blog et un site « normal » est que leur page d’accueil est différente. Afin d’avoir une page d’accueil particulière dans WordPress, il suffit de modifier cet options dans Réglages → Lecture.

Conclusion

En utilisant convenablement les templates, les shortcodes et les metaboxes, vous serez à même de réaliser de nombreuses mises en pages différentes et complexes pour gérer votre contenu.

4 commentaires

  1. macko

    Bonsoir,

    Merci pour le tuto alors jai un problème et je pense que graçe a votre tuto je suis pas loin de le résoudre.

    j’ai un template blog mais impossible d’afficher la pagination 2 jours que je cherche ms je ne trouve pas le théme ne prévoit pas de pagination c’est juste fou

    voila le code en question :

    $paged,
    ‘post_type’ => ‘post’,
    ‘posts_per_page’ => 6
    );
    if($theme != null)
    $args[‘category_name’] = $theme;
    ?>

    have_posts()) : while ( $the_query->have_posts() ) : $the_query->the_post();

    if($i == 0)
    {
    ?>

  2. nexvan

    Merci pour le tutoriel, donc j’ai un problème

Laisser une réponse


Post shadow