785326 Propulsez Votre Site Avec Wordpress

Propulsez votre siteavec WordPress

Par Midnight Falcon

www.openclassrooms.com

Licence Creative Commons 6 2.0Dernire mise jour le 11/03/2014

Sommaire 2Sommaire ........................................................................................................................................... 3Partager .............................................................................................................................................. 5 Propulsez votre site avec WordPress ................................................................................................ 5Partie 1 : Prendre en main Wordpress ................................................................................................ 6Dcouvrir WordPress ........................................................................................................................................................ 6Prsentation ................................................................................................................................................................................................................ 6Introduction .................................................................................................................................................................................................................. 6Historique .................................................................................................................................................................................................................... 6Fonctionnalits ............................................................................................................................................................................................................ 6Mise en place du serveur web ..................................................................................................................................................................................... 6Qu'est-ce qu'un serveur ? ........................................................................................................................................................................................... 7Sur Windows : WAMP ................................................................................................................................................................................................. 8Sur Mac : MAMP .........................................................................................................................................................................................................

10Sur Linux : LAMP ...................................................................................................................................................................................................... 11Installation ................................................................................................................................................................................................................. 11Cration de la base de donnes ................................................................................................................................................................................ 11Tlchargement ......................................................................................................................................................................................................... 12Paramtrage de linstallation ..................................................................................................................................................................................... 13L'interface d'administration ........................................................................................................................................................................................

15Les publications ............................................................................................................................................................... 16Les articles ................................................................................................................................................................................................................ 16Gestion des articles ................................................................................................................................................................................................... 17Catgories et mots-cls ............................................................................................................................................................................................ 18Les pages .................................................................................................................................................................................................................. 18Les attributs ............................................................................................................................................................................................................... 19Le menu .................................................................................................................................................................................................................... 19Crer un menu .......................................................................................................................................................................................................... 20Organiser les menus ................................................................................................................................................................................................. 21Les mdias ................................................................................................................................................................................................................ 21Insertion dans un article ............................................................................................................................................................................................ 24Grer les mdias non utiliss ....................................................................................................................................................................................

24Grer un site participatif .................................................................................................................................................. 25Les commentaires ..................................................................................................................................................................................................... 25Activer ou non les commentaires .............................................................................................................................................................................. 26Les options ................................................................................................................................................................................................................ 26Modrer les commentaires ........................................................................................................................................................................................ 28Les utilisateurs .......................................................................................................................................................................................................... 28Gestion des utilisateurs ............................................................................................................................................................................................. 28Les rles .................................................................................................................................................................................................................... 29Cration d'utilisateur ..................................................................................................................................................................................................

29Modifier l'apparence ........................................................................................................................................................ 30Changer de thme ..................................................................................................................................................................................................... 31Ajouter un thme via l'administration ........................................................................................................................................................................ 31Utiliser un thme tlcharg ..................................................................................................................................................................................... 32Ajouter des widgets ................................................................................................................................................................................................... 32Placer un nouveau widget ......................................................................................................................................................................................... 33Dsactiver un widget .................................................................................................................................................................................................

34TP : Crez vos premires pages ..................................................................................................................................... 35Prsentation de l'exercice ......................................................................................................................................................................................... 35Consignes ................................................................................................................................................................................................................. 37Correction .................................................................................................................................................................................................................. 37Le thme ................................................................................................................................................................................................................... 37La page de prsentation personnelle ........................................................................................................................................................................ 38L'article d'introduction ................................................................................................................................................................................................ 39Le menu .................................................................................................................................................................................................................... 40Les widgets ...............................................................................................................................................................................................................

41Ajouter des plugins .......................................................................................................................................................... 41Grer les plugins ....................................................................................................................................................................................................... 41Installer de nouveaux plugins .................................................................................................................................................................................... 42Mise jour d'un plugin .............................................................................................................................................................................................. 42Exemples de plugins ................................................................................................................................................................................................. 42qTranslate ................................................................................................................................................................................................................. 44Hupso Share Buttons ................................................................................................................................................................................................ 45NextGEN Gallery .......................................................................................................................................................................................................

46Partie 2 : Dvelopper votre thme .................................................................................................... 47Premiers pas dans le code .............................................................................................................................................. 47Utiliser la documentation ........................................................................................................................................................................................... 47La structure de WordPress ........................................................................................................................................................................................ 47Systme de fichiers ................................................................................................................................................................................................... 47La base de donnes .................................................................................................................................................................................................. 48Le principe des actions ............................................................................................................................................................................................. 48Thorie ...................................................................................................................................................................................................................... 48Les fonctions utilises ............................................................................................................................................................................................... 48WordPress et la programmation oriente objet .........................................................................................................................................................

2/113


48Retour en arrire ....................................................................................................................................................................................................... 49Et votre code dans tout a ? .....................................................................................................................................................................................

50Les thmes ...................................................................................................................................................................... 50Structure d'un thme ................................................................................................................................................................................................. 50Le fichier styles.css ................................................................................................................................................................................................... 51Un premier fichier PHP .............................................................................................................................................................................................. 51Un fichier courant : functions.php .............................................................................................................................................................................. 52Hritage de thme ..................................................................................................................................................................................................... 52Dclaration du thme enfant ..................................................................................................................................................................................... 53Surcharge de fichiers ................................................................................................................................................................................................ 54Ajouter une zone de widgets ..................................................................................................................................................................................... 54Enregistrer la zone .................................................................................................................................................................................................... 55Afficher les widgets ................................................................................................................................................................................................... 55Une mthode alternative : des widgets sans zone .................................................................................................................................................... 56Ajouter un menu ........................................................................................................................................................................................................ 56Dclaration du menu ................................................................................................................................................................................................. 56L'affichage .................................................................................................................................................................................................................

57Le processus de rendu .................................................................................................................................................... 58La boucle de rendu .................................................................................................................................................................................................... 58Les templates tags .................................................................................................................................................................................................... 58Rendu dun contenu .................................................................................................................................................................................................. 60Les filtres ................................................................................................................................................................................................................... 60Appeler un filtre ......................................................................................................................................................................................................... 60Brancher un filtre ....................................................................................................................................................................................................... 61Ajouter des templates personnaliss ........................................................................................................................................................................

62Linternationalisation ........................................................................................................................................................ 63Les fonctions de traduction ....................................................................................................................................................................................... 63Traduire un texte ....................................................................................................................................................................................................... 63Le domaine de traduction .......................................................................................................................................................................................... 64Ajouter des traductions ............................................................................................................................................................................................. 64Utiliser Poedit ............................................................................................................................................................................................................ 67Utiliser les traductions dans un thme ......................................................................................................................................................................

68TP : Personnalisez votre thme ...................................................................................................................................... 69Prsentation de l'exercice ......................................................................................................................................................................................... 69Consignes ................................................................................................................................................................................................................. 70Indications ................................................................................................................................................................................................................. 70Correction .................................................................................................................................................................................................................. 70Dclarer les emplacements du menu et du widget ................................................................................................................................................... 70Gestion des lments affichs .................................................................................................................................................................................. 72Corrig type ...............................................................................................................................................................................................................

73Partie 3 : Dvelopper un plugin complet ........................................................................................... 74Crer des plugins ............................................................................................................................................................ 74Dclarer le plugin ...................................................................................................................................................................................................... 75Nos premires fonctions ........................................................................................................................................................................................... 75Rajouter un filtre simple ............................................................................................................................................................................................ 75Utiliser une structure objet ........................................................................................................................................................................................ 76Une structure multifichiers ......................................................................................................................................................................................... 77Un plugin complet ..................................................................................................................................................................................................... 77Les objectifs .............................................................................................................................................................................................................. 77La classe Zero_Newsletter ........................................................................................................................................................................................

