SHLS Editor online
Code

Export

My documents

Click a document to open it. They are stored only in this browser - nothing is uploaded. Clearing the browser's site data removes them, so download the ones you want to keep.

AI Assistant

Any AI can work with you - ChatGPT, Claude, Gemini, Copilot. The prompt explains SHLS, so the AI writes valid SHLS.

  1. Click Copy prompt.
  2. Paste it into your AI and say what it should change.
The AI should

The document travels in the link after the “#”, which no server sees. What you paste into your AI is handled by its provider.

Save to your server

The editor can send each saved version to your own server (a webhook), so your work is kept where you want it. Nothing is sent until you enter an address here.

What your server receives

A POST request with JSON (your server must allow CORS from https://shls.giit.ch); content is the document as a string:

{ "editor": "shls", "event": "save", "id": "…", "name": "Products",
  "content": "Product\n Name\n Price\n\n Lamp\n 19.90\n",
  "updated": "2026-01-15T09:30:00.000Z" }
Embed the editor in your website 
<iframe src="https://shls.giit.ch/?embed=1" style="width:100%;height:80vh;border:0"></iframe>
<script>
const frame = document.querySelector('iframe');
addEventListener('message', e => {
  if (e.origin !== 'https://shls.giit.ch' || e.source !== frame.contentWindow) return;
  if (e.data.type === 'shlseditor:ready')
    frame.contentWindow.postMessage({ type: 'shlseditor:load', name: 'Products',
      content: shlsText }, 'https://shls.giit.ch');
  if (e.data.type === 'shlseditor:save') saveOnYourServer(e.data.content);
});
</script>

Also possible: ?src=<URL of a .shls file> opens a file, &webhook=<URL> saves this document there. The editor can also open in a window of its own (?embed=window), and your page can hand it its own AI prompt and a session key so the AI sends its result to your server (shlseditor:ai, shlseditor:key-request) - see "Use the editor on your own website" below the editor. Details are in llms.txt.

Help

How it works

  1. Write SHLS on the left - or start with New and one of the templates. A section is its name, then its keys (indented by one space, the keys of a nested list one level deeper), exactly one blank line, then the records: one value per line in the order of the keys.
  2. The middle shows each section with its key block and its records, the keys as labels; nested lists fold. It reads the code exactly as the reference SHLSDecoder does.
  3. Click a value, a key or a section name to change it right there. Enter or a click elsewhere writes the change into the code (one step for Undo), Escape cancels. The buttons above add, duplicate, move and remove records and keys - a key added or removed is added to or removed from every record.
  4. A click in the middle puts the code's cursor on that line; the cursor in the code marks its record, key or value. Problems (a record with a value too few, indentation that is not a whole level, a missing blank line) are listed above the code with their line - click one to go there.
  5. Record on the right shows the selected record as a form; Insert adds records, keys and sections; Convert counts the tokens against JSON and converts to JSON, YAML, CSV and JSON Lines; Outline lists the sections.
  6. My documents (the folder button at the top left) lists every document kept in this browser. Export saves it as SHLS, JSON, YAML, CSV or text.

Keyboard shortcuts

↑ ↓ ← →
In the records: go up and down, fold and unfold
Enter
In the records: change the value, key or section name
Delete
In the records: remove the record or key
Alt + ↑ / ↓
In the records: move the record or key up / down
Ctrl + F
Search keys and values
Tab / Shift + Tab
Indent / outdent in the code by one level
Ctrl + Z / Y
Undo / redo
Ctrl + S / E
Save (download, or to your server) / export
Ctrl + O
My documents

Enter keeps the indentation of the line; after a section name it starts the key block.

Modifier du SHLS en ligne - le format de données qui économise des tokens

SHLS (Sebis Hierarchical List Structure) écrit des données structurées sans guillemets, crochets, deux-points ni clés répétées : chaque section nomme ses clés une seule fois, et les enregistrements en dessous ne listent que les valeurs. L’éditeur SHLS affiche le code et, à côté, le bloc de clés et les enregistrements de chaque section. Modifiez valeurs, clés et enregistrements directement là, voyez les problèmes par ligne, convertissez depuis et vers JSON, YAML et CSV, et voyez combien de tokens SHLS économise par rapport à JSON.

Tout fonctionne dans votre navigateur. Les documents ne sont pas envoyés, il n’y a ni inscription ni publicité.

SHLS en une minute

Une section commence par son nom. Son bloc de clés liste les clés, en retrait d’une espace ; les clés d’une liste imbriquée un niveau plus loin. Après exactement une ligne vide suivent les enregistrements : une valeur par ligne, dans l’ordre des clés. Une liste imbriquée a sa propre ligne (sa clé, ou PH comme espace réservé), avec ses enregistrements un niveau plus loin. Toutes les valeurs sont du texte - les convertir en nombres ou en dates revient au programme qui les lit.

Product
 Name
 Price

 Smartphone A1
 599.99

 Laptop B2
 1299.99

Company
 Name
 Location
  Country
  City

 TechCorp
 PH
  USA
  San Francisco

Les mêmes données en JSON répètent chaque clé dans chaque enregistrement et ont besoin de guillemets, de crochets et de deux-points. SHLS a été conçu pour les modèles d’IA locaux et dans le cloud, où chaque token compte. SHLS by Sebastian Grünwald - le format, ses règles et les classes de référence SHLSDecoder et SHLSEncoder (Python) se trouvent dans le dépôt SHLS sur GitHub.

Ce que l’éditeur sait faire

Code et enregistrements

À gauche, le SHLS en couleurs - sections, clés, valeurs, niveaux d’imbrication et espaces réservés PH. Au milieu, le bloc de clés de chaque section et ses enregistrements, les clés comme étiquettes. Un clic mène au code, le curseur du code marque son enregistrement.

Modifier sur place

Changez valeurs, clés et noms de section ; ajoutez, dupliquez, déplacez et supprimez enregistrements et clés. Les enregistrements suivent leur bloc de clés : une nouvelle clé reçoit « - » dans chaque enregistrement. Une étape d’annulation chacun.

Lire comme la référence

L’éditeur lit SHLS exactement comme SHLSDecoder et liste ce que celui-ci lirait autrement qu’il n’y paraît : un enregistrement avec une valeur de trop ou de moins, un retrait, des lignes vides après le bloc de clés, une clé en double.

Tokens

L’onglet Convertir compte les tokens approximatifs de votre SHLS et des mêmes données en JSON : vous voyez l’économie d’un coup d’œil.

Convertir

Depuis et vers JSON exactement comme SHLSDecoder et SHLSEncoder, YAML, CSV (une section sous forme de tableau) et JSON Lines. Les fichiers JSON, YAML, CSV et JSON Lines s’ouvrent en SHLS.

De nombreux documents

Gardez autant de documents que vous voulez dans votre navigateur, chacun avec son propre historique d’annulation, et téléchargez-les tous en ZIP.

Comment ça marche

  1. Commencer - choisissez un modèle sous « Nouveau », ouvrez un fichier .shls, ou ouvrez un fichier JSON, YAML ou CSV pour l’obtenir en SHLS.
  2. Modifier - dans le code ou dans les enregistrements ; les deux montrent toujours les mêmes données.
  3. Vérifier et convertir - corrigez les problèmes listés, comparez les tokens, et téléchargez du SHLS, JSON, YAML, CSV ou texte.

Utiliser l’éditeur sur votre propre site web

Toute page https (et localhost) peut intégrer l’éditeur avec une <iframe> et ?embed=1 - sans inscription, sans clé. Intégré, l’éditeur masque ce texte et affiche un bouton Enregistrer. Il y a deux façons de faire entrer et sortir le document.

1. Ouvrir un fichier depuis un lien, enregistrer sur votre serveur

src= ouvre un fichier (votre serveur doit autoriser CORS), webhook= fait envoyer le document à cette adresse par « Enregistrer » (Ctrl+S). Ajoutez &token=… pour un en-tête Authorization: Bearer … et &auto pour enregistrer après chaque modification.

<iframe src="https://shls.giit.ch/?embed=1&src=https://your-site.com/data/products.shls&webhook=https://your-site.com/save.php"
        allow="clipboard-write" style="width:100%;height:800px;border:0"></iframe>

Le webhook reçoit un POST avec du JSON { editor: "shls", event: "save", id, name, content, updated } ; content est le document sous forme de chaîne. Un petit script PHP qui l’enregistre :

<?php
header('Access-Control-Allow-Origin: https://shls.giit.ch');
header('Access-Control-Allow-Headers: Content-Type, Authorization');
header('Access-Control-Allow-Methods: POST, OPTIONS');
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') exit;
if (($_SERVER['HTTP_AUTHORIZATION'] ?? '') !== 'Bearer SECRET') { http_response_code(403); exit; }
$d = json_decode(file_get_contents('php://input'), true);
$name = preg_replace('/[^\w\- ]/u', '_', $d['name']);
file_put_contents(__DIR__ . "/data/$name.shls", $d['content']);
echo '{"ok":true}';

2. Votre page détient le document (postMessage)

L’éditeur annonce shlseditor:ready, votre page répond par shlseditor:load, l’éditeur signale shlseditor:loaded, shlseditor:change lors de vraies modifications et shlseditor:save quand l’utilisateur enregistre. Votre page peut envoyer shlseditor:get (l’état actuel) ou shlseditor:save (appuyer sur Enregistrer). L’enregistrement passe alors par votre propre connexion et votre propre session.

<iframe id="ed" src="https://shls.giit.ch/?embed=1" allow="clipboard-write" style="width:100%;height:800px;border:0"></iframe>
<script>
const ed = document.getElementById('ed');
const ORIGIN = 'https://shls.giit.ch';

addEventListener('message', async e => {
  if (e.source !== ed.contentWindow || e.origin !== ORIGIN) return;
  const m = e.data;
  if (m.type === 'shlseditor:ready') {              // l’éditeur est prêt : on lui transmet le document
    ed.contentWindow.postMessage({
      type: 'shlseditor:load',
      name: 'Products',
      content: await (await fetch('/data/products.shls')).text()
    }, ORIGIN);
  }
  if (m.type === 'shlseditor:change') document.title = '● not saved';   // une vraie modification
  if (m.type === 'shlseditor:save') {               // l’utilisateur a cliqué sur "Save"
    await fetch('/api/save', { method: 'POST', headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ name: m.name, content: m.content }) });
    document.title = 'Saved';
  }
});

