2013 WordPress Algérie Quelques Définitions Structure d’un thème WordPress Les fonctions WordPress Les menus Les miniatures & illustrations Les Widgets La boucle WordPress (the Loop) Les recherches Les modèles de pages
style.css /* Theme Name: Semaine Du Web Description: Atelier Création de thème WordPress Author: Ghilas BELHADJ Author URI: http://junksource.com Version: 1.0 … */ /* Ici sera placé votre CSS */ Toujours dans themes/SDW/
partie fixe du header header.php <!DOCTYPE html> <!-- Consider specifying the language of your content by adding the `lang` attribute to <html> --> <!--[if lt IE 7]> <html class="no-js ie6"> <![endif]--> … <li><a href="contact.html">Contact</a></li> </ul> </nav> <!-- #main-navigation --> <head> + Logo + Menu de Navigation Remplacer dans index.php par <?php get_header(); ?>
partie fixe du footer footer.php <footer id="footer" role="contentinfo"> <!-- You're free to remove the credit link to Jayj.dk in the footer, but please, please leave it there :) --> … <!-- Load custom scripts --> <script src=“<?php bloginfo(‘template_url’); ?>js/script.js"></script> </body> </html> Informations sur le copyright + code JS Remplacer dans index.php par <?php get_footer(); ?>
partie de la sidebar sidebar.php <div id="sidebar" role="complementary" class="span4"> <!-- Non-working search form --> <form role="search" action="#" class="searchform"> … Lorem Ipsum decided to leave for the far World of Grammar.</p> </aside> <!-- .widget --> </div> <!-- #sidebar --> Toute la <DIV> de la sidebar Remplacer dans index.php par <?php get_sidebar(); ?>
); get_sidebar( $name ); get_footer( $name ); Plus D’infos: http://codex.wordpress.org/Function_Reference/get_header http://codex.wordpress.org/Function_Reference/get_sidebar http://codex.wordpress.org/Function_Reference/get_footer $name: permet d’inclure respectivement les fichiers header-$name.php, sidebar-$name.php et footer-$name.php EX: get_sidebar(‘gauche’); permet d’inclure le fichier sidebar-gauche.php Plus!
<hgroup> <h1 id="site-title"><a href="index.html" title="Your Site Name">Jayj HTML5 Theme</a></h1> <h2 id="site-description">This is an awesome description of the site!</h2> </hgroup> index.html <?php bloginfo(‘url’); ?> Your Site Name <?php bloginfo(‘name’); ?> Jayj HTML5 Theme <?php bloginfo(‘name’); ?> This is an awesome description of the site <?php bloginfo(‘description’); ?>
nos Menus Dans functions.php <?php register_nav_menu( $location, $description ); ?> $location identifiant du menu $description description du menu Exemple: register_nav_menu(‘principal’, ‘Menu Principal’); Plus d’info http://codex.wordpress.org/Function_Reference/register_nav_menu Plusieurs menus à la fois http://codex.wordpress.org/Function_Reference/register_nav_menus
par défaut <?php if ( have_posts() ): while( have_posts() ): the_post(); ?> <!-- Chaque code PHP ou HTML placé ici, sera répété pour chaque post --> <?php endwhile; endif; ?>
par défaut Avec une Template Tag: Afficher le titre de l’article <?php if ( have_posts() ): while( have_posts() ): the_post(); ?> <h2><?php the_title(); ?><h2> <?php endwhile; endif; ?>
Tags À utiliser dans la boucle WordPress the_title() affiche le titre du post en cours the_permalink() affiche l’url vers l’article en cours the_excerpt() affiche l’extrait de l’article en cours sinon 55 mots du contenu the_content() affiche le contenu complet du post en cours the_category() affiche la/les catégorie(s) de l’article en cours the_tags() affiche les tags de l’article en cours the_time() affiche la date et/ou l’heure de publication du post the_author() affiche le nom de l’auteur du post (comme configuré) the_post_thumbnail() affiche la miniature du post en cours … Plus d’info: http://codex.wordpress.org/Template_Tags
personnalisée $query_string: variable global qui détermine ce que la boucle vas afficher query_posts(): permet de modifier la variable $query_string EX: query_posts(‘posts_per_page=15&post_type=page&…param=value’); Plus d’infos http://codex.wordpress.org/Function_Reference/query_posts
Texte statique Fonctions WordPress Résumé + Lien vers l’article <div class="entry-content"> <p>Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life.</p> <p><a href="#" class="more-link">Continue reading<span class="meta- nav">→</span></a></p> </div> <!-- .entry-content --> <?php the_excerpt(); ?> <?php the_permalink; ?>
prise en charge des Illustrations Dans functions.php <?php add_theme_support( 'post-thumbnails' ); ?> Plus d’info http://codex.wordpress.org/Function_Reference/add_theme_support Post thumbnails http://codex.wordpress.org/Function_Reference/post_thumbnails
the_post_thumbnail() <?php the_post_thumbnail ( $size, $attr ); ?> $size = thumbnail (150 x 150) medium (300 x 300) large (640 x 640) full Originale $attr = src, class, alt, title Plus d’info http://codex.wordpress.org/Function_Reference/the_post_thumbnail
dimension personnalisée Dans functions.php <?php add_image_size( $name, $width, $height, $crop ); ?> // création d’une nouvelle taille d’image de 200x200 <?php add_image_size( ‘miniature’, 200, 200 ); ?> Plus d’info http://codex.wordpress.org/Function_Reference/add_image_size
• Derniers commentaires • Liste des auteurs • Articles les plus commentés • De la pub • Les liens partenaires • Un formulaire de recherche • … هرخآ ىلإ
sidebar Dans sidebar.php <aside class="widget"> <h3 class="widget-title">Widget</h3> <p>Even the all-powerful Pointing has …p> <p>One day however a small line of blind …p> </aside> <!-- .widget --> <aside class="widget"> <?php dynamic_sidebar('ma-sidebar'); ?> </aside> <!-- .widget --> Plus d’info http://codex.wordpress.org/Function_Reference/dynamic_sidebar
Post Type register_post_type(): pour enregistrer le nouveau Custom Post Type add_action(): Pour lancer la function lors de l’initialisation de WordPress Plus D’info: add_action: http://codex.wordpress.org/Function_Reference/add_action Register_post_type: http://codex.wordpress.org/Function_Reference/register_post_type
model de page <?php /* Template Name: nom du modèle */ ?> <!– Reprendre la structure de page.php --> $custom.php page-$slug.php page.php page-$id.php URL demandée (page)