CMS – Création d’un site CMS en mode SaaS avec wordpress.com

 

LEÇON PRATIQUE

 

Pour créer un site comme ceci : https://webmestre8.wordpress.com/

 

Création du compte et initialisation du site

  • Ouvrir fr.wordpress.com
  • Cliquer "Commencer"
  • Choisir le type d'affichage (par exemple "Créer un Portfolio")
  • Choisir le thème (par exemple "Dyad") ou cliquer sur "Ignorer pour le moment" en bas de page
  • Fournir un nom pour le site
    • le nom fourni sera utilisé comme un sous-domaine (nomdusite.wordpress.com)
  • Choisir l'offre gratuite
  • Fournir une adresse mail valable et à laquelle vous avez accès dans l'immédiat
  • Fournir un mot de passe (par souci de sécurité ne pas utiliser le mot de passe de votre compte mail !)
  • Cliquer le bouton pour créer le site (il peut y avoir une étape de validation du compte mail)
  • A ce point le site est créé et en ligne mais quasi-vide

 

Il y a plusieurs façons de visualiser/gérer son site

  • comme internaute anonyme :
    • il faut être déconnecté de son compte wordpress
    • ouvrir https://nomdusite.wordpress.com/
  • comme gérant du site via son interface "interne" :
    • il faut être connecté à son compte wordpress
    • ouvrir https://nomdusite.wordpress.com/
    • choisir "Mes Sites" / "Tableau de bord"
    • on arrive sur cette page : https://nomdusite.wordpress.com/wp-admin/
  • comme gérant du site via son interface "externe" :
    • il faut être connecté à son compte wordpress
    • ouvrir https://wordpress.com/
    • choisir "Mes Sites"
    • cliquer "Afficher le site"
    • on a la possibilité d'afficher le site en mode Bureau / Tablette / Téléphone

 

Choisir et configurer un thème (si ce n'est pas encore fait)

  •  Le thème détermine comment se présente les informations du site : où et comment s'affichent les images, où et comment s'affichent les textes
  • Cliquer sur "Mes sites" en haut à gauche
  • Cliquer sur "Thèmes" dans le menu
  • Dans la barre de recherche taper Dyad et lancer la recherche
  • Cliquer sur le premier thème qui apparaît
  • Cliquer sur "Activer ce design" puis "Personnaliser ce design"
  • Fournir un titre pour le site (via le lien "identité du site")

 

Modifier et/ou ajouter un article

  • Les articles peuvent s'afficher en tant que version complète (page web entière) ou en tant que version sommaire dans une liste (à l'accueil par exemple)
  • De base il y a déjà un article dans le site avec titre "Premier article de blog"
  • Pour modifier cet article cliquer sur "Mes sites" en haut à gauche, puis "Articles", puis cliquer sur "modifier"
  • On peut modifier le titre et le texte de l'article mais pour ajouter des images il faut d'abord établir des images dans la bibliothèque d'images du site
  • Pour ajouter un article, cliquer sur "Mes sites" en haut à gauche, puis "Articles" / bouton "Ajouter"

 

Ajouter des images dans la bibliothèque d'images du site

  • la bibliothèque d'image est un panier d'images depuis lequel on peut piocher des images pour ajout dans les articles / pages du site
  • cliquer sur "Mes sites" en haut à gauche
  • cliquer sur "Tableau de bord"
  • cliquer sur "Médias" / "Bibliothèque"
  • on devrait voir un écran sans images (car la bibliothèque est vide pour l'instant)
  • Cliquer sur "Ajouter"
  • Choisir une ou plusieurs images à ajouter dans la bibliothèque depuis le disque local
    • pour des images de diaporama d'accueil (voir ci-dessous) choisir des images avec dimensions 1800 x 720px
  • on devrait voir un écran avec les nouvelles images
  • ajouter aux moins 2 images (pour pouvoir effectuer les opérations ci-dessous)

 

Ajouter un article avec "image à la une" et avec des images dans l'article

  • Pour ajouter un article, cliquer sur "Mes sites" en haut à gauche, puis "Articles" / bouton "Ajouter"
  • Définir une "image à la une" via le lien "Image à la une" dans la colonne à gauche
  • Donner un titre à l'article (dans la section principale de la page)
  • Écrire le texte de l'article (sous le titre)
  • Ajouter d'autres images dans l'article :
    • il faut être en mode "visuel"
    • cliquer sur le "+" (ajouter du contenu)
    • choisir "ajouter un média"
    • choisir une image et cliquer sur le bouton "insérer"
    • cliquer sur l'image dans l'article et retailler / définir le type de mise en page de l'image (float left/right etc)
  • cliquer sur "mettre à jour" en haut à gauche pour publier l'article
  • remarquer que l'article est mentionné à l'accueil avec son titre et une version sommaire du texte de l'article, et que l'image associée est l'image spécifiée en tant que "image à la une"
  • on peut ajouter plusieurs articles de la même façon - ajouter aux moins 2 articles en tout

 

Remplir le diaporama de l'accueil

  •  Marquer plusieurs articles en tant que "featured" :
    • ouvrir un article pour modification
    • cliquer sur "catégories et mots clés" dans le menu à gauche
    • dans le champ "étiquettes" ajouter le mot featured
    • enregistrer les changements
  • Cliquer sur le bouton pour personnaliser le thème
  • Ouvrir la section "Contenu mis en valeur"
  • dans le champ "Nom du tag" mettre "featured"
  • On devrait voir les images (images à la une) dans le diapporama de l'accueil pour les articles étiquetté en tnat que "featured"
  • Remarquer que les articles "featured" ne s'affiche plus dans la section de l'accueil sous le diaporama

 

Modifier / ajouter une "page"

  • les "pages" ne sont pas comme les "articles" : leur contenu est uniquement affiché en tant que version complète et occupe toute la page web. Les articles par contre peuvent se trouver dans les listes d'articles.
  • Il y a déjà 2 pages dans le site : "A propos" et "Contact", qui peuvent être modifiées via le lien "Pages" dans le menu à gauche (cliquer "Mes sites" en haut à gauche pour afficher ce menu)
  • On a la possibilité d'ajouter les pages aussi et les inclure dans le menu.

 

Changer le thème

  • Il est possible de changer le thème et conserver son contenu
  • Le nouveau thème affichera le contenu autrement
  • Si le nouveau thème contient des fonctionnalités similaires (par exemple le diaporama de l'accueil) et des mécanismes similaires pour les configurer (par exemple l'utilisation de l'étiquette "featured" pour sélectionner les contenus du diaporama) alors le nouveau thème devrait afficher les mêmes éléments mais avec un autre look.
  • Essayer le thème "Baskerville 2" ou "Hero" par exemple : le diaporama n'existe plus / ne fonctionne plus
  • Par contre "Shoreditch", "Superhero" ou "Dara" affiche bien un diaporama et les autres contenus, mais autrement

 

Aller plus loin : Essayer de...

  • dans une nouvelle page ou dans une page existante, ajouter un mosaïque d'images comme dans cette page : https://webmestre8.wordpress.com/a-propos/
  • ajouter une nouvelle page et la faire apparaître dans le menu principal
  • ajouter un diaporama dans le corps d'un article ou d'une page