Comment faire ?

Créer d'une nouvelle page

Une nouvelle page est créée en plaçant un fichier intitulé page.md dans un dossier dont l'intitulé commence par un numéro, suivi d'un tiret puis du nom de la page. Le numéro détermine la position de l'onglet dans le menu. Ce dossier est placé dans dossier-du-site/content (ici, yellow-site/content).

L'arborescence du dossier yellow-site/content est la suivante :

content
- 1-home
  - page.md
- 7-how-to
  - editer-page-site.md
  - page.md
- 8-settings
  - page.md
- 9-about
  - page.md
- shared
  - footer.md
  - hearder.md
  - page-error-404.md
  - page-new-default.md

Un clic sur le bouton + situé en faut à droite des pages du site (visible en mode édition) permet de créer une nouvelle page placée dans le dossier de la page affichée. Un exemple vous est proposé avec le titre de section ci-dessous (Éditer une page du site).

Il ne semble pas possible de créer un dossier (générant un onglet) directement à partir de l'éditeur de page.

Le bouton - permet de supprimer une page (un message de confirmation s'affiche).

Notez bien la présence de plusieurs fichiers Markdown dans le dossier shared. Ils sont les modèles des parties ou totalité des pages concernées. C'est par exemple dans header.mdqu'il faudra éventuellement insérer une image et un texte pour qu'ils soient présents sur toutes les pages du site.

Éditer une page du site

Le titre de cette section est un lien vers une autre page (editer-page-site.md), située dans le dossier de la page mère (7-how-to/page.md). Voir l'arborescence du dossier content un peu plus haut.

Modifier le nom du site

Le nom du site affiché en tête de page (en haut ,à gauche, avec le thème Stockholm) est enregistré dans le fichier system/extensions/yellow-system.ini, ligne 3. Il peut être modifié si nécessaire.

Paramétrer l'entête YAML de chaque page

Toute la configuration d'une page repose sur les paramètres YAML placés en tête de page. Le paramètre Title est par défaut le contenu h1 de la page. Un titre h1 différent peut être paramétré en utilisant le paramètre TitleContent. Pour découvrir tous les paramètres utilisables dans l'entête de chaque page, voir la page “Réglages”

Installer de nouvelles extensions

Les fonctionnalités du site reposent sur les extensions installées. Toutes les extensions sont documentées sur github.com/datenstrom/yellow-extensions.

Des développeurs ont développé des extensions très performantes pour le CMS Yellow. Les plus intéressantes sont sur https://github.com/GiovanniSalmeri?tab=repositories. On en trouve d'autres sur https://github.com/schulle4u?tab=repositories.

L'installation s'effectue en plaçant simplement le fichier .zip de l'extension téléchargée préalablement dans le dossier system/extensions. En réactualisant le site dans le navigateur, l'extension est automatiquement décompressée et les fichiers se placent aux endroits voulus.

Installer un nouveau thème

Datenstrom Yellow utilise par défaut le thème “Stockholm”. Plusieurs autres thèmes (Paris, Berlin, Wittstock, Coppenhage, Karlskrona) sont disponibles sur la page GitHub des extensions du CMS (voir plus haut).

Pour utiliser un autre thème, il suffit de placer le fichier .zip du thème (téléchargé au préalable...) dans le dossier system/extensions puis de changer le nom du thème utilisé dans le fichier system/extensions/yellow-system.ini, ligne 7.

Le CMS décompresse automatiquement le dossier du thème placé dans system/extensions et répartit les fichiers décompressés dans les dossiers appropriés.

Personnaliser les CSS du thème choisi

Les thèmes proposés sur le site sont très simples, mis à part Karlskrona dont la feuille de style est très complète mais relativement complexe. Tout un chacun peut donc personnaliser les thèmes fournis, soit en modifiant les fichiers PHP, soit en modifiant les fichiers CSS. Il est plus facile pour les débutants de modifier les fichiers CSS.

Le thème Wittstock est associé à une feuille de style “no-class”. Il est donc possible de créer de nouveaux thèmes en choisissant d'autres feuilles de style sans classe. Attention cependant, Le thème Wittstock présente des défaut de structuration qui devront être améliorés.

Le thème Karlskrona utilise la feuille de style “no-class” Pico CSS dont les fonctionnalités sont nombreuses et documentées sur le site de Pico CSS.

Si vous souhaitez utiliser une feuille de style personnalisée, téléchargez celle-ci à partir du code source d'une page de site Yellow dont le look vous intéresse. Voyez la liste de sites proposée sur la page “À propos”.

Intégrer un diaporama (slider)

Le diaporama est placé là parce qu'il fallait bien le mettre quelque part... J'ai placé une galerie au milieu de la page suivante, pour la même (fausse) raison. Cela vous permet de voir comment les extensions “Slider” et “Gallery” fonctionnent ;-)

La mise en place d'un slider nécessite donc l'installation de l'extension “Slider” (placer slider.zip dans system/extensions). Les images sont placées dans le dossier media/images/slides et sont intégrées dans la page voulue par le “shortcode” [slider slides.*jpg name fade].

Mettre en ligne le site

La mise en ligne d'un site réalisé avec le CMS Yellow est parfaitement fluide. Si l'installation initiale n'a pas déjà été effectuée sur un serveur distant, il suffit de transférer le dossier du site mis au point en local, sur le serveur distant. Le site est immédiatement opérationnel. L'activation du mode “Édition” s'effectue avec les paramètres choisis initialement.

Activer le mode “Édition”