Salut à tous,

Nous voici pour une nouvelle étape de la création de notre thème wordpress.

Nous allons commencer à définir le Header.php – Index.php et fichier style.css.

1 – Création du fichier header.php :

Ouvrez votre éditeur PHP ( PSPad par exemple qui est gratuit) et créez un nouveau fichier PHP ( template ) que on appelera header.php.

Pour info, tous les fichiers de notre thème seront enregistré dans le répertoire suivant: http://www.nomdublog.com/wp-content/themes/nomdutheme/.

Dans ce template, nous allons réaliser 3 choses :

  • Définir le Doctype
  • Créer la balise head
  • Créer la balise body

Commençons par définir le DOCTYPE qui sera qtilisé sur notre site. Le DOCTYPE informera le navigateur (Internet Explorer, Mozilla ou autre) du code à utiliser :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>" <?php language_attributes(); ?>>

Créons la balise head dans laquelle nous allons rappeler le code à utiliser, et récupérer les informations du blog :


<head profile="<a href="http://gmpg.org/xfn/11">http://gmpg.org/xfn/11</a>">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php wp_title('&laquo;', true, 'right'); ?> <?php bloginfo('name'); ?></title>
<style type="text/css" media="screen">
@import url( <?php bloginfo('stylesheet_url'); ?> );
</style>
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_get_archives('type=monthly&format=link'); ?>
<?php //comments_popup_script(); // off by default ?>
<?php wp_head(); ?>
</head>

Enfin, ouvrons et la balise body que nous renseignerons plus tard :

Ajouter juste sous la balise head le code suivant :


<body>

2 – Création du fichier index.php :

Créez un nouveau fichier que vous nommer index.php.

Nous allons simplement rappeler le header et fermer les balises html et body qui ont été ouvertes dans le header :


<?php get_header(); ?>
</body>
</html>

Il est très important de systèmatique fermer les balises qui vont être ouvertes sans cela votre programmation deviendra rapidement un enfer.

3 – Création du fichier style.css :

Créez un nouveau fichier que vous nommer style.css.


/*

Theme Name : Personal theme

Theme URI : <a href="http://www.mistipi.com">http://www.mistipi.com</a>

Description : The First Personal Theme

Version : 1.0

Author : Jeft

Creation Theme by Jeft | <a href="http://www.mistipi.com">http://www.mistipi.com</a>

*/

Maintenant si vous allez sur dans l’administration de votre blog dans l’onglet « Apparence » puis « thème ». Dans les thèmes disponible doit apparaître un thème qui se nomme : Theme name – Version – Author soit Personal theme 1.0 par Jeft.

Il n’y a pour l’instant aucune image associée car nous le n’avons pas encore créée. Nous ferons cela à la fin.

Voila c’est tout pour aujourd’hui. Lors du prochain post nous commencerons à faire apparaître des données sur notre blog.

Voir aussi :

Articles Créer son thème WordPress : 123456 7891011

En attendant bon blog.

@ plus

Articles similaires :