8. Choisir un thème et le personnaliser

Maintenant que nous avons fait le tour de l'interface d'administration de WordPress et que nous savons comment ajouter des articles, des pages et des médias, il est temps de nous occuper de l'apparence du site.


Cliquons sur "Apparence" puis "Thèmes" :

WordPress - Thèmes par défaut

Nous voyons que par défaut, c'est le thème Twenty Nineteen qui est activé, et que deux autres thèmes sont disponibles.

Nous voyons également un bouton "Ajouter", et, en cliquant dessus, nous pouvons constater qu'un vaste choix de thèmes nous sont proposés pour personnaliser l'apparence de notre site.

Tout l'enjeu ici sera de choisir LE thème le plus adapté à notre site. Il est vraiment important de choisir avec soin le design général de notre site internet, pour qu'il soit cohérent avec le message que nous voulons faire passer. De plus, il faut savoir que mieux nous le choisirons, moins nous aurons de travail par la suite pour personnaliser notre site.

Pour nous aider à faire ce choix, plusieurs onglets sont disponibles : "Mis en avant", "Populaires", "Derniers en date", "Favoris", et celui auquel nous allons nous intéresser ici : "Filtre de fonctionnalités".
Cliquons dessus pour voir les choix qui s'offrent à nous :

WordPress - Filtre de fonctionnalités pour les thèmes

Nous voyons que nous pouvons filtrer les thèmes en fonction de la catégorie du site (blog, e-commerce, etc.), en fonction également des fonctionnalités dont nous allons avoir besoin (le site doit-il être optimisé pour l'accessibilité ? Est-ce que nous voulons pouvoir personnaliser le logo ou l'arrière-plan, etc.), et nous pouvons enfin filtrer les thèmes en fonction de l'arrangement de notre contenu (est-ce que nous voulons une colonne, deux colonnes, trois colonnes ? Est-ce que nous voulons une grille, une barre latérale à gauche ou à droite ?).
Vous comprendrez donc que pour bien choisir son thème il faut d'abord avoir bien pensé la conception de son site.

Dans le cas du site pour l'Association Sportive 2.0, je veux pouvoir personnaliser le logo et l'arrière-plan, et je veux également également une colonne latérale à gauche pour pouvoir y placer des widgets tels qu'un calendrier pour les prochaines manifestations, etc.

Bien évidemment de votre côté je vous laisse choisir les filtres que vous voulez appliquer à votre propre site 😉

Vous avez fait vos choix ? Cliquons sur "Appliquer les filtres".
WordPress nous propose alors une sélection de thèmes qui répondent à nos exigences et pour chacun d'entre eux nous pouvons soit l'installer directement, soit afficher un aperçu pour se faire une meilleure idée.

N'hésitez à en essayer plusieurs ! L'important est que le thème que vous choisissez réponde en grande partie à vos attentes, mais ne vous attendez pas non plus à ce qu'un thème corresponde à 100% à vos besoins. Ce n'est pas totalement impossible, mais hautement improbable ! Prenez donc également en compte le niveau de personnalisation du thème : si le thème offre de nombreuses possibilités, alors il sera assez simple, ensuite, d'apporter les modifications désirées.

D'autres critères sont à prendre en compte dans le choix du thème : le prix, et la fiabilité de celui-ci. N'hésitez donc pas à faire quelques recherches sur internet, notamment sur le répertoire de thèmes de WordPress. Vous constaterez d'ailleurs que vous accédez ici aux mêmes fonctionnalités de recherche d'un thème, et que vous pouvez directement les télécharger ici.

Cliquons sur un thème (peu importe lequel) pour voir les informations auxquelles nous pouvons accéder : 

Entre autres informations, nous pouvons voir une description, la version actuelle du thème, la date de sa dernière mise à jour, le nombre d'installations actives, d'éventuelles évaluations laissées par d'autres utilisateurs. Autant d'éléments qui peuvent nous guider dans notre choix : par exemple, un thème dont la mise à jour serait assez "ancienne" ne serait probablement pas tout à fait compatible avec la version de WordPress que nous utilisons.