79Crer des widgets ........................................................................................................................................................... 79Dclarer un widget .................................................................................................................................................................................................... 79Une nouvelle classe .................................................................................................................................................................................................. 81Les paramtres ......................................................................................................................................................................................................... 82Le rendu final .............................................................................................................................................................................................................

84Modifier la base de donnes ........................................................................................................................................... 84Excuter des requtes SQL ...................................................................................................................................................................................... 84Crer une nouvelle table ........................................................................................................................................................................................... 84Tracer lactivation du plugin ....................................................................................................................................................................................... 85La dsactivation et la dsinstallation du plugin ......................................................................................................................................................... 86L'insertion et la slection ...........................................................................................................................................................................................

89L'administration ............................................................................................................................................................... 89Ajouter des menus .................................................................................................................................................................................................... 89Menu principal ........................................................................................................................................................................................................... 90Les sous-menus ........................................................................................................................................................................................................ 92Crer des options ...................................................................................................................................................................................................... 93Le fonctionnement des options ................................................................................................................................................................................. 93Le formulaire ............................................................................................................................................................................................................. 95Gnration automatique des champs ....................................................................................................................................................................... 98Traiter des actions .....................................................................................................................................................................................................

100Les shortcodes .............................................................................................................................................................. 100Utiliser un shortcode ............................................................................................................................................................................................... 100Format ..................................................................................................................................................................................................................... 101Paramtres .............................................................................................................................................................................................................. 101Crer un shortcode ..................................................................................................................................................................................................

105Partie 4 : Exploiter votre site ........................................................................................................... 105Mettre en production ..................................................................................................................................................... 105Sur un hbergement mutualis ............................................................................................................................................................................... 106Sur un serveur ddi ............................................................................................................................................................................................... 106Installation et copie des fichiers ..............................................................................................................................................................................

Sommaire 3/113


107Dfinition du Virtual Host ......................................................................................................................................................................................... 107Amliorer le rfrencement ........................................................................................................................................... 108Des URLs propres ................................................................................................................................................................................................... 108Un contenu de qualit ............................................................................................................................................................................................. 108Faciliter l'indexation ................................................................................................................................................................................................. 108Le sitemap ............................................................................................................................................................................................................... 109Les robots ................................................................................................................................................................................................................

110Optimiser les performances .......................................................................................................................................... 110Utiliser le cache WordPress .................................................................................................................................................................................... 110Optimiser l'affichage des pages .............................................................................................................................................................................. 110Cacher les ressources ............................................................................................................................................................................................. 111Fusionner les fichiers JS et CSS .............................................................................................................................................................................

Partager 4/113


Propulsez votre site avec WordPress

Par Midnight Falcon

Mise jour : 11/03/2014Difficult : Facile

Aujourd'hui, de nombreux acteurs du monde informatique se sont mis la mode des blogs, ces petits sites de contenu grs laplupart du temps par une personne et qui laissent transparaitre les rflexions de leur auteurs sur les sujets qui les passionnent.Pour faciliter la cration de ces sites d'un genre particulier, il est prfrable de partir d'un systme solide et qui a fait ses preuves,tout en vitant aux auteurs les complications du dveloppement d'un site Internet.

WordPress a t cr dans cette optique, c'est donc probablement l'outil qu'il vous faut si vous dsirez tenir un blog ou biensimplement un site de prsentation personnel ou d'entreprise. Ce cours a pour objectif de vous faire dcouvrir et utiliserWordPress afin d'tre parfaitement autonome avec cet outil !

En premire partie, nous aborderons WordPress en tant qu'utilisateur, c'est--dire comme webmaster d'un site Internet. Nousapprendrons grer le site, rajouter des contenus et changer son aspect visuel grce l'interface d'administration qui permet dequasiment tout faire sans avoir connatre le fonctionnement technique de WordPress.

Dans la seconde partie, nous passerons du ct du dveloppeur afin d'aller plus loin dans la personnalisation d'un site sousWordPress. Cette partie n'est pas obligatoire pour grer un blog (la plupart des utilisateurs de WordPress s'en passe), mais ellepermet de modifier l'affichage du site pour qu'il corresponde prcisment vos besoins.

Nous poursuivrons dans cette optique avec la troisime partie qui sera focalise sur la cration d'un nouveau module denewsletter pour WordPress, ce qui vous donnera les bases afin, par la suite, de modifier le fonctionnement interne del'application comme bon vous semblera.

Ces deux sections requirent la matrise de PHP ainsi que du HTML et du CSS pour pouvoir tre correctementexploites.

Pour terminer, il sera temps de mettre un site WordPress en ligne, de s'occuper de son rfrencement et de ses performances.Loin d'tre la fin de votre travail sous WordPress, c'est l qu'une nouvelle aventure commence !

Partager 5/113


Partie 1 : Prendre en main Wordpress

Dcouvrir WordPressCe premier chapitre introductif sera loccasion de dcouvrir ce quest WordPress et ce quil nous permet de raliser. Nous enprofiterons aussi pour linstaller et faire un rapide survol des fonctionnalits dans son interface dadministration.

PrsentationIntroduction

WordPress est un logiciel libre principalement spcialis dans la cration de blogs, dont la ralisation est trs facile. Cestcependant loin dtre sa seule possibilit et rien ne vous empchera de crer un site diffrent.

