Créer un site avec WordPress au-delà du simple blog #4 : réglages du thème principal

WordPress est en place mais votre site ressemble encore à un blog.
Vous avez installé le thème Tempera et l’extension qu’il propose.
Vos êtes parés à mettre les mains dans le cambouis ou presque.

Tous les réglages suivants se passent dans Apparence > Tempera Settings.

Pour commencer, il faut définir un ton, une couleur pour l’ensemble de votre site : il faut cliquer sur JEUX DE COULEURS puis choisissez l’un des modèles et valider avec le bouton IMPORTER UN JEU DE COULEURS.

Jeux de couleurs
Les jeux de couleurs disponibles dans Tempera

Pour le reste des réglages, il faut les prendre les réglages dans l’ordre.

  • Mise en page : choisissez comment se présenteront les pages de votre site, sauf la page principale (définie ailleurs). Je vous conseille de ne pas surcharger donc personnellement je préfère donc le 1er ou le 2ème choix (une colonne à droite, le visiteur commencera donc par lire les informations principales à gauche/au milieu, la colonne sera un petit plus moins important).
    Laissez la répartition sur la réglette en dessous et vérifiez que Adaptable à tous les écrans est bien sur Activer et que la case Allow zoom adjacente est cochée.
  • En-tête : rien de compliqué, c’est ici que vous sélectionnez une image d’en-tête, un logo ou un favicon si vous en avez. Si vous n’avez aucun des trois, ce n’est pas important.
  • Page de présentation : c’est ici que tout se décide pour la page d’accueil donc il faut bien sûr Activer celle-ci.
    L’option juste en dessous permet d’afficher vers le bas de la page d’accueil les derniers billets que vous écrivez si vous décidez de bloguer. Si vous présentez juste votre activité, Désactiver, sinon Activer en choisissant le nombre de billets affichés avec Show (il suffit au visiteur de cliquer sur un bouton pour en afficher plus) et sur combien de colonnes avec Posts per row (je préfère 2).
    Laissez les Réglages du slider (le diaporama de l’accueil) par défaut.
    Réglez ensuite les images affichées dans le Diaporama (oui, le slider des options précédentes, vous noterez la cohérence de la traduction) en choisissant Vos slides dans le menu déroulant puis vous pouvez choisir jusqu’à 5 images qui défileront, avec, pour chaque image, un titre, un texte et un lien hypertexte. Personnellement je laisse tout vide, car je trouve plus intelligent de choisir directement des images parlantes. Si vous voulez utiliser moins de 5 images, ne mettez rien dans les slides au-delà de vos images. Vos images devront faire la taille définie au début de l’option précédente, par défaut 1150 x 400, je trouve que c’est un bon choix et de toute façon le diaporama s’adapte sur les écrans mobiles.
    Le dernier groupe d’options Colonnes page de présentation concerne les pages que vous voulez mettre en avant via une vignette sous le diaporama. Avec Colonnes par rang, choisissez le nombre de vignettes (comprendre le nombre de pages que le visiteur verra d’emblée présentées, je conseille 3 pages mais vous pouvez grimper à 4). Notez la taille des images que vos devrez sélectionner (201 x 318 par défaut) et traduisez le texte en dessous qui est un lien pour afficher la page.
    Enfin, les options en Extras permettent d’afficher un titre et texte entre le diaporama et les pages mises en avant, HTML possible, pensez au <br />.  Vous pouvez également Cacher les zones inutiles.
    C’est fini pour la page de présentation !
  • Les réglages Texte et Couleurs sont assez explicites pour que vous les régliez vous-mêmes, moi je laisse tout par défaut car c’est prédéfini par rapport au jeu de couleurs choisi précédemment, mais rien ne vous empêche de tout personnaliser.
  • La partie Graphique n’a pas beaucoup de réglages donc laissez tout par défaut pour débuter.
  • Articles et pages : les options touchent aussi bien les billets que les pages. Laissez la barre de métadonnées en haut et ne gardez seulement pour les billets les informations Auteur, Date et Catégorie, rien pour les pages et laissez les 3 options suivantes en Cacher.
    Le but du site vitrine est aussi de rester propre/épuré.
  • Extraits des articles : traduisez le texte pour Texte “Continuer à lire” et ne changez rien d’autres.
  • Le reste des options est aussi explicite, notamment pour les réseaux sociaux.

Il faut ensuite SAUVEGARDER LES MODIFICATIONS et vous aurez PRESQUE fini.

Il ne reste plus qu’à définir les pages que vous mettez en avant sous le diaporama.
Direction Apparence > Widgets et trouvez l’emplacement Colonnes page de présentation pour y glisser-déposer autant de widgets Cryout Column que de pages que vous aller mettre en avant. Ce nombre a été défini dans les options de la Page de présentation (Colonnes par rang).
Pour chaque widget, vous allez définir la vignette, le titre, le texte d’accroche et le lien vers la page.
Si jamais vous avez défini un design général des pages avec une colonne, c’est ici aussi que vous allez placer d’autres widgets.