Une fois votre thème choisi, cliquer sur "Installer" puis "Activer".

Si vous faites le choix de télécharger un thème depuis une autre source que l'interface et que vous souhaitez l'ajouter, il vous faudra alors cliquer sur "Téleverser un thème", puis uploader le zip : Téléversement de thème
 

Allons voir ce que cela donne :

WordPress - Nouveau thème activé

Il y a encore du travail à faire, mais si le thème choisi vous convient, c'est parfait ! Nous allons pouvoir passer à la personnalisation. Retournons sur l'administration des thèmes, et cliquons sur "Personnaliser" :

WordPress - Personnalisation du thème
En fonction du thème que vous aurez choisi, ce panneau latéral pourrait être quelque peu différent. Néanmoins, nous retrouvons les mêmes points principaux :

  • L'identité du site : pour nous permettre de modifier le logo, titre du site, slogan, et l'icône (favicon, celle qui, par exemple, s'affiche dans l'onglet du navigateur) ;
  • La couleur de la police et d'arrière-plan ;
  • Les réglages de l'en-tête : par exemple, dans le cas du thème que j'ai choisi, je peux modifier l'image située au-dessus du titre du site ;
  • Image d'arrière-plan, si nous souhaitons avoir une image plutôt qu'un fond de couleur ;
  • Les menus : en fonction du thème choisi, vous pourrez en ajouter un ou plusieurs. Pour chaque menu, vous pourrez définir les pages, articles, catégories, que vous voulez pouvoir y ajouter. Par exemple, de mon côté, je ne peux ajouter qu'un seul menu, dans lequel je décide d'ajouter automatiquement toutes les pages de 1er niveau (donc, la page d'accueil et d'à propos).
  • Lew widgets : ici aussi, les emplacements disponibles pour les widgets dépendent du thème choisi. Il peut y en avoir dans la(es) barre(s) latérale(s), dans le header, le footer, etc. Pour chacun de ces emplacements, nous pouvons choisir un ou plusieurs widgets disponibles, les modifier ou les retirer de l'emplacement. Pour le site de l'Association Sportive 2.0, je décide d'affiche une barre de recherche et une liste des 5 derniers articles dans la barre latérale : Paramétrages des widgets
  • Les réglages de la page d'accueil : voulons-nous y afficher les derniers articles ou une page statique, c'est-à-dire une page que nous aurons conçue spécifiquement pour être la page d'accueil ?
  • Et enfin, le CSS additionnel : je n'approfondirai pas ce point ici. En effet, il requiert des connaissances en CSS, et sera traité dans un prochain cours.
  • Lorsque le thème propose un modèle freemium, on retrouve également un onglet spécifique, nous incitant à acheter la version payante. En fonction des besoins, cela n'est pas forcément indispensable, la version gratuite proposant en général des possibilités de personnalisation suffisamment complètes pour des besoins "classiques".

 

De mon côté, je vais modifier le logo, ainsi que le favicon du site. Je vais également changer l'mage d'en-tête, et paramétrer la page d'accueil comme étant une page statique. A vous de voir les modifications que vous voulez apporter sur votre propre site !

Une fois les modifications apportées, pensez bien à cliquer sur "Publier" 😉

La plupart des paramètres accessibles ici le sont également depuis l'interface d'administration, dans "Apparence".

Voilà ce que donne l'en-tête du site après personnalisation :

En-tête site WordPress
Avant de passer à la suite, faisons un peu de ménage : en effet, nous avons plusieurs thèmes installés, mais non activés. Ils ne nous servent donc à rien, à part alourdir notre site. Supprimons-les !

Au survol du thème, cliquons sur "Détails du thème" :

Détails du thème
 

Puis sur "Supprimer", en bas à droite de la fenêtre :

Supprimer un thème WordPress
 

A présent que nous avons commencer à personnaliser l'apparence de notre site, il est temps de passer à l'étape suivante : ajouter des fonctionnalité. Cela va se faire assez simplement, grâce aux plugins.