Ainsi, il est bon savoir que WordPress est un CMS (Content Management System ou Systme de Gestion de Contenu enfranais), cest--dire quil permet lutilisateur (c'est--dire ladministrateur du site) de crer facilement des pages de contenu,comme par exemple :

la page de prsentation dune entreprise ;des articles de blog ;une page de contact ;un portfolio pour un artiste ;bien encore des fiches produits sur un site de vente en ligne ;etc.

Lide dun CMS est de donner la possibilit de facilement crer du contenu sur le site, sans avoir mettre les mains dans le codeni mme avoir de connaissances techniques particulires.

Historique

WordPress est sorti pour la premire fois en 2003 comme un projet driv de cafelog, lui-mme tant un moteur de blog sorti en2001. De nombreuses versions sont sorties depuis, chacune apportant son lot de nouveauts par rapports aux versionsprcdentes, comme les plugins, les widgets, les thmes, une interface utilisateur amliore La version 3 est sortie en 2010 enapportant notamment la gestion des menus, de nouvelles fonctions pour grer len-tte du site ainsi que le support du multisite(cest ce qui permet davoir plusieurs sites sur une mme instance de WordPress).

Fonctionnalits

WordPress est crit en PHP, un langage de programmation spcialis dans la cration de sites Internet. Ce langage permet doncaux dveloppeurs de rajouter des fonctionnalits qui pourront tre rutilises par dautres utilisateurs. Il est donc facile modifier si vous avez de bonnes bases dans ce langage.

Lune des grandes forces de WordPress est ainsi la multitude de plugins disponibles, dvelopps par la communaut. Ce sontdes modules permettant d'ajouter des fonctionnalits WordPress, comme par exemple la cration d'une galerie photo ou lagestion d'une newsletter. Il y en a aujourdhui plus de 25 000 plugins sur le site officiel, wordpress.org. Il y a donc fort parierque, si vous cherchez une fonctionnalit supplmentaire pour votre site, un plugin existe dj pour cela ! Si cela ntait pas lecas, vous pouvez bien entendu dvelopper le votre et ventuellement le publier.

La renomme de WordPress dans le monde du blogging est telle quil existe mme un site ddi, wordpress.com ( ne pasconfondre avec le site officiel en .org), qui vous permet de crer votre blog WordPress sans vous occuper de son hbergementou de son installation. Tout est gr automatiquement, vous navez qu crer votre contenu. Vous navez en revanche pasdirectement la main sur le code et il sera ncessaire de passer par linstallation de thmes ou de plugins pour faire desmodifications fonctionnelles.

Mise en place du serveur webQu'est-ce qu'un serveur ?

Propulsez votre site avec WordPress 6/113


Pour fonctionner, tout site Internet sappuie sur un serveur qui se charge d'envoyer les pages un visiteur qui en fait lademande. Le serveur est un programme qui excute le code du site web (crit en PHP dans le cas de WordPress) pour gnrer etenvoyer la page au format HTML, lisible par un navigateur Web (Safari, Google Chrome, Mozilla Firefox, etc.). Pour utiliserWordPress, vous devrez donc obligatoirement en utiliser un ! Le serveur le plus utilis pour PHP sappelle Apache, il esttotalement gratuit et peut fonctionner sur nimporte quel environnement (Windows, Linux ou Mac), mais il en existe dautres,parfois payants.

De plus, le serveur web fonctionne le plus souvent conjointement une base de donnes, qui permet de stocker les informationsspcifiques votre site : le contenu des pages, les utilisateurs inscrits, la configuration Tout ce qui change dun site lautreest potentiellement stock lintrieur sous la forme de plusieurs tableaux de donnes. MySQL est un systme de base dedonnes trs connu et rpandu, car il est totalement gratuit et compatible avec une majorit dapplications, cest pourquoi nousallons lutiliser.

Un serveur web et la base de donnes peuvent s'installer sur n'importe quelle machine, mme votre ordinateur personnel. Celapermet notamment de faire des tests localement, sans que votre site soit en ligne ; on parle alors dinstallation locale . Il fauttoujours commencer par une installation locale lorsque vous prenez en main un outil, afin de limiter la porte des erreurs quevous pourriez faire en dbutant. Si vous faites des erreurs alors que votre site est en ligne, nimporte quel visiteur pourra le voir,tandis que vous tes seul y avoir accs tant que le site reste sur votre ordinateur personnel.

Sur Windows : WAMP

Si vous tes sous Windows, vous pouvez utiliser WAMP. C'est un programme qui contient un serveur Apache ainsi qu'une basede donnes MySQL sur votre ordinateur. Vous pouvez tlcharger WAMP sur le site officiel, qui propose plusieurs versionsdiffrentes du logiciel. Si vous ne savez pas laquelle choisir pour votre ordinateur, vous pouvez choisir la premire de la liste quifera a priori parfaitement l'affaire.

Une fois le paquet tlcharg, lancez l'installation en conservant les options par dfaut, ce qui devrait crer un dossier c:\wampsur votre ordinateur. Vous pouvez vrifier que WAMP fonctionne correctement avec l'icne qui doit s'afficher dans la barre destches (voir la figure suivante).

Apparition de l'icne de WAMP dans la barre des tches

Ouvrons maintenant un navigateur en indiquant http://localhost/ dans la barre d'adresse, qui correspond l'adresse du serveurweb (voir la figure suivante).

La page d'accueil de WAMP



Si vous obtenez bien cette page, votre serveur web est oprationnel et prt faire tourner WordPress !

Sur Mac : MAMP

Pour les systmes sous Mac OS X, il existe le logiciel MAMP, qui installe lui aussi tous les programmes qui nous serontncessaires. Vous pouvez le tlcharger directement en passant par ce lien. http://www.mamp.info/en/index.html Commencez parextraire larchive .zip puis excutez le fichier .pkg pour lancer linstallation (voir la figure suivante).

L'installation MAMP sur Mac

Une fois MAMP install, vous pouvez le lancer depuis le dossier Applications > MAMP de votre ordinateur. La fentre quisouvre indique le statut des serveurs Apache et MySQL. Sil sont arrts, cliquez sur dmarrer les serveurs pour voir le statutpasser au vert (voir la figure suivante).



Dmarrage des serveurs

Ouvrez ensuite la fentre Prfrences . Dans longlet Ports , cliquez sur le bouton Ports par dfaut dApache et deMySQL . Puis, dans longlet Apache , vous pouvez choisir le dossier dans lequel vous placerez les diffrents sites sur votreordinateur. Je vous conseille de choisir le dossier Sites qui doit dj exister dans votre rpertoire personnel (voir la figuresuivante).

Les ports d'Apache et MySQL sont mis jour

Vous pouvez valider les modifications, puis vous rendre sur la page http://localhost/MAMP/ dans votre navigateur pour vrifierle bon fonctionnement du serveur (voir la figure suivante).



La page

d'accueil de MAMP

Sur Linux : LAMP

Si vous utilisez un systme Linux comme Ubuntu ou Debian, le plus simple est dinstaller les diffrents paquets contenantApache, PHP et MySQL. Lancez donc la commande suivante dans une console :

Code : Console

sudo apt-get install apache2 php5 mysql-server libapache2-mod-php5 php5-mysql

Lensemble des paquets doit sinstaller sans problme. Lors de linstallation de MySQL, la console vous demandera dentrer unmot de passe dont vous devrez vous souvenir pour vous connecter la base de donnes, ne loubliez pas ! Installez ensuitephpMyAdmin avec la ligne de commande suivante.

Code : Console

sudo apt-get install phpmyadmin

Linvite de commande vous demandera dans un premier temps de choisir le serveur configurer pour phpMyAdmin, choisissezApache, puis validez la cration dune base de donnes ltape suivante. Enfin, vous devrez entrer le mot de passe choisi linstallation de MySQL pour que le paquet puisse crer sa propre base de donnes.

Une fois linstallation termine, rendez-vous ladresse http://localhost/ dans votre navigateur. Une page de confirmation,comme la figure suivante, doit safficher.



La page d'accueil sur Linux

InstallationCette partie vous concerne si vous souhaitez installer WordPress sur un environnement local (aprs avoir install un serveurApache sur votre ordinateur) ou bien sur un serveur ddi chez un hbergeur, ce qui vous permettrait de mettre votre site enligne en grant votre serveur seul. Si vous choisissez de crer votre blog sur le site officiel de WordPress, tout ce que vous aurez faire est de vous inscrire, et tout sera install automatiquement.

Cration de la base de donnes

Avant de continuer, nous allons devoir crer la base de donnes pour que WordPress puisse stocker les informationsspcifiques notre site. Pour cela, nous devons accder l'interface de phpMyAdmin l'adresse http://localhost/phpmyadminou bien http://localhost/MAMP/phpmyadmin si vous utilisez MAMP. Identifiez-vous avec le login root et un mot de passevide (si cela ne fonctionne pas, le mot de passe est probablement root , notamment sur MAMP) afin d'arriver sur l'interface degestion de la base de donnes. Cliquez en haut de la page sur l'onglet Base de donnes , puis choisissez un nom de base dedonnes (par exemple "WordPress") sur la page qui s'affiche (voir la figure suivante).

Crer la base de donnes dans phpMyAdmin

Validez par un clic sur "Crer", puis passez l'tape suivante.

Tlchargement

Les sources de WordPress sont rcuprables sur le site fr.wordpress.org directement depuis la page daccueil. Vous rcuprez unfichier .zip (ou .tar.gz) contenant un dossier intitul wordpress que vous devez dcompresser dans le rpertoire racine devotre serveur web.Par exemple :

C:/wamp/www sous windows avec WAMP



/var/www sur Ubuntu/Debian/Users/[nom]/Sites avec MAMP

Une fois le dossier en place, nous pouvons aller l'adresse http://localhost/wordpress afin de passer l'tape suivante.

Paramtrage de linstallation

Si vous allez directement sur lURL de votre site, vous obtenez une page derreur indiquant que WordPress a besoin dun fichierwp-config.php pour fonctionner (voir la figure suivante).

Le fichier wp-config.php est manquant

partir de l, vous pouvez soit cliquer sur le bouton vous proposant de crer automatiquement un fichier de configuration enremplissant les informations de votre base de donnes, soit crer ce fichier la main. Dans le premier cas, il faudra que votreserveur web ait les droits dcriture la racine de votre site pour pouvoir gnrer le fichier.

Suivre linstallation automatiqueSi vous suivez les tapes dinstallation proposes par WordPress, il vous suffit de vous laisser guider et de renseigner lesinformations de connexion votre base de donnes. Si vous n'avez fait aucune modification particulire, le login sera nouveauroot et il n'y aura pas de mot de passe (laissez le champ vide).Une fois les donnes correctement remplies, WordPress va crer pour vous le fichier de configuration ainsi que les tablesncessaires dans la base de donnes.

Si les informations de connexion sont correctes (comme sur la figure suivante), vous devriez pouvoir procder la finalisation delinstallation.

La configuration de la base de donnes est correcte



Crer le fichier wp-config.phpIl est aussi possible de crer le fichier de configuration la main en se basant sur le fichier wp-config-sample.php situ la racine de votre installation. Il suffit pour cela de copier le fichier en le renommant wp-config.php, puis de modifier lesinformations de connexion lintrieur du fichier.

Quelle que soit la mthode que vous avez choisie pour installer WordPress, toute modification ultrieure des informations deconnexion la base de donnes devra se faire en ditant le fichier wp-config.php.

Une fois cette tape franchie, vous pouvez choisir un titre pour votre site, dfinir votre nom dutilisateur ainsi quun mot depasse et votre email. Validez. Votre site est prt recevoir ses premiers contenus (voir la figure suivante) !

L'installation est termineL'interface d'administration

Vous pouvez accder linterface dadministration via lURL http://localhost/wordpress/wp-admin, en vous identifiant avec lenom et le mot de passe fournis pendant la phase dinstallation (voir la figure suivante).



L'interface de connexion WordPress

Avant de plonger dans lensemble des fonctionnalits offertes par votre CMS, il est bon de commencer par vous familiariser avecson interface.

Le menu est partag en trois section :le tableau de bord ;les contenus ;les paramtres du site.

Le tableau de bord est une page affichant des informations gnrales sur lensemble du site. On peut y trouver des statistiques,un fil dactualit sur WordPress, la liste des commentaires rcents C'est sur cette page (voir la figure suivante) que vousarrivez lorsque vous vous connectez l'interface.

L'accueil du panneau d'administration



La seconde section concerne ldition des contenus que sont les pages, les articles, les mdias ainsi que les commentaires. Ici,vous pourrez ajouter, supprimer ou diter le contenu de votre site et, faire de la modration sur les commentaires. Cest la partie laplus utilise pour produire du contenu sur le site.

Enfin, le bas du menu donne accs au paramtrage du site, comme le choix du thme et des plugins ou la gestion des utilisateurs.Il est aussi possible de grer le fonctionnement de certaines fonctionnalits du site dans la partie Settings .

Si vous dcidez par la suite dinstaller des plugins (c'est--dire des modules apportant des fonctionnalits supplmentaires ausite), ceux-ci pourront rajouter des informations sur le tableau de bord, comme par exemple :

des statistiques sur vos visiteurs ;le nombre d'abonns votre newsletter ;la cration de nouveaux menus ladministration afin de donner accs de nouvelles pages ;etc.

Linterface est donc susceptible dvoluer.WordPress est un CMS crit en PHP cr en 2003.Un site Internet a besoin d'un serveur et d'une base de donnes pour fonctionner.Le serveur peut tre install sur votre ordinateur pour vos tests.L'interface d'administration permet de grer votre site.



Les publicationsVotre site est dornavant install et prt lemploi, mais il est encore terriblement vide ! Voyons comment remdier cela enajoutant du contenu pour les visiteurs.

Les articlesSous WordPress, les contenus sont organiss en deux types : les articles et les pages. La diffrence entre les deux rside dans letype de contenu que vous allez placer lintrieur.

Un article sera gnralement un contenu dactualit, cest--dire quil prend sa plus grande valeur au moment de sa publication.Cest typiquement le type de contenu utilis pour les publications dun blog ou sur un fil dactualit.

Une page aura au contraire un contenu valeur constante dans le temps sans avoir besoin dtre mise jour. On peut lutiliserpour prsenter une socit, une personne ou bien pour parler dun sujet de fond.

Au niveau de la prsentation, les articles peuvent tre affichs en liste par ordre chronologique, puisque cest ce qui fait leursens, soit compltement soit avec un aperu du contenu, tandis que les pages seront accessibles par un lien (le plus souventdans le menu de navigation) vers leur contenu.

Gestion des articles

Pour crer un article, il suffit daller dans Articles et de choisir Ajouter dans le sous-menu.

L'diteur de texte

Dans la page qui apparat, vous avez un champ pour dfinir le titre de votre article ainsi quun diteur de texte pour taper soncontenu et le mettre en forme grce la barre d'outils ddie (voir la figure suivante).

L'diteur de texte riche

Vous pouvez notamment mettre du texte en gras ou en italique, crer des listes puces, changer l'alignement du texte ou sacouleur.

Pour avoir une description de ce que fait l'un des boutons de l'diteur, vous pouvez le survoler pour afficher une petite bulled'informations. Aussi, la dernire icne (en forme de point dinterrogation), affiche l'aide de l'diteur dans une nouvelle fentre.Enfin, deux onglets intituls Visuel et Texte permettent d'alterner la vue entre l'aperu du rendu final et le code HTMLgnr. Si vous ne connaissez pas le HTML, il est inutile de basculer en mode texte, le mode visuel vous suffira amplement.

Publier l'article

droite se trouvent les actions disponibles pour larticle en cours de cration. Il est notamment possible davoir un aperu delarticle avec le design du blog pour avoir une ide du rendu final. Vous pouvez aussi, comme dans la figure suivante, grer ltatde publication de votre article.



Publication d'un article

Tant quun article nest pas dans ltat Publi , il napparat pas sur le site. Vous pouvez donc commencer le rdiger en tantque brouillon, sauvegarder puis y revenir plus tard pour le terminer. Le bouton Publier permet de valider larticle pour quilsoit affich, ventuellement une date ultrieure.

Catgories et mots-cls

Il est possible dassocier une ou plusieurs catgories un article, ainsi quun ensemble de mots-cls. Ceci permettra vosvisiteurs de se reprer plus facilement parmi la liste darticles aux thmes varis que vous pourrez crire.

Les catgories

Pour grer les catgories, il suffit de se dplacer dans le menu Articles > Catgories . La page correspondante permetdajouter une catgorie et dditer celles qui existent dj.Par dfaut, seule une catgorie est prsente et il nest pas possible de la supprimer, cest la catgorie par dfaut des articles siaucune autre assignation nest choisie.

Pour crer une catgorie, il faut renseigner :le nom de la catgorie, qui sera affich sur les pages ;un identifiant, typiquement utilis dans lurl lors de laffichage des articles dune catgorie donne ;un parent (facultatif), cest--dire que chaque catgorie peut avoir une catgorie parente ;une description (facultative) qui sera ventuellement affiche si le thme le permet.

Une fois la catgorie cre, nous pouvons choisir dy assigner un article. Pour cela, sur la page ddition de larticle, il suffit decocher la case correspondant la catgorie associer, puis de mettre jour larticle. Si lon affiche notre site nouveau, lacatgorie ajoute devient visible dans le pied-de-page du site (ou sur le cot suivant le thme). En cliquant dessus, vous pouvezconstater que lon obtient sur une nouvelle page la liste des articles associs (voir la figure suivante).

La liste des catgories s'affiche sur le blog



Les mots-cls

Contrairement la description thmatique des catgories, les mots-cls ou tags permettent de caractriser un article de faonplus prcise. Par exemple, un article sur le fonctionnement de WordPress, pourra tre dans la catgorie Mes tutos sur le blog,mais pourra avoir comme mots-cls cours , informatique , formation , fonctionnement , WordPress , etc. Ladescription du contenu de l'article devient plus riche.

De mme que pour les catgories, il existe une page spcifique dans ladministration pour grer les mots-cls, dans le sous-menudu mme nom. On prfre cependant crer les mots-cls directement sur la page de cration dun article, car il est commun d'encrer spcifiquement pour un article.

Pour cela, sous le formulaire permettant lajout de catgories, un champ vous invite indiquer les mots-cls (spars par desvirgules). Il est aussi possible de faire un choix parmi les mots-cls existants les plus utiliss. Crez ou slectionnez vos tags etmettez jour larticle pour enregistrer les modifications (voir la figure suivante).

Choix des mots-cls pour chaque article

Lors de la visualisation de larticle, vous aurez dornavant une liste de mots-cls qui vous redirigeront vers la liste des articlesassocis, comme cest le cas pour les catgories. En effet, si deux articles ont un mot-cl en commun (par exemple informatique), l'utilisateur pourra retrouver ces deux articles en tapant le mot-cl. Cela permet de faciliter la recherche de publications pourvos visiteurs en leur proposant un ventail des mots qui reviennent frquemment sur votre site.

Les pagesLa cration de pages est trs similaire celle des articles et se fait via le menu Pages > Ajouter . L'dition du contenu se faitpar le mme diteur de texte et la publication suit le mme procd. En revanche, les options de la page sont diffrentes. Nousnavons plus de catgories ou de mots-cls associer, mais trois attributs nouveaux.

Les attributs

Sur le ct droit de la zone d'dition des pages, un cadre similaire la figure suivante s'affiche.



Les diffrents attributs de page

On peut associer une page parente une autre, ce qui permet de dfinir une hirarchie de pages. Le principal changement visuelapparat dans le menu principal qui arborera alors des sous-menus pour afficher les pages enfants que vous aurez dfinies.

L'attribut Modle (qui n'est pas toujours visible suivant les thmes) sert changer le format de la page, cest--dire la faondont elle est affiche. Par dfaut, les pages sont le plus souvent affiches avec une colonne latrale (comme pour la liste desarticles) qui affiche des widgets (liste de catgories, mots-cls, liens divers). Il est donc possible sur certains thmes de choisirde ne pas afficher cette barre latrale sur une page bien prcise en choisissant un modle de page pleine largeur .

Enfin, l'attribut Ordre dfinit lordre dapparition de la page dans le menu par rapport aux autres. La page avec l'ordre le pluspetit apparaitra gauche, tandis que la page la plus droite sera celle avec l'ordre le plus lev.

Le menuUn menu est l'lment essentiel de la navigation sur le site, car il donne un lien vers les principales pages de celui-ci.La gestion des menus s'effectue via le sous-menu Rglages > Menus dans l'interface d'administration.

WordPress me dit qu'il n'y a pas de menu existant ! Il y a pourtant bien un menu en haut de mes pages, non ?

En effet, en l'absence de menu, celui-ci est automatiquement gnr par le thme lors de l'affichage d'une page. En l'occurrence, ilaffichera un lien vers la page d'accueil ainsi qu'un lien par page que vous aurez cre. Il vaut donc mieux avoir un menupersonnalis si vous souhaitez avoir la main sur l'affichage et les liens qui seront affichs !

Crer un menu

Pour crer un menu, rien de plus simple : il suffit de choisir un nom et de cliquer sur Crer un menu .

Une fois le menu cr, il ne manque plus qu' lui ajouter des liens. Ceux-ci peuvent tre de plusieurs types :un lien personnalis pour lequel vous choisissez l'url exacte ;une page statique ;un lien vers une catgorie.

Lorsqu'un lien est ajout au menu, il apparat dans le cadre central qui rsume les lments de menu ajouts. Il est alors possible,en dpliant le bloc, de supprimer le menu, de modifier le libell ou de rajouter un attribut title au lien correspondant (voir lafigure suivante).



Modification des attributs du menu

De cette faon, une bulle apparat lorsque l'on survole le menu avec la souris (voir la figure suivante).

L'attribut title s'affiche sous la souris

Une fois que vous avez ajout vos liens, il faut activer le menu dans le bloc Emplacements du thme o vous pouvez choisirle menu principal. Le menu sera alors utilis comme navigation principale du site. Si le thme que vous utilisez le permet, il peuttre possible d'avoir plus d'un emplacement de menu actif la fois, vous pourriez alors en activer un deuxime affich un autreendroit de vos pages.

Je ne peux plus aller vers la page qui liste mes articles, on n'a pas pu l'ajouter au menu !

Vous l'avez vu, il n'est pas possible d'ajouter dans le menu un lien de type page d'articles . Vous tes donc obligs de taperl'url de base du site pour avoir la liste de vos publications, ce qui n'est pas optimal Deux solutions peuvent rgler ce problme.

La premire consiste ajouter un lien personnalis au menu, qui sera la page d'accueil du site et qui aura par exemple pour titre Accueil . Cette solution est nanmoins peu pratique et il faudra changer le menu si votre site change d'adresse.

La deuxime option consiste associer la liste des articles une page. Dans Rglages > Lecture , vous devez alors choisird'afficher une page statique en tant que page d'accueil (choisissez donc une page de contenu que vous avez cre), puis unepage pour lister les articles. Notez que si elle est utilise pour lister les articles, le contenu de cette page ne sera jamais affich, ilpeut donc tre vide.Il suffit ensuite d'ajouter ces deux pages votre menu, la premire sera la page d'accueil et la seconde fera le lien vers la liste desarticles.

La seconde option ne permet pas de conserver la page des articles comme page d'accueil. Il faut pour cela faire undveloppement spcifique dans le code PHP de WordPress, ou utiliser un plugin qui le permettrait.

Organiser les menus

L'ordre d'affichage des liens se fait par dfaut dans l'ordre d'ajout au menu, mais il est tout fait possible de modifier cela commebon vous semble. En glissant-dposant les menus choisis, vous pouvez les ordonner comme il vous plat, mais aussi crer dessous-menus. Pour cela, il faut simplement dplacer l'lment de menu lgrement vers la droite, en-dessous de celui qui sera leparent (voir la figure suivante).



L'interface de gestion des menus

Dornavant, un survol sur le menu parent affichera le sous-menu comme sur la figure suivante !

Affichage du sous-menu au

survol

Ceci permet de reproduire une navigation similaire ce que l'on avait obtenu en dfinissant des pages parentes d'autres pages,mais c'est ici applicable tous les types d'lments de menu, comme les liens personnaliss et les catgories.

Les mdiasSi vous tes dornavant capables de crer des contenus sur votre site, il vous manque un lment important pour rendre celles-ci plus attrayantes : les mdias. Images, sons ou vidos, il est tout fait possible de les insrer dans vos pages et vos articlespour illustrer vos propos.

Insertion dans un article

Toutes les informations qui suivent sont valables sur les pages ainsi que sur les articles.

Sur la page d'dition d'un article, vous trouverez un bouton Ajouter un mdia (voir la figure suivante).



L'ajouter d'un mdia

Aprs avoir cliqu dessus, une nouvelle fentre d'envoi de fichier apparat (voir la figure suivante).

L'interface pour l'envoi des mdias

Vous pouvez glisser-dposer, comme dans la figure suivante, un fichier dans la fentre ou bien cliquer sur le bouton Slectionner les fichiers pour utiliser l'explorateur de fichiers. Une fois le fichier slectionn, celui-ci est directement envoy surle serveur web et un aperu est visible dans l'onglet Bibliothque de mdia de la fentre.



Envoie de l'image sur le serveur

Il est possible d'envoyer tout type de fichier, tant que celui-ci une taille infrieure 2Mo. Vous pouvez donc sans hsiter insrerun fichier de musique ou mme un PDF, WordPress se chargera de proposer un affichage adquat lors de la visualisation del'article par un visiteur (voir la figure suivante).

Apparence d'un mdia audio sur un article

Lorsque le mdia que vous voulez utiliser dans votre article est envoy, vous n'avez plus qu' le slectionner et cliquer sur lebouton d'insertion dans l'article en bas droite. Avant cela, vous pouvez diter les proprits du mdia sur la droite de la fentre :

Titre : le texte afficher au survol du mdia ;Lgende : une lgende qui apparat sous le mdia ;Description : un texte de description plus long que la lgende (cela dpend du thme, elle n'apparait pas sur le thme pardfaut par exemple) ;Lier : permet de choisir le comportement lorsque l'on clique sur le mdia.

Il y a aussi quelques attributs spcifiques aux images :

Texte alternatif : le texte afficher si l'image n'a pu tre affiche ;Alignement : si vous choisissez gauche ou droite , l'image sera borde par le texte de l'article ;



Taille : la taille de la miniature afficher dans l'article.

Enfin, lorsque les mdias voulus ont t insrs, n'oubliez pas de mettre jour votre article pour que les modifications soientprises en compte !

Sur la page Mdias > Ajouter , vous pouvez, de mme que sur un article, ajouter de nouveaux mdias labibliothque. Notez cependant que pour apparatre sur le site, il faudra obligatoirement ajouter ce mdia un article ouune page.

Grer les mdias non utiliss

Lorsque vous supprimez un mdia d'un article, celui-ci n'est pas totalement supprim de WordPress, le fichier envoy reste sur leserveur pour pouvoir tre ventuellement utilis sur d'autres articles.

Pour effacer compltement un mdia, vous devrez, comme dans la figure suivante, passer par la page Mdias > Bibliothque qui rpertorie l'ensemble des fichiers envoys sur le site. Il suffit alors de cliquer sur le lien Supprimer dfinitivement pourl'effacer de la bibliothque.

Suppression des mdias envoys

Si vous supprimez un mdia qui est toujours utilis dans un article, vous aurez alors un lien mort affich sur votre site,ce qui est trs frustrant pour vos visiteurs. Soyez donc certain que le mdia n'est plus du tout utilis avant de lesupprimer !

Les articles sont des publications rgulires dpendant de l'actualit.Les pages sont destines des prsentations.Le menu peut tre gr automatiquement ou manuellement.Tout type de mdia peut tre ajout dans une publication.



Grer un site participatifLa vie dun site, et en particulier dun blog, ne se limite pas ncessairement laction dune seule personne (en loccurrencevous). Elle passe aussi par la participation des visiteurs qui peuvent apporter leur rflexion vos articles, ainsi qu dautresrdacteurs qui peuvent s'investir dans lenrichissement de votre contenu.

Les commentairesSi votre site a du succs, il y a fort parier que des visiteurs voudront laisser des commentaires sur certains articles qui lesauront inspir, voire sur certaines pages.

Activer ou non les commentaires

Tout d'abord, voyons comment faire pour activer (ou dsactiver) les commentaires sur les pages et les articles du site.

Dans l'interface d'administration, allez dans Rglages > Discussion . En haut de la page, une case vous demande si voussouhaitez Autoriser les visiteurs publier des commentaires sur les derniers articles . Si cette case est coche, tous les articleset les pages que vous crerez pourront recevoir des commentaires, et inversement si vous la dcochez. En revanche, cette optionne permet pas d'activer ou dsactiver les commentaires sur les contenus qui sont dj crs. Pour cela, il faut aller dans le menu Articles , puis choisir Modification rapide sous l'article dont vous souhaitez changer le statut (voir la figure suivante).

Plusieurs actions sont disponibles pour les articles

Vous pouvez alors, comme sur la figure suivante, modifier l'autorisation des commentaires via la case cocher Autoriser lescommentaires .

Autorisation des commentaires

Pour faire ce changement sur la totalit de vos articles, vous devrez slectionner Modifier dans la liste des actions groupes,slectionner tous les articles pour lesquels vous souhaitez dsactiver les commentaires, et cliquer sur Appliquer . Unformulaire similaire au prcdent s'affiche alors et permet entre autres d'activer (ou dsactiver) les commentaires pour tous lesarticles (voir la figure suivante).



L'activation des commentaires peut tre groupe

Les actions dcrites ici sont aussi valables pour les pages en passant par le menu listant les pages du site.

Les options

Revenons la page Rglages > Discussion . De nombreux paramtres sont disponibles ici pour vous aider grer lescommentaires, il est par exemple possible de demander ce que tous les commentaires soient valids par un administrateur oubien de dsactiver les commentaires pour les vieux articles. En bas de la page il est possible de choisir si les commentairespeuvent avoir un avatar cot du nom de l'utilisateur l'ayant post. Si oui, vous devez alors choisir un type d'avatar :

Homme mystre : un logo d'utilisateur anonyme est affich ;Vide : une image blanche est affiche ;Gravatar : l'image est rcupre sur Gravatar, un service permettant d'associer une image une adresse email ;Gnration automatique : l'avatar sera une image alatoire dans le style visible sur l'aperu.

Si votre choix se porte sur Gravatar, il vous faut alors choisir un niveau maximal pour la censure de l'image, c'est dire qu'uneimage rserve aux adultes ne sera par exemple pas affiche si vous choisissez un niveau parmi G, PG ou R. Si vous ne savez paslequel slectionner, laissez G Visible pour tous , qui est celui utilis par dfaut.

Modrer les commentaires

Les statutsUne fois un commentaire cr, il peut se trouver dans plusieurs statuts diffrents.

Approuv : le commentaire est visible sur le site ;En attente : le commentaire est en attente de validation, seul vous ou un autre administrateur du site peuvent le voir ;Indsirable : le commentaire est masqu car il a t dsapprouv par un administrateur.

Enfin, il est possible d'avoir un commentaire dans la corbeille si vous avez dcid de le supprimer. Voyons tout de suite commentprocder ces changements de statut.

dition et suppressionLa liste des commentaires prsents sur le site est affichable par le menu "Commentaires" du panneau d'administration. Ensurvolant un commentaire et en cliquant sur Modifier , vous accdez la page d'dition d'un commentaire.



Lorsque vous tes connect comme administrateur, il est aussi possible d'accder directement la fiche d'dition d'uncommentaire avec le lien Modifier qui apparat sur le front-office lors de la visualisation d'un commentaire.

Au centre vous pouvez modifier le contenu du commentaire ainsi que le nom de l'utilisateur ayant post celui-ci. Un historiquedes actions sur ce commentaire (par exemple un changement de statut) est aussi affich en bas de page.

Il est dconseill d'diter le contenu d'un commentaire car l'utilisateur pourra penser que vous cherchez modifier sadclaration en votre faveur. N'utilisez cette fonctionnalit que pour supprimer une phrase offensante par exemple, bienque dans la plupart des cas la suppression pure et simple du commentaire soit prfrable.

Sur la droite, nous retrouvons la liste des statuts prsents plus haut, ainsi que la date de cration du commentaire et un lienpour le dplacement dans la corbeille.

Si nous choisissons de placer le commentaire comme En attente , vous pouvez voir qu'il est immdiatement retir del'affichage public sous l'article auquel il se rattachait. D'autre part, un petit 1 est apparu dans le menu d'administration pourindiquer qu'un commentaire tait en attente de validation par un administrateur (voir la figure suivante).

Un commentaire en attente de validation

Si le commentaire est marqu comme Indsirable ou bien plac dans la corbeille, il n'apparat plus dans la liste descommentaires. Il faut alors choisir le filtre Indsirable (ou corbeille) en haut de la page pour y accder (voir la figure suivante).

La corbeille regroupe les messages supprims

Vous pouvez alors choisir d'annuler ce statut et de restaurer le commentaire pour qu'il apparaisse nouveau, ce qui est utile encas d'erreur par exemple (voir la figure suivante).

Les commentaires indsirables peuvent tre conservs ou

effacs

RglagesEn plus des paramtres s'appliquant tous les commentaires que nous avons dj parcouru, il est possible de filtrer certainstextes contenus dans les commentaires pour les empcher d'tre publis sans votre approbation. Dans le champ Modration decommentaires , vous pouvez choisir un ensemble de mots qui dclencheront la mise attente d'un commentaire ayant ce contenudans son texte. Il n'est pas obligatoire de mettre des mots complets, c'est--dire que Press bloquera les commentairescontenant WordPress , Pression ou encore Presse .



Faites bien attention ne mettre qu'un mot bloquant par ligne dans la zone de texte.

Vous pouvez faire de mme dans le champ Liste noire pour les commentaires , la diffrence que les commentairescorrespondant l'un des mots choisis seront immdiatement marqus comme Indsirables , sans avoir tre modrs.

Les utilisateursGestion des utilisateurs

Toute la gestion des utilisateurs s'effectue par le menu Utilisateurs de l'administration qui vous permet de grer l'ensembledes utilisateurs existant, d'en crer de nouveaux et d'diter votre propre profil. Vous pouvez donc lister tous les utilisateurs devotre site (voir la figure suivante).

Liste des utilisateurs inscrits sur

votre site

Les rles

chaque utilisateur est associ un rle dfinissant l'ensemble des droits qui lui sont accords, c'est--dire la liste des actionsqu'il pourra effectuer dans l'interface d'administration du site.

Administrateur : c'est le rle qui accorde tous les droits et que vous avez par dfaut en tant que crateur du site ;diteur : il permet de publier et diter l'ensemble des articles du site, mme celles qui ne lui appartiennent pas ;Auteur : l'auteur peut publier et diter ses propres contenus ;Contributeur : il peut crer ou diter des articles et des pages lui appartenant, mais ne peut pas les publier (il lui fautdemander un diteur ou un administrateur de le faire pour lui) ;Abonn : il peut uniquement accder au panneau d'accueil de l'administration et grer son profil.

Pour modifier le rle d'un utilisateur, cliquez sur son nom dans la liste des utilisateurs. Vous pouvez alors faire votre choix grce une liste droulante. Notez que vous ne pouvez pas changer votre propre rle (voir la figure suivante) !



Attribution des rles aux

utilisateurs

La gestion des droits est un sujet important pour la scurit de votre site. Il faut toujours faire attention n'accorderque les droits strictement ncessaires un utilisateur. vitez donc de crer un profil administrateur si la personne quil'utilisera n'a besoin que d'crire des articles.

Cration d'utilisateur

Vous pouvez crer un nouvel utilisateur en allant dans le sous-menu Ajouter . Cette interface permet de dfinir le nom dunouvel utilisateur, son rle et quelques informations personnelles optionnelles.

Il est aussi possible d'autoriser la cration de comptes utilisateur pour n'importe quel visiteur du site. Pour cela, dans le menu Rglages > Gnral , il suffit de cocher la case Tout le monde peut s'enregistrer et de dfinir le rle par dfaut de cesutilisateurs.

Il est peu probable que vous ayez besoin de cette option, mais il est bon de savoir qu'elle existe. En revanche, si vousl'utilisez, faites attention ce que le rle par dfaut des utilisateurs soit le plus faible possible (abonn), sinon vousvous exposez des modifications du contenu de votre site par n'importe qui voulant s'enregistrer !

Les commentaires permettent aux visiteurs de s'exprimer sur les publications.L'administrateur peut modrer les commentaires avant et aprs leur publication.Plusieurs personnes peuvent contribuer au site, ventuellement avec des droits diffrents.



Modifier l'apparenceL'identit de votre site passe avant tout par le thme graphique, c'est--dire l'ensemble des caractristiques visuelles de votresite, comme les couleurs, la taille des textes, les images de fond ou la disposition des blocs sur la page. Lorsque vous avezinstall WordPress, vous navez pas eu la possibilit de choisir le thme graphique utilis, et pour cause : il est install par dfautet cest ensuite vous den trouver un autre et de le changer si vous le voulez. Voyons tout de suite comment procder.

Changer de thmeLe choix d'un thme se fait lui aussi dans l'interface d'administration, on y accde par le menu Apparence > Thmes . Ici vousaurez probablement un ou deux thmes prinstalls et que vous pouvez activer ou dsactiver loisir (voir la figure suivante).

Liste des thmes installs

Essayons de modifier le thme actuellement utilis (ici, Twenty Thirteen ) par le thme Twenty Twelve . Cliquez sur le lien Activer , puis rafrachissez votre site : la nouvelle apparence est d'ores et dj mise en place, il n'y a rien de plus faire (voir lafigure suivante) !

Le thme actif a t modifi



Et si je veux essayer de nouveaux thmes non fournis avec WordPress ?

Il est en effet possible d'installer des thmes crs par la communaut de diverses faons : en utilisant l'interface d'administrationou en tlchargeant les fichiers vous-mme.

Ajouter un thme via l'administration

Pour ajouter un thme directement depuis l'interface, choisissez l'onglet Installer des thmes en haut de la page de slectiondes thmes. Ici, vous pouvez rechercher des thmes par mots-cls, envoyer un fichier .zip contenant un thme pralablementtlcharg, ou encore parcourir les derniers thmes ajouts par les crateurs (voir la figure suivante).

Nouveau thme tlcharger

Lorsque vous parcourez une galerie de thmes (c'est--dire en faisant une recherche ou en parcourant les derniers thmes mis jour) vous avez la possibilit d'avoir un aperu du rsultat final du thme par le lien Aperu en dessous de chaque miniature.En cliquant sur le bouton Installer maintenant , WordPress va tlcharger automatiquement le thme demand et celui-ci seraensuite disponible dans la liste des thmes.

Utiliser un thme tlcharg

Dans le cas o vous auriez tlcharg un thme sparment, par un exemple directement sur wordpress.org ou sur un siteproposant des thmes WordPress, vous pouvez installer ce thme manuellement en plaant les fichiers dans l'arborescence duCMS.

Essayez pour l'exemple d'installer le thme expound propos sur le site officiel de Wordpress, dans l'onglet Themes .Dcompressez le fichier .zip rcupr et placez le dossier expound dans le rpertoire wordpress/wp-content/themes/de votre installation. Si vous affichez nouveau la liste des thmes dans l'interface d'administration, Expound est maintenantslectionnable pour une utilisation sur votre site (voir la figure suivante) !



Les thmes peuvent tre installs

manuellementAjouter des widgets

Les widgets (ou composant d'interface graphique en franais) sont des petits blocs ajouter sur les pages de votre site. Ilsfournissent une information ou une fonctionnalit spcifique aux visiteurs. Par exemple, il peut s'agir de l'heure, d'un calendrier,du bulletin mto, de mini-jeux C'est un moyen simple de rajouter du contenu dynamique, toujours sans avoir besoin demodifier le code du site.

Placer un nouveau widget

Dans le menu Apparence > Widgets, on retrouve au centre de la page l'ensemble de tous les widgets disponibles sur lesite, et sur la droite, les diffrentes zones de votre thme pouvant contenir lesdits widgets. En effet, les widgets ne peuvent pastre placs n'importe o dans une page, ils ont besoin qu'une (ou plusieurs) zone du thme graphique utilis soit conue pour enrecevoir. Par dfaut, WordPress a un certain nombre de widgets livrs sans que vous ayez besoin de les installer. Il estnanmoins toujours possible d'en rajouter au travers de plugins, que nous verrons plus tard comment rcuprer.

Pour ajouter un widget dans une zone spcifique du site (qui est dtermine par le thme utilis), il vous suffit de le glisser-dposer de la zone centrale vers la Zone principale (ce nom peut varier en fonction du thme utilis) sur la droite. Ajoutonspar exemple le widget Nuage de mots-cls par cette mthode (voir la figure suivante).



Assigner le widget une zone spcifique

Une fois qu'un widget est plac dans une zone de widgets, vous pouvez diter ses proprits, qui dterminent soncomportement sur les pages de votre site. Ajoutons donc le titre Mots-cls et choisissons la taxinomie Mots-cls , quipermet d'afficher une courte liste des mots-cls les plus utiliss pour marquer les articles que vous avez publis. L'autre option, Catgories , propose le mme affichage mais pour les catgories d'articles. Cliquez donc sur Enregistrer , puis rafrachissez lapage d'accueil du site ; le nouveau widget doit apparatre dans la zone choisie (avec le thme Twenty Thirteen et la zone Principale , ce sera le pied-de-page), cot de ceux dj prsents (voir la figure suivante).

Le pied de page affiche le widget

fraichement ajout

Dsactiver un widget



Pour retirer un widget, rien de plus simple : il suffit de cliquer sur le lien Supprimer . Cela retirera le widget de la zone danslaquelle il se trouvait et supprimera les rglages appliqus (voir la figure suivante).

Suppression du widget

En revanche, vous pouvez aussi choisir de ne plus afficher un widget, tout en conservant les options que vous aviez choisies,comme le titre par exemple. Pour cela, vous pouvez dplacer le widget en question dans la zone Widgets dsactivs situe enbas de la page de gestion des widgets. Vous pourrez alors replacer le widget sur votre site plus tard avec les mmes rglages.

L'apparence du site est dtermine par le thme choisi.De nouveaux thmes peuvent tre tlchargs depuis la bibliothque officielle.Les widgets offrent des fonctionnalits supplmentaires dans les zones priphriques de chaque page.



TP : Crez vos premires pagesAfin de pratiquer les notions prsentes jusqu'ici, je vous propose un exercice d'application consistant crer diffrentscontenus au travers de l'interface d'administration. Nous allons donc crer l'bauche d'un blog avec quelques lments de base.Ce sera ensuite vous de poursuivre ce travail au gr de votre imagination !

Prsentation de l'exerciceConsignes

Ce TP ne devrait pas vous poser beaucoup de problmes. Je vous donne ici les lignes directrices afin de parcourir nouveau lesfonctionnalits principales que nous avons vues jusque l, pour raliser le contenu de votre site.

L'objectif sera donc de crer votre premier article. Je vous propose de suivre, dans l'ordre les lments suivants : installer un thme ;crer un article ;crer des catgories, dont Le blog ;crer une page de prsentation personnelle ;crer un menu comprenant trois lments ;installer des widgets.

Tout d'abord, commencez par installer un thme spcifique. Dans mon cas, jai choisi Base WP , mais n'hsitez pas faire unchoix diffrent selon vos gots. Vous pourrez ensuite crer un premier article de prsentation de votre blog, similaire la figuresuivante. Tous les lments de mise en forme sont disponibles dans lditeur de texte riche. Nhsitez pas explorer lespossibilits quil offre et rajouter du contenu supplmentaire ! Vous devrez au minimum intgrer une liste puces, un lien versune autre page du site, une image et le formatage du texte (par exemple avec des lments en gras ou italique).



Votre premier article doit attirer l'oeil !

Ensuite, vous devez crer des catgories, dont Le blog .

Une fois les catgorie cres, vous devrez crer une page de prsentation personnelle qui sera rattache la catgorie Le blog. Rattachez aussi votre premier article cette catgorie.

Le menu doit donc comprendre (comme sur la figure suivante) :la page daccueil faisant le listing des articles publis ;la page de prsentation personnelle ;un lien vers la catgorie Le blog .

Le menu du blog

Enfin, je vous demande d'utiliser, comme sur la figure suivante, les widgets suivants :le calendrier ;la barre de recherche ;les catgories ;les mots cls.

Vous aurez probablement des widgets dj installs avec votre thme, il faudra donc les supprimer s'ils sont inutiles. N'oubliezpas que vous pouvez toujours les rajouter plus tard si vous en prouvez le besoin (voir la figure suivante).



La barre latrale contenant les widgets

Avant de passer la correction, vrifiez bien que vous avez ajout tous les lments demands ci-dessus. N'hsitez pas vousrfrer aux chapitres prcdents si vous ne retrouvez pas une fonctionnalit prcise.

tout de suite pour la correction !Correction

Si vous avez bien suivi le cours jusqu'ici, vous devriez n'avoir rencontr que peu de problmes pour dbuter sur votre blog.Nous allons reprendre ensemble les points principaux qui ont pu vous poser quelques difficults.

Le thme

Le thme est gnralement le point de dpart pour votre site puisqu'il dtermine l'identit de celui-ci. Les images de prsentationdu TP on t prises sur le thme Base WP , que vous pouviez utiliser en utilisant la fonctionnalit de recherche de thmesprsente dans la chapitre ddi ce sujet.

La page de prsentation personnelle



C'est le premier contenu par lequel vous pouviez commencer, tant donn qu'il fallait ensuite crer un lien vers cette page survotre premier article. Je n'ai pas pos de critre de ralisation particulier ici, vous tiez donc assez libre. Pour ajouter cette page la catgorie Le blog , vous pouviez passer par le formulaire sur la droite de l'diteur qui permet de crer et assigner la catgorie(voir la figure suivante).

Crez et slectionnez la catgorie assigner la page

L'article d'introduction

Comme je vous l'ai dit, cet article contenait plusieurs lments insrer avec l'diteur de texte de WordPress : une liste puces,une image et un lien.

Pour insrer une liste puces, il suffit de cliquer sur cette petite icne (

785326 Propulsez Votre Site Avec Wordpress

Documents

Transcript of 785326 Propulsez Votre Site Avec Wordpress