Et voilà, cette fois-ci les réglages pour Tempera terminés.
Commencez à remplir vos pages et à sélectionner vos images puis tester l’aspect général du site en fonction de vos modifications.
N’oubliez pas non plus de régler vos menus (haut, principal et bas de la page).
Rassurez-vous, le plus dur est passé.

Je vous mets une galerie des options du thème, histoire que vous ayez un peu de support…

13 réflexions sur “Créer un site avec WordPress au-delà du simple blog #4 : réglages du thème principal”

  1. Je n’ai jamais vu toutes ces options pour un thème ! C’est nouveau ? C’est sympa ce choix proposé, ça évite de mettre les mains dans le code pour changer des choses simples 🙂

    1. En fait ça dépend des thèmes mais là je reconnais qu’ils ont poussé loin pour un thème gratuit.
      On trouve ça en général sur du payant…

  2. Ping : Créer un site avec WordPress au-delà du simple blog #5 : les extensions | Parigot-Manchot

  3. Ping : Wordress 4 | Pearltrees

  4. Bonjour,
    Il est dommage de ne pas trouver en bas d’article, les articles similaires, pour trouver les articles d’avant et après celui ci
    Créer un site avec WordPress au-delà du simple blog #4

    Vu que le sujet traite de la création de site, il faut bien choisir le bon format des images par exemple, si les images n’ont pas de transparence, on ne choisit pas png mais jpg car plus léger, le png remplace surtout le gif, si on veut une image avec une transparence.
    Vous pouvez tester, prenez la même image, enregistrer une fois en png et une autre fois en jpg, vous verrez que jpg sera plus léger.
    Puis un autre point, bien nommer les images, pas d’accent , pas de caractères spéciaux, les mots d’arrêts inutiles comme le, la, une, une, en, etc..ne pas dépasser cinq mots, préférer les séparer avec les traits d’unions -, plutôt qu’ avec les underscores _, par exemple
    tempera-mise_en_page.png il faut mieux mettre tempera-mise-page. et choisir le format jpg
    c’est les lignes Titre, Texte alternatif et description qu’il faut bien remplir avec les mots d’arrêts.
    Lire l’article sur l’optimisation des images pour le SEO de Diane Bourque, spécialiste de WordPress.
    http://dianebourque.com/comment-optimiser-vos-images-dans-wordpress-pour-le-referencement-et-google/

    Wp est bien codé, un bon référencement naturel, mais il faut ajouter un plugin SEO pour améliorer encore et prendre les bonnes habitudes, respecter la longueur des titres d’articles, la longueur des descriptions, avoir un sous-titre ou un chapo en H2, puis avoir un H3 dans l’article, des mots en gras, en italique, image qui a le mot-clé de l’article, etc..

    Utiliser les bons permaliens, lire cet article http://www.geekpress.fr/url-rewriting/
    si vous voulez bien référencer votre site
    Voici deux exemples de structures optimisées pour le référencement avec l’article par défaut « Bonjour tout le monde » :

    /%category%/%postname% devient exemple.com/non-classe/bonjour-tout-le-monde
    /%postname%-%post_id% devient exemple.com/bonjour-tout-le-monde-1

    Juste vous conseillez le thème Tempera mais vous ne l’utilisez pas, pourquoi ?
    Pourquoi prendre Twenty Thirteen?
    Bonne continuation

    1. Merci pour ces remarques.
      Alors pour les remarques pour ce blog personnel tout d’abord :
      – j’écris d’abord pour moi, ensuite pour les autres. Donc le SEO… je n’en vois pas l’intérêt. Je laisse ça se faire tout seul.
      – le coup du PNG/JPG, pour quelques images, à l’heure de la fibre… je m’excuse auprès de mon public de lecteurs en 56k mais vu le JS à charger d’emblée, ce ne sont pas les images PNG ou JPG qui se chargeront plus vite ou moins vite sur la globalité. Je note la remarque pour les sites tiers dont je présente la construction dans cette série d’articles.
      – oui, j’avais pensé à faire un sommaire, disons que vu le nombre de lecteurs potentiels… j’ai eu la flemme, et il me semble que chaque article contient un lien vers le précédent. Sinon il y a le moteur de recherche 😉 mais c’est vrai que je devrais faire un petit rappel genre petit sommaire.
      – pour le nommage, j’ai ma propre logique d’où l’alternance de “-” et “_”. Pour les titres alternatifs et descriptions, je n’aime pas le rendu sur l’image quand elle s’affiche dans le pop Lightbox donc je n’en mets pas, ce qui, je le reconnais, est contraire aux principes d’accessibilité.
      – pour l’URL Rewriting, voir la remarque sur le SEO. J’aime connaître la date d’un billet, la connaître par l’URL est une bonne chose pour moi donc j’applique ça ici.
      – je conseille Tempera pour un site “statique” mais pas pour un blog. Trop lourd je trouve. Et après de nombreuses recherches, Twenty 13 est le seul thème qui me plaît : une grande image avec titre/slogan dessus, colonne simple et 100 % français, avec un minimum de configuration. J’ai des goûts esthétiques… discutables (mon seul fond d’écran Windows XP a toujours été le colline verte) mais bon… je trouve les blogs sans image header pas très attirants.
      Pour l’application de ces remarques pour les sites que j’ai créé ou bien les sites que je créerai… vu qu’il s’agit d’une activité annexe, je ne veux pas m’investir “plus que ça”.
      J’ai créé un site d’école, que les gens trouvent sur Google avec “école” + nom + ville du premier coup.
      Pour la suite, j’envisage d’explorer l’extension de Yoast, avec les réglages par défaut.

      Encore merci pour ces remarques.

      1. Bonjour,
        mes remarques étaient juste sur le fait que je trouve vos articles intéressants, et qui méritent d’être vu, c’est pour ça que je me suis dit qu’avec un SEO amélioré avec le plugin Yoast , plus de visiteurs pourrait visiter votre site.
        -Et toujours dans le but d’augmenter le nombre de visiteurs, je parlais pour les images, leur format jpg/png, les moteurs de recherche référencement mieux les pages légères, diminuer le poids des images, et à prendre en considération, c’est pour ça que l’on trouve des plugins comme EWW Image Optimizer, WP Smush, pour alléger les images, je ne pensais pas que la fibre était si répandu, moi je suis en ADSL+2, pas de fibre pourtant je suis ne région parisienne.
        – je comprends pour l’alternance de « – » et « _ », je le faisais avant, maintenant j’ai pris l’habitude d’utiliser juste le tiret, plus simple. titre alternatif est important, déjà si votre image disparaît, on le voit, il sert à référencer vos images, dans les standards HTML c’est même une obligation de l’avoir cette balise, puis on n’y pense pas assez mais les non voyants sont aussi présent sur internet, grâce à la balise Alt (texte alternatif) ils savent qu’il y a une image et à quoi elle correspond.
        Après il faut voir le plugin lightbox utiliser, si on ne peut pas désactiver l’apparition de Alt et Descrption.
        Moi j’utilise ce plugin https://fr.wordpress.org/plugins/responsive-lightbox/screenshots/
        si je voulais dans les réglages, je mets aucun à Single image title et Titre l’image de galerie et j’ai juste l’image comme ça, moi j’ai mis Titre de l’image.
        – pour les permaliens, j’aime voir la date d’un billet aussi, mais dans le corps de l’article, là je vois avec les autres entry-meta, je n’ai pas besoin de la voir dans l’url, puis avec Yoast, on peut choisir si on veut que l’information apparaissent les moteurs de recherche.
        – D’accord je comprends pour vous Tempera est plus ciblé site que blog, après les goûts et les couleurs, je ne discute, chacun a droit d’avoir les siens, moi je préfère Twenty14.
        -le plugin Yoast ne doit pas être utilisé sans réglage, autant, ne pas le mettre alors, vous pouvez suivre le recommandations de ce site
        https://wpmarmite.com/wordpress-seo/

        Voilà c’était juste pour votre site soit plus connu, c’est tout, après chacun fait à sa guise.
        Bonne continuation avec vos excellents billets.

        1. Ok, je pensais que tu parlais presqu’uniquement du thème de l’article, pas de mon blog.
          Le fait de prendre du PNG ou du JPEG est un hasard à chaque fois, je ferai attention les prochaines fois 🙂
          Pour le reste…

          1. Bonjour,
            non je ne peux pas parler du thème, je ne connais pas. Mon message ne voulait que mettre un plus pour votre site, “Articles Similaires” ne bas d’article est un plus, on peut l’avoir avec les plugins YARPP (Yet Another Related Posts Plugin ) ou Yuzo – Related Posts, une vidéo pour ce dernier plugin
            https://www.youtube.com/watch?v=4L0AJtI5uz8

            Pour le reste, c’est surtout au niveau permalien, il faut mieux installer Yoast et dans Titres & Meta, activer “Date dans la prévisualisation de l’extrait” ainsi sur les moteurs de recherche la date apparait

          2. Je teste “Yuzo”, on verra le résultat 🙂
            EDIT : bon, après tests et résultats laids à l’affichage, je trouve ça… laid à l’affichage et sans intérêt.
            Déjà que j’ai un mal à fou à mettre des images à la une potable… ça donne une idée de mon niveau, sachant qu’en plus j’aime les titres à rallonge, ce qui n’est pas très lisible dans le cas d’extensions comme YUZO ou YARPP.

  5. Bonjour à tous,

    Je pense etre tombé sur le bon blog,

    J’ai creer un site grace a Tempera et je me retrouve face à un probleme:

    changer la description qui apparait sur Google lorsque je cherche mon site, on y retrouve un descriptif du thème tempera.

    J’ai donc telechargé divers SEO : all in one SEO pack et Yoast SEO,

    essayé de divers façon, impossible de changer cette description

    HELP I NEED SOMEBODY !!

      1. Bonjour Gilles,

        Merci pour ta réponse, je suis déjà allée voir, ce n’est pas ca 🙁

        En plus il y a une faut de frappe dans le slogan et a aucun moment je ne retrouve cette faute dans mes réglages (tempera – wordpress – SEO – OVH) un mystère .. qui j’espère va se résoudre !!

         

Répondre à Gilles Annuler la réponse

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Retour en haut