Tutoriel de style pour un article

Ce champ est dédié au référencement naturel pour compléter de façon personnalisée la meta description (affichée dans les moteurs de recherche et les réseaux sociaux lors de partage)

Voici un article exemple avec les différentes mises en page prévues.

Les espacements  et la casse sont gérés automatiquement. Les titres doivent par exemple être intégrés en minuscules suivis d’un simple retour à la ligne. Le style qui est attribué à chaque marqueur viendra ensuite ajouter les majuscules si tel est le cas, les espacements et les retraits. Autre exemple : un lien est automatiquement souligné, il ne faut pas ajouter de soulignage manuellement.

Attention au copié/collé en provenance de documents word ou pdf, ou issu des réseaux sociaux : le style intrinsèque global sera également copié/collé. Il est recommandé de copier/coller en mode « Texte » (onglets en haut à droite de l’éditeur de texte) pour éviter l’accumulation de balisage et revenir ensuite en mode « Visuel » pour ajouter les styles avec l’outil d’éditeur de texte :

Le bouton « Ajouter un média » sert à intégrer les images et les vidéos (YouTube), via l’option « Insérer à partir d’une adresse web »

Dans les titres, le « titre 1 » est réservé au titre de l’article. On pourra choisir les titres de 2 à 6.

Ensuite dans l’ordre :

  • par défaut « Paragraphe » sinon choisir les titres (à partir de h2)
  • B pour le gras (bold)
  • I : italique
  • U: souligné (Underline)
  • ABC mot barré
  • citation
  • ligne horizontale : permet un retour forcé à la ligne (important dans le cas de photos et texte alignés à droite/gauche)
  • espace insécable : important avant une ponctuation, pour éviter le retour à la ligne avant le « : » ou « ? » par exemple
  • exposant
  • indice
  • liste à puce
  • liste numérotée
  • lien (cliquer ensuite sur la petite roue pour éditer les paramètres du lien)
  • suppression de lien
  • ancre
  • tableau
  • caractère spécial – aide pour insérer par exemple : ©

Exemple de titre h2

Exemple de titre h3

Exemple de titre h4

Exemple de titre h5
Exemple de titre h6

Exemple de liste à puce :

  • élément 1
  • élément 2
  • élément 3

Autre exemple de liste numérotée :

  1. élément 1
  2. élément 2
  3. élément 3

Paragraphe : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sodales consectetur nulla, eget varius nisl fermentum et. Nullam dictum sodales eros, et iaculis diam fermentum eu. Donec ut pellentesque elit. Suspendisse luctus sem lectus, nec venenatis turpis cursus a. Nam fermentum aliquet urna quis mollis. Praesent ut lacus felis. Integer lobortis eu augue id iaculis. In scelerisque magna eget luctus iaculis. Vestibulum cursus eros ut bibendum faucibus.

Insertion d’une image centrée :

Franchise BASILIC & CO


Insertion d’une image alignée à gauche :

Franchise de Villeurbanne BASILIC & CO
Paragraphe : Vivamus sagittis venenatis ipsum, a ultricies massa. Nam sed lectus et lorem interdum consequat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent tristique, purus et posuere convallis, dolor mi vulputate turpis, non maximus urna erat in mi. Duis ante mauris, dapibus porttitor leo sit amet, imperdiet fermentum velit. Cras in massa justo. Nullam mauris lorem, accumsan at aliquam a, auctor vitae diam. Suspendisse tempor varius quam. Curabitur convallis bibendum dolor sit amet pretium.

Exemple de présentation d’une citation qui est affichée en vert dans l’article.

 


Franchise de Villeurbanne BASILIC & CO

Insertion d’une image alignée à droite :

Paragraphe : Vivamus sagittis venenatis ipsum, a ultricies massa. Nam sed lectus et lorem interdum consequat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent tristique, purus et posuere convallis, dolor mi vulputate turpis, non maximus urna erat in mi. Duis ante mauris, dapibus porttitor leo sit amet, imperdiet fermentum velit. Cras in massa justo. Nullam mauris lorem, accumsan at aliquam a, auctor vitae diam. Suspendisse tempor varius quam. Curabitur convallis bibendum dolor sit amet pretium.

Un lien dans le texte : Fusce eu dui bibendum, blandit augue at, ultricies nisi.

« Réussir à faire de la pizza un produit dit « haut de gamme » tout en proposant un bon rapport qualité-prix est selon moi une excellente proposition commerciale. J’ai retenu Basilic & Co pour son offre, son concept, mais également pour les valeurs véhiculées par la franchise : le lien avec les producteurs locaux, le travail de leurs produits, l’attention portée au respect de l’environnement. Sur Paris, il est pour moi indispensable de faire une place au terroir français ! ».

 


 

L’image mise en avant (colonne de droite dans le back-office) est affichée dans le fil des articles (page accueil, page des actualités, pages des catégories) + en haut à gauche systématiquement dans chaque article.

Dans cet exemple, je n’ai pas enregistré d’Image à la Une : l’image par défaut s’affiche dans le fil des articles.

Pour une introduction à l’article (type chapô de l’article) il est recommandé d’utiliser plutôt le texte en gras (versus un titre de type 4 par exemple)

Cet article est à conserver dans les brouillons comme démo des différents styles applicables dans un article. On peut modifier l’état d’un article (publié, en brouillon, programmé…) en haut à droite de l’éditeur de l’article. La date est également éditable.

Articles similaires