Posted on 11 mai 2010 in Wordpress | 11 comments

Créer une page Home permet de personaliser une page d'accueil et distinguer la page blog des articles

Faire de votre blog WordPress un Site Web + Blog. Insérer une page d’accueil pour votre blog (home.php), renvoyer votre blog dans une page distincte:  C’est possible et facile.

1° Option rapide je-ne-veux-pas-chipoter-avec du-code

Le procédé le plus simple mais aussi le plus limité est d’utiliser la fonction des Réglages de votre tableau de bord à l’onglet Lecture.

Allez dans Réglages et choisissez "Lecture".

Allez dans Réglages et choisissez "Lecture".

Selon votre choix, vous aurez peut être besoin de créer au préalable une ou deux pages WordPress pour définir celle qui sera votre page d’accueil (joue la fonction home.php) et celle des articles (qui joue la fonction index.php). Comme la pratique vaut mieux qu’un long discours, je vous suggère de simplement tester la chose. Votre blog ne risque rien et c’est réversible. Il vous suffit de cocher la case ‘sur une page statique’ puis de choisir parmi vos pages existantes celles qui remplissent les rôles décrits ci-dessus. Une fois testé ou si cela ne vous convient pas, revenez à la situation initiale en cochant la première case ‘Les derniers articles’.

Cette méthode est décrite ici dans le Codex.

2° Option création d’une page home.php et blog.php

On va d’abord séparer le blog vers une page WordPress.

Dans le dossier de votre thème WordPress, vous devez créer deux fichiers templates avec un éditeur de texte (genre Notepad). Un home.php et un blog.php. N’oubliez pas la règle : Enregistrez tous vos nouveaux fichiers ou ceux d’une autre langue au format UTF8.

a) Créez un Template intitulé blog.php (par exemple)

Collez dedans juste ceci :

1
2
3
4
5
6
7
8
9
<?php
/*
Template Name: blog
*/
// Choix du Template qui va être chargé pour cette page
$paged = get_query_var('paged');
query_posts('cat=-0&paged='.$paged);
load_template(TEMPLATEPATH . '/index.php'); //charge index
?>
<?php
/*
Template Name: blog
*/
// Choix du Template qui va être chargé pour cette page
$paged = get_query_var('paged');
query_posts('cat=-0&paged='.$paged);
load_template(TEMPLATEPATH . '/index.php'); //charge index
?>

Maintenant allez dans votre tableau de bord à l’onglet Pages et

b) Publiez une page WordPress vide.

Titrez cette page comme vous voulez ça n’a aucune incidence. L’essentiel est: regardez à droite de votre page en cours d’édition, vous verrez des options dans une boîte nommée Attributs (parents, modèles).

Trouvez le menu déroulant intitulé Modèle et Choisissez le modèle blog

(le nom que nous avons donné au Template ci-dessus, mais qui peut évidement être différent). Attention, pour voir ce modèle apparaître, il faut évidement que vous ayez déjà créé ce Template blog.php…

Enregistrez cette page et publiez-la. Votre page blog apparaît dans votre menu de pages, il reproduit le fichier de votre thème intitulé index.php.

Notez que cette méthode est la méthode générale pour créer une Page Template.

Maintenant il vous faut une page d’accueil.

c) Créez un Template intitulé home.php

Là c’est à vous de jouer. Puisque vous désirez une page d’accueil différente, collez-y selon vos besoins. Néanmoins, elle doit contenir le minimum:

1
2
3
4
5
6
<?php get_header(); ?>
 
CONTENU CHOISI, BOUCLES WP ou TOUT MESSAGE PERSONNEL OU LES DEUX
 
<?php get_sidebar(); ?>
<?php get_footer(); ?>
<?php get_header(); ?>

CONTENU CHOISI, BOUCLES WP ou TOUT MESSAGE PERSONNEL OU LES DEUX

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Vous pouvez par exemple copier-coller votre index.php dont vous modifiez le contenu. Ce qui vous permettra de conserver la feuille de style en conservant les class et id.

Sinon, si vous désirez créer une apparence totalement différente pour la page Home, il va de soi que vous devrez dans ce cas créer une feuille de style spécifique : home.css et l’appeler dans le header de la page home. Auquel cas, le plus simple est de copier-coller directement le header de votre fichier header.php en remplaçant cette ligne:

1
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen"/>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen"/>

par:

1
<link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/home.css" type="text/css" media="screen" title="feuille de style de la page home"/>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/home.css" type="text/css" media="screen" title="feuille de style de la page home"/>

Pour coder des boucles selon vos désirs, utilisez par exemple la fonction query_post ou regardez dans le codex les diverses boucles de base.

La hiérarchie de WordPress pousse le fichier home avant index. Donc il n’y a rien d’autre à faire, la page accueil de votre site ou blog sera cette page home.

Pour adapter le menu à cette nouvelle configuration, voir article Menus dynamiques WordPress à la carte, menu site web + blog, pages, sous-pages et catégories

Ressources coder boucles :

Bon travail!