// Un bouton d’enregistrement sur votre propre page : la réponse arrive sous forme de shlseditor:save
function saveNow() { ed.contentWindow.postMessage({ type: 'shlseditor:get' }, ORIGIN); }
</script>

L’assistant IA dans votre page : il fonctionne aussi dans le cadre. Avec allow="clipboard-write" sur l’iframe, « Copier le prompt » utilise directement le presse-papiers (sinon l’éditeur se rabat sur l’ancienne commande de copie, ou affiche le prompt à copier à la main). Un lien envoyé par l’IA ne peut pas atteindre un éditeur intégré dans un autre site web : l’éditeur demande donc à l’IA et à l’utilisateur de coller toute la réponse de l’IA dans l’éditeur - ou d’ouvrir l’éditeur dans sa propre fenêtre.

3. Dans sa propre fenêtre

window.open("https://shls.giit.ch/?embed=window", "shlseditor-17") ouvre l’éditeur complet dans sa propre fenêtre et échange les mêmes messages avec window.opener. Les liens d’une IA l’y atteignent. shlseditor:load peut aussi transporter context: { host, title, rules } - le prompt de l’IA indique alors où se trouve le document et suit vos règles - et hook: { url, token }, un webhook pour ce seul document, jamais stocké. Fermer la fenêtre avec des modifications non enregistrées envoie shlseditor:closing.

