# Créer un article depuis la ligne de commande ------------------------------------------------------------------------ Rendez vous dans le dossier de vos articles, enregistré lors de l'ajout de votre domaine (ou celui que vous avez configuré) ``` cd MON-DOSSIER-ARTICLES gsl setdir ``` "setdir" permet de choisir parmi les domaines configurés. Cette commande s'assure également que le dossier "images" et le dossier "files" sont présents. Si déjà configuré, vous serez averti pour quel domaine. ## Créer un article de base Vous pouvez créer un article daté du jour avec les METAS obligatoires intégrées depuis la ligne de commande. Vous devrez les renseigner après. Pour cela, spécifier si votre article sera une 'page' ou un 'post' (Voir section plus bas), et lui donner un nom sans l'extension .gsl. Les metas optionnelles sont ajoutées en commentaires. ``` gsl new page|post FILENAME ``` Mettez des guillemets pour les nom du fichier avec espaces. ``` # Créer une page nommée index # deviendra /index.html gsl new page index # Créer un article nommé "mes vacances" gsl new post "mes vacances" # Deviendra /mes vacances/index.html ``` # Éditez votre article dans le terminal Vous pouvez éditer dans le terminal vos articles en utilisant l'autocompletion (touche ), ou avec votre éditeur de texte favoris. le micro logiciel nano est utilisé par défaut par GSL pour toute édition (article, configuration du domaine, auteurs...) ``` gsl edit "mes vacances.gsl" ``` # Comment écrire un article ------------------------------------------------------------------------ Votre article doit contenir 2 sections. Les METAS avant ```#1``` et l'article à partir de ce repère (servant de titre h1). - METAS : configurer votre article (titre, date, liens...) - ARTICLE : contenu rédactionnel avec quelques marqueurs (gras...) ## METAS obligatoires (avant ```#1```) **Écrire sur une seule ligne** chaque META ``` type: page title: POST TITLE slug: MY-SLUG (si espaces, GSL les convertira en -) info: DESCRIPTION (À propos de cet article) author: NAME (doit être enregistré via la commande : gsl author edit date: YYYY-MM-DD tags: TAG1,Mon TAG2 (séparés par une virgule) ``` ### Page ou post ? Vous devez spécifier pour chaque article si c'est une **page** ou un **post** #### Page (index, 404, about...) Création HTML à la racine du serveur selon le slug: /MY-SLUG.html ``` type: page slug: 404 ``` #### Post (mon article) Création HTML dans un dossier selon le slug: /MY-SLUG/index.html **! Le slug ne doit pas commencer par un /** ``` type: post slug: tutoriel/xmpp/configurer-gajim ``` ## METAS optionnelles Définir UN seul marqueur CSS par article pour personnaliser chaque article avec sa propre CSS. ``` css: myID ``` Définir un ou plusieurs de ces marqueurs et utiliser ``` : ``` comme séparateur ``` abbr: COURT : Long : valeur file: NOM : NOM-DU-FICHIER : Text alternatif link: NOM : URL : Text alternatif code: NUMERO : NOM-DU-FICHIER : Text alternatif brut: NUMERO : NOM-DU-FICHIER image: NUMERO : NOM-DU-FICHIER : TEXT-ALTERNATIF ``` ## Contenu de l'article Les marqueurs (hors listes) et leur contenu (ex: ```*ceci est en gras*```) **doivent être sur la même ligne**. Les marqueurs à retenir et leur combinaison de touches sur un clavier azerty français (disposition par défaut) - Gras: ```*...*``` - Italique: ```\...\``` - Code en ligne: `...` (altgr + 7) - Très gras: ```¤...¤``` (altgr + $) - Barré: ```~...~``` (altgr + 2) - Personnalisé: ```×...×``` (altgr + shift + ;) ### Écrire en très gras Dans l'article... ``` ¤c'est en super gras (strong)¤ ``` ### Écrire en gras Dans l'article... ``` *Texte en gras* ``` ### Écrire en Italique Dans l'article... ``` C'est \en italique\ ``` ### Créer un texte "barré" (HTML del) Dans l'article... ``` La réunion aura lieu ~demain~ dans une semaine ``` ### Écrire un Code en ligne Dans l'article... ``` `gsl help -w && echo "Be Happy"` # Si besoin dans le code de "`..`", replacer par $(...) ``` ### Personnaliser un élément via CSS Ce marqueur permet d'appliquer un ```...``` afin de personnaliser une partie spécifique d'un texte ciblé grâce à ses propriétés CSS (voir la doc CSS) ``` Personnaliser ces ×jolis mots× ``` ### Abréviations Définir en METAS... - L'abréviation (ex: "CSS" doit être en **lettres CAPITALES**) - L'écriture longue de l'abréviation - Optionnel : valeur au choix pour forcer l'écriture HTML de "CSS" en minuscule ``` abbr: CSS : Cascading Style Sheets abbr: POUET : Nom donné aux messages dans le fédivers : low ``` Dans l'article: ``` Les propriétés CSS ne sont pas définies # Affiche "CSS" sur la page Ce POUET est chouette # Affiche "pouet" sur la page ``` ### Paragraphes - Ouvrir avec ```(``` et fermer avec ```)``` **Au début d'une nouvelle ligne**. - Optionnel : définir le nom de la classe du paragraphe (ex "p3") Dans l'article... ``` ( p3 Paragraphe avec une classe p3 en CSS ) ( Paragraphe sans classe personnalisée ) ``` ### Liens Définir en METAS... ``` link: Mon lien : URL : Alt text link: https://a-lec.org/ : URL : Alt text ``` Dans l'article... - Écrivez ```_``` devant le nom du lien - Ajoutez ```+``` pour ouvrir le lien dans un nouvel onglet ``` Visitez _Mon lien+ et charger ici la page _https://a-lec.org/ ``` ### Fichiers Définir en METAS ``` file: Mon fichier : FILENAME : ALT-TEXT ``` Dans l'article... ``` __Mon fichier est super léger ``` ### Images Définir en METAS ``` image: 1 : FILENAME : ALT-TEXT image: 2 : FILENAME : ALT-TEXT ``` Dans l'article... Définir le marqueur `_image` et spécifier jusqu'à 5 valeurs séparées par le caractère `:` : 1. numéro d'image : - valeur du 1er champ après ```_image:```. Correspond au numéro défini en METAS, 1. alignement : - optionnel : si non défini alors classe CSS par défaut (center), - `l` ou `g` : gauche, - `r` ou `d` : droite, - `c` : centre, - `maclasse` : une classe CSS personnalisée, 1. largeur : - optionnelle : la largeur native de l'image sera utilisée, - valeur : la largeur désirée pour l'affichage de l'image, - option d'accoler l'unité : `px`, `%`, `cm`… - unité par défaut si non précisée : `px`, - `0` : pour largeur non définie, sera déduite de la hauteur en conservant le ratio de l'image, 1. hauteur : - optionelle, - non définie : la valeur sera déduite de la largeur - largeur définie à ```0``` : hauteur native de l'image, - valeur : la hauteur désirée pour l'affichage de l'image, - option d'accoler l'unité : `px`, `%`, `cm`… - unité par défaut si non précisée : `px`, 1. lien : - soit `+` : ouvre un onglet uniquement sur l'image, - soit une URL : adresse web d'une ressource, commençant par `http` ou `ftp`. #### Exemples de mise en place d'images Images affichées l'une à côté de l'autre ``` ( _image:1 # Image 1, taille originale, sans lien _image:2:r:+ # Image 2, classe right, taille originale, lien local _image:3:g:640px:https://echolib.re/ # Image 3, classe left, largeur 640px, hauteur déduite, lien externe _image:4:maclass:320:200:+ # Image 4, classe maclass, largeur 320px, hauteur 200px, lien local _image:5:maclass:0:20%:https://echolib.re/ # Image 5, classe maclass, largeur déduite, hauteur 20%, lien externe ) ``` Images affichées l'une en dessous de l'autre ``` ( _image:1:+ ) ( _image:2:c:1920px:25%:https://echolib.re ) ``` ### Block-Code depuis un fichier Définir en METAS ``` code: python : FILENAME : Alt Text ``` Dans l'article... ``` _code:python ``` ### IMPORT de code brut (sera exécuté par le navigateur) Définir en METAS... ``` brut : 1 : FILENAME ``` Dans l'article... ``` _brut:1 ``` ### Citation simple Commun aux citations : - Définir un bloc pour la citation. Utilisez ```---``` - Optionnel : définir une classe CSS spécifique ```--- ma-classe-css``` Dans l'article... ``` --- ( Une citation simple dans un paragraphe ) --- ``` ### Citation avancée Dans l'article... "Stallman" est une classe CSS personnalisée ``` --- Stallman _cite : Richard Matthew Stallman _link : https://stallman.org/ _lang : en ( In the free/libre software movement, we develop software that respects users' freedom, so we and you can escape from software that doesn't. I could have made money this way, and perhaps amused myself writing code. But I knew that at the end of my career, I would look back on years of building walls to divide people, and feel I had spent my life making the world a worse place ) --- ``` ### Citation avancée : données optionnelles Ajoutez ces marqueurs, si connus dans la citation (ex : sous "_cite") ``` _year: 2021 _book: Esperanza 64 ``` ### Créer des listes L'arborescence est "infinie". - Définir le début d'une liste par ```<<``` et sa fin par ```>>``` - Optionnel : définir une classe CSS après ```<< ``` Dans l'article... - utilisez ```=``` pour définir une liste simple (ul) - utilisez ```+``` pour définir une liste ordonnée (ol) - Mixez les 2 (dans la limite de ma patience :D) ``` ( Voici une liste simple << = Fruits : *mangez-en* == Kiwis == Fraises === pas mûres == Bananes === Plantins = Légumes == Haricots === Rouges === Verts >> ) ``` Voici une liste mixe avec sa classe "couverture" ``` << couverture = Livre 1 + Chapitre 1 + Chaptire 2 ++ Résumé du Ch 2 = Livre 2 + Chapitre 1 >> ``` ### Ajouter des lignes vides Vous pouvez ajouter des ```
``` dans votre rédaction, mais pour une lecture plus propre de votre article, vous pouvez utiliser le caractère ```|``` **au tout début d'une nouvelle ligne**. Pratique dans les paragraphes. Dans l'article... ``` #1 Mon titre ( Ceci est un long paragraphe (un peu d'imagination...) | Retour "forcé" à la ligne ) ```