Utiliser un blog Yellow

Ceci est le texte visible sur la page de présentation des articles. Ce texte est suivi de la balise [--more--]. Cet article explique comment optimiser la présentation d'un blog yellow, dans la version francisée du CMS, en utilisant le thème Karlskrona.

Comment installer un blog Yellow

Ceci est le premier paragraphe du texte visible après avoir cliqué sur le lien Lire la suite. Pour l'installation du blog, voir le site Utiliser un site Yellow (le choix de la forme “blog” se présente au premier lancement du CMS).

La structure d'un dossier de blog Yellow

• yellow-blog (dossier du site)
  • content (dossier des contenus — fichiers au format .md placés dans des dossiers-onglets)
    • 1-home
      • page.md
    • 2-blog (dossier des articles)
      • aaaa-mm-dd-article-title-01.md
      • aaaa-mm-dd-article-title-02.md
      • page.md
    • 3-categories
      • page.md
    • 9-about
      • page.md
    • shared (dossier des éléments de page personnalisables)
      • footer.md
      • header.md
      • page-error-404.md
      • page-new-blog.md
      • page-new-default.md
  • media
    • downloads
    • images
    • thumbnails
  • system
    • extensions
    • layouts
    • themes
      • theme.css
    • workers
  • .htaccess
  • yellow.php

Réglages de base

Tout se passe dans le fichier extensions/yellow-system.ini. Pour l'installation des extensions, voir le site Utiliser un site Yellow.

Utilisation des données YAML pour un article de blog

• Title devient le titre de l'article dans la page de présentation des articles
• TitleHeader n'est pas implémenté
• TitleContent est utilisé à la place de Title dans la page de l'article (vue après avoir cliqué sur “Lire la suite” sur la page de présentation des articles)

Optimisations typographiques

Une optimisation de la traduction est nécessaire en modifiant le contenu des fichiers system/workers/french.php et system/extensions/yellow-langage-ini.. Conservez bien ces fichiers après les avoir modifiés (ils pourront vous resservir) !

Note : il est nécessaire de placer un espace avant la balise [--more--] pour séparer la mention Lire la suite du texte précédent.

Thèmes testés

Le thème Wittstock est mal conçu ! Beaucoup de choses sont à reprendre... Il s'agit davantage d'une base à personnaliser qu'un thème à utiliser comme tel.

Les thèmes Stokholm et Copenhagen semblent mieux conçus. Il sont très facilement personnalisables.

Le thème Karlskrona est assez bien conçu. Plusieurs personnalisations me semble pourtant nécessaire, en particulier concernant le menu.

Extension testée et optimisée

L'extension “Previous-Next” permet de naviguer d'un article à l'autre. Toutefois, la disposition par défaut des liens dans le bas des articles demande impérativement une personnalisation.

Pour cela, j'ai créé une classe “previous-next” appliquée au paragraphe incluant les liens affichés en bas de chaque article. J'ai donc inséré ceci : class=\"previous-next\" à l'intétieur de la balise \<p> de la ligne 26 de du fichier system/workers/previousnext.php.

La feuille de style system/themes/karlskrona.cssa été modifiée en conséquence en lui ajoutant ces instructions :

p.previous-next {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-top: 2rem;
}

@media screen and (max-width: 900px) {
    p.previous-next {
        flex-direction: column;
        align-items: center;
    }
}

footer.container p {
    text-align: center;
}

a.previous,
a.next {
    font-size: .85rem;
}