4. L’IA via votre propre serveur

Transmettez à l’éditeur votre propre prompt, une adresse sur votre site et une clé pour cette session de l’éditeur. La boîte de dialogue de l’IA affiche alors « Connecté à » votre site, ce que vous indiquez à l’IA, et le choix modifier le document actuel ou en créer un nouveau ; Copier le prompt assemble le tout. L’IA envoie son résultat avec la clé à votre serveur, et votre page l’ouvre dans l’éditeur - un nouveau document s’ouvre séparément et reste dans le navigateur de l’utilisateur. Une clé par session de l’éditeur : elle reste valable tant que l’éditeur est ouvert, et l’éditeur ne la demande avec shlseditor:key-request que tant qu’il n’en a pas. L’éditeur n’envoie jamais la clé lui-même et ne la stocke jamais ; l’adresse doit être en https sur votre propre hôte ou sur un de ses sous-domaines.

const key = async () => (await fetch('/api/ai-key.php?doc=17')).json();   // une clé par session de l’éditeur
const k = await key();
ed.contentWindow.postMessage({ type: 'shlseditor:load', name: 'Products', content, ai: {
  label: 'My Site', prompt: 'Keep every key. Only add records.',
  endpoint: 'https://your-site.com/api/ai-result.php', key: k.key } }, ORIGIN);
// retenez l’id de shlseditor:loaded et ignorez change/save/closing portant un autre id
// seulement tant que l’éditeur n’a pas de clé :
if (m.type === 'shlseditor:key-request') { const k = await key(); ed.contentWindow.postMessage({ type: 'shlseditor:ai', key: k.key }, ORIGIN); }
// tant que l’éditeur est ouvert, prévenez votre serveur chaque minute ; fermer l’éditeur ou la page annule la clé
setInterval(() => fetch('/api/ai-key.php?alive=' + k.key.slice(0, 8)), 60000);
// votre serveur a un résultat (polling, SSE …) : target vaut "current" ou "new"
ed.contentWindow.postMessage({ type: 'shlseditor:load', name: 'Products', content: draft, from: 'ai', target }, ORIGIN);

Créez des clés d’au moins 128 bits aléatoires, ne stockez que leur hash, liez chacune à l’utilisateur connecté, au document et à cette session de l’éditeur, créez-en une par session, ne la gardez valable que tant que votre page signale la session comme ouverte, et annulez-la quand l’éditeur ou la page se ferme.

Le protocole complet se trouve dans llms.txt - donnez-le à une IA et elle construit la connexion pour votre système. L’éditeur JSON fonctionne de la même façon avec le préfixe jsoneditor: - json.giit.ch.

Questions fréquentes

Qu’est-ce que SHLS ?

SHLS (Sebis Hierarchical List Structure) est un format texte pour données structurées créé par Sebastian Grünwald. Chaque section nomme ses clés une seule fois dans un bloc de clés ; les enregistrements en dessous ne listent que les valeurs, une par ligne, et le retrait montre l’imbrication. Sans guillemets, crochets, deux-points ni clés répétées, les mêmes données demandent bien moins de tokens que JSON - ce qui en fait un bon format pour les modèles d’IA.

Mes données sont-elles envoyées ?

Non. L’éditeur fonctionne entièrement dans votre navigateur. Vos documents ne sont jamais envoyés à un serveur, sauf si vous configurez vous-même un webhook vers votre propre serveur.

L’éditeur lit-il SHLS exactement comme le code de référence ?

Oui. L’éditeur lit et écrit SHLS exactement comme SHLSDecoder et SHLSEncoder du dépôt SHLS - le JSON de l’onglet Convertir correspond aux données que donnent les classes Python. Là où elles lisent un document autrement qu’il n’y paraît (un enregistrement avec une valeur de moins, une ligne vide contenant des espaces), l’éditeur le liste comme problème avec sa ligne.

Puis-je modifier les enregistrements sans toucher au code ?

Oui. Cliquez au milieu sur une valeur, une clé ou un nom de section, tapez, et appuyez sur Enter. Les boutons au-dessus des enregistrements ajoutent, dupliquent, déplacent et suppriment enregistrements et clés ; quand vous ajoutez ou supprimez une clé, chaque enregistrement de la section reçoit ou perd sa valeur. Chaque modification est une étape d’annulation.

Combien de tokens SHLS économise-t-il ?

L’onglet Convertir compte les tokens approximatifs de votre document en SHLS et des mêmes données en JSON. Pour des tableaux d’enregistrements, SHLS demande souvent moins de la moitié des tokens d’un JSON indenté, car les clés ne sont écrites qu’une fois.

Peut-il convertir du JSON, du YAML ou du CSV en SHLS ?

Oui. Ouvrez un fichier .json, .yaml, .csv ou .jsonl et il devient du SHLS, écrit comme l’écrit SHLSEncoder ; l’éditeur indique ce que SHLS ne peut pas garder (valeurs vides, valeurs avec des sauts de ligne). L’onglet Convertir et Exporter écrivent du JSON, YAML, CSV, JSON Lines et du texte brut.

Une IA peut-elle écrire dans l’éditeur SHLS ?

Oui, n’importe quelle IA - ChatGPT, Claude, Gemini, Copilot ou l’IA de votre outil de développement. Cliquez sur « Assistant IA », puis sur « Copier le prompt » : le prompt explique SHLS, si bien que toute IA écrit du SHLS valide. L’IA répond par un lien ; cliquez dessus et le document apparaît dans votre éditeur. « Annuler » revient sur chaque modification.

L’éditeur SHLS est-il payant ?

Non. L’éditeur est gratuit, sans publicité et sans inscription.