4) Créer un theme worpress - fichiers de base

On place un thème (que l’on crée ou télécharge) dans le dossier wp-content/themes. Un thème doit au moins contenir 2 fichiers : une page index.php et une page style.css. Pour préparer un travail plus fin, on optera cependant pour quelque chose de plus complet.

Précédent | 4/20 | Suivant

Dans wp-content/themes, on crée un dossier. Le nom de ce dossier ne contiendra ni caractères spéciaux ni espace, comme un document web standard.

La page style.css

Dans ce dossier on crée ensuite un fichier "style.css", qui va contenir les styles, bien sûr, mais aussi le descriptif du thème, comme ceci :

/*
Theme Name: -ici le nom du theme-
Theme URI: -url du createur-
Description: -une petite description-
Version: 0.1
Author: -votre nom-

Creation Theme by -votre nom- || -adresse web-
*/

Ce code sera repris dans la liste des thèmes wordpress, il est donc important de ne pas y mettre n’importe quoi.

On va ensuite créer une série de pages, que l’on déposera au même endroit :

La page index.php

C’est la page centrale du thème, on lui met ce code :

<?php get_header(); ?> <!-- importation du header -->

<!-- ici on placera la loop wordpress -->

<!-- ici on place la sidebar -->
<?php get_sidebar(); ?>

<!-- ici on place le footer -->
<?php get_footer(); ?>

Le code "get_header" sera remplacé par le contenu du fichier "header.php". Pourquoi le séparer ? Parce qu’on pourra l’inclure dans d’autres fichiers, ce qui permettra de gagner du temps.

Inclure des fichiers "non-standard"

On peut inclure n’importe que fichier php supplémentaire par cette méthode :

<?php include(TEMPLATEPATH . '/mapage.php'); ?>

où "mapage.php" est le nom du fichier à inclure se trouvant dans le dossier de votre thème...

Le fichier header.php

Ce fichier contient le début des pages web pour tout le site. Le doctype, le head, et le tag body :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">

 <title><?php bloginfo('name') ?><?php if ( is_404() ) : ?> &raquo; <?php _e('Not Found') ?><?php elseif ( is_home() ) : ?> &raquo; <?php bloginfo('description') ?><?php else : ?><?php wp_title() ?><?php endif ?></title>

 <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
 <meta name="generator" content="WordPress <?php bloginfo('version'); ?>" />
 <!-- leave this for stats -->
 <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
 <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
 <link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
 <link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />
 <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /><?php wp_head(); ?>
 
 <?php wp_get_archives('type=monthly&format=link'); ?>
 <?php //comments_popup_script(); // off by default ?>
 <?php wp_head(); ?>
 
</head>
<body <?php body_class(); ?>>
<div id="wrapper">
<header>
<h1 id="header"><a href="<?php bloginfo('url'); ?>/"><?php bloginfo('name'); ?></a></h1>
</header>
<div id="content">
<!-- end header -->

Le fichier footer.php

le fichier footer, aussi inclus, contient ce code :

<footer>
<p>
Copyright © <?php print(date(Y)); ?> <?php bloginfo('name'); ?>
<br />
Blog propulsé par <a href="http://wordpress.org/">WordPress</a>
<br />
<a href="feed:<?php bloginfo('rss2_url'); ?>">Articles (RSS)</a> et <a href="feed:<?php bloginfo('comments_rss2_url'); ?>">Commentaires (RSS)</a>.
<?php echo get_num_queries(); ?> requêtes. <?php timer_stop(1); ?> secondes.
</p>
<?php wp_footer(); ?>
</footer>
</div>
</body>
</html>