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.

SHLS をオンラインで編集 - トークンを節約するデータ形式

SHLS (Sebis Hierarchical List Structure) は、引用符、括弧、コロン、繰り返しのキーなしで構造化データを書きます。各セクションはキーを一度だけ挙げ、その下のレコードは値だけを並べます。SHLS エディターはコードと、その横に各セクションのキーブロックとレコードを表示します。その場で値、キー、レコードを変更し、問題を行ごとに確認し、JSON、YAML、CSV と相互変換し、JSON と比べて SHLS がどれだけトークンを節約するかを確認できます。

すべてブラウザー内で動作します。ドキュメントはアップロードされず、登録も広告もありません。

1 分でわかる SHLS

セクションは名前で始まります。その キーブロック にはキーがスペース 1 つのインデントで並び、入れ子のリストのキーはさらに 1 レベル深くなります。ちょうど 1 つの空行 の後に レコード が続きます: キーの順に 1 行 1 値です。入れ子のリストは専用の行 (そのキー、またはプレースホルダーの PH) を持ち、そのレコードは 1 レベル深くなります。値はすべてテキストです。数値や日付への変換は、読み込むプログラムに任されます。

Product
 Name
 Price

 Smartphone A1
 599.99

 Laptop B2
 1299.99

Company
 Name
 Location
  Country
  City

 TechCorp
 PH
  USA
  San Francisco

同じデータを JSON で書くと、すべてのレコードでキーを繰り返し、引用符、括弧、コロンが必要になります。SHLS は、トークンの 1 つ 1 つが重要なローカルやクラウドの AI モデルのために作られました。SHLS by Sebastian Grünwald - 形式、そのルール、リファレンスの SHLSDecoder と SHLSEncoder (Python) は GitHub の SHLS リポジトリにあります。

エディターでできること

コードとレコード

左側にハイライト付きの SHLS (セクション、キー、値、入れ子のレベル、PH プレースホルダー)。中央には各セクションのキーブロックとそのレコードが表示され、キーはラベルになります。クリックするとコードへ移動し、コードのカーソル位置のレコードが示されます。

その場で編集

値、キー、セクション名の変更、レコードとキーの追加、複製、移動、削除。レコードはキーブロックに従い、新しいキーにはすべてのレコードで "-" が入ります。それぞれ「元に戻す」1 回分です。

リファレンスと同じ読み方

エディターは SHLSDecoder とまったく同じように SHLS を読み、見た目と異なって読まれる箇所を一覧表示します: 値が 1 つ多い / 少ないレコード、インデント、キーブロックの後の空行、2 回あるキー。

トークン

変換タブで、SHLS と同じデータの JSON のおおよそのトークン数を数えるので、節約量がひと目でわかります。

変換

SHLSDecoder と SHLSEncoder とまったく同じ JSON との相互変換、YAML、CSV (1 セクションを表として)、JSON Lines。JSON、YAML、CSV、JSON Lines ファイルは SHLS として開きます。

多数のドキュメント

ドキュメントをいくつでもブラウザー内に保管でき、それぞれに元に戻す履歴があり、すべてを ZIP でダウンロードできます。

使い方

  1. 始める - 「新規」でテンプレートを選ぶか、.shls ファイルを開くか、JSON、YAML、CSV ファイルを開いて SHLS にします。
  2. 編集 - コードでもレコードでも編集できます。両方とも常に同じデータを表示します。
  3. 検証と変換 - 一覧の問題を直し、トークン数を比較して、SHLS、JSON、YAML、CSV、テキストをダウンロードします。

エディターを自分の Web サイトで使う

https のページ (および localhost) なら、<iframe> と ?embed=1 でエディターを埋め込めます。登録もキーも不要です。埋め込まれたエディターはこの説明文を隠し、保存ボタンを表示します。ドキュメントを受け渡す方法は 2 つあります。

1. リンクからファイルを開き、自分のサーバーに保存する

src= でファイルを開き (サーバーで CORS の許可が必要)、webhook= を指定すると「保存」(Ctrl+S) でドキュメントがそのアドレスに送信されます。&token=… を付けると Authorization: Bearer … ヘッダーが付き、&auto を付けると変更のたびに保存します。

<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>

Webhook は JSON { editor: "shls", event: "save", id, name, content, updated } を含む POST を受け取ります。content はドキュメントの文字列です。それを保存する小さな PHP スクリプト:

<?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. ページがドキュメントを保持する (postMessage)

エディターが shlseditor:ready を送り、ページが shlseditor:load で応答すると、エディターは shlseditor:loaded を返し、実際に編集されると shlseditor:change、ユーザーが保存すると shlseditor:save を送ります。ページからは shlseditor:get (現在の状態) や shlseditor:save (保存ボタンを押す) を送れます。保存はあなた自身のログインとセッションを通して行われます。

<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') {              // エディターの準備完了: ドキュメントを渡す
    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';   // 実際の編集
  if (m.type === 'shlseditor:save') {               // ユーザーが「保存」をクリックした
    await fetch('/api/save', { method: 'POST', headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ name: m.name, content: m.content }) });
    document.title = 'Saved';
  }
});

// 自分のページの保存ボタン: 応答は shlseditor:save として届く
function saveNow() { ed.contentWindow.postMessage({ type: 'shlseditor:get' }, ORIGIN); }
</script>

ページ内の AI アシスタント: フレーム内でも動作します。iframe に allow="clipboard-write" を付けると、「プロンプトをコピー」がクリップボードを直接使います (付けない場合は古いコピーコマンドを使うか、手動でコピーできるようプロンプトを表示します)。AI が送るリンクはほかの Web サイト内のエディターには届かないため、エディターは AI とユーザーに、代わりに AI の回答全体をエディターに貼り付けるよう案内します。または、エディターを専用のウィンドウで開いてください。

3. 専用のウィンドウで開く

window.open("https://shls.giit.ch/?embed=window", "shlseditor-17") は完全なエディターを専用のウィンドウで開き、window.opener と同じメッセージをやり取りします。AI からのリンクもそこに届きます。shlseditor:load には context: { host, title, rules } (AI プロンプトがドキュメントの所属先を伝え、あなたのルールに従います) と hook: { url, token } (このドキュメント専用で保存されない Webhook) も含められます。未保存の変更があるままウィンドウを閉じると shlseditor:closing が送られます。

4. 自分のサーバー経由の AI

エディターに独自のプロンプト、サイト上のアドレス、このエディターセッション用のキーを渡します。すると AI ダイアログには、あなたのサイトへの「接続先」、AI に伝える内容、そして 現在のドキュメントを変更 か 新しいドキュメントを作成 の選択肢が表示され、プロンプトをコピー ですべてがまとめられます。AI はキーを付けて結果をあなたのサーバーに送り、ページがそれをエディターで開きます。新しいドキュメントは別に開き、ユーザーのブラウザー内に残ります。キーはエディターセッションごとに 1 つです。エディターを開いている間は有効で、キーがないときだけエディターが shlseditor:key-request で要求します。エディターがキーを自分で送ったり保存したりすることはありません。アドレスはあなた自身のホストまたはそのサブドメイン上の https である必要があります。

const key = async () => (await fetch('/api/ai-key.php?doc=17')).json();   // エディターセッションごとにキーを 1 つ
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);
// shlseditor:loaded の id を覚えておき、別の id の change/save/closing は無視する
// エディターにキーがないときだけ:
if (m.type === 'shlseditor:key-request') { const k = await key(); ed.contentWindow.postMessage({ type: 'shlseditor:ai', key: k.key }, ORIGIN); }
// エディターを開いている間、毎分サーバーに知らせる。エディターまたはページを閉じるとキーは無効になる
setInterval(() => fetch('/api/ai-key.php?alive=' + k.key.slice(0, 8)), 60000);
// サーバーに結果がある (ポーリング、SSE …): target は "current" または "new"
ed.contentWindow.postMessage({ type: 'shlseditor:load', name: 'Products', content: draft, from: 'ai', target }, ORIGIN);

キーは 128 ビット以上のランダム値で作り、ハッシュだけを保存し、それぞれをログイン中のユーザー、ドキュメント、このエディターセッションに結び付けてください。キーはセッションごとに 1 つ作り、ページがセッションを開いていると報告している間だけ有効にし、エディターまたはページが閉じたら無効にしてください。

プロトコルの全体は llms.txt にあります。AI に渡せば、あなたのシステム用の接続を作ってくれます。JSON エディターも接頭辞 jsoneditor: で同じように動作します - json.giit.ch。

よくある質問

SHLS とは何ですか?

SHLS (Sebis Hierarchical List Structure) は、Sebastian Grünwald による構造化データ用のテキスト形式です。各セクションはキーブロックでキーを一度だけ挙げ、その下のレコードは値だけを 1 行に 1 つずつ並べ、インデントで入れ子を表します。引用符、括弧、コロン、繰り返しのキーがないため、同じデータでも JSON よりはるかに少ないトークンで済み、AI モデル向けの形式として適しています。

データはアップロードされますか?

いいえ。エディターは完全にブラウザー内で動作します。自分で自分のサーバーへの Webhook を設定しない限り、ドキュメントがサーバーに送られることはありません。

エディターはリファレンスのコードとまったく同じように SHLS を読みますか?

はい。エディターは SHLS リポジトリ の SHLSDecoder と SHLSEncoder とまったく同じように SHLS を読み書きします。変換タブの JSON は Python クラスが返すデータそのものです。ドキュメントが見た目と異なって読まれる箇所 (値が 1 つ足りないレコード、スペースを含む空行) は、エディターが行付きの問題として一覧表示します。

コードに触れずにレコードを編集できますか?

はい。中央の値、キー、セクション名をクリックし、入力して Enter を押します。レコードの上のボタンでレコードとキーの追加、複製、移動、削除ができます。キーを追加または削除すると、セクションのすべてのレコードでその値が追加または削除されます。変更はそれぞれ「元に戻す」1 回分です。

SHLS はどれくらいトークンを節約しますか?

変換 タブで、ドキュメントを SHLS にした場合と同じデータを JSON にした場合のおおよそのトークン数を数えます。レコードの表では、キーが一度しか書かれないため、SHLS はインデント付き JSON の半分以下のトークンで済むことがよくあります。

JSON、YAML、CSV を SHLS に変換できますか?

はい。.json、.yaml、.csv、.jsonl ファイルを開くと、SHLSEncoder と同じ書き方の SHLS になります。SHLS で保持できないもの (空の値、改行を含む値) はエディターが知らせます。変換タブとエクスポートでは、JSON、YAML、CSV、JSON Lines、プレーンテキストを書き出せます。

AI に SHLS エディターで書いてもらえますか?

はい、どの AI でも使えます。ChatGPT、Claude、Gemini、Copilot、またはコーディングツールの AI です。「AI アシスタント」、続いて「プロンプトをコピー」をクリックします。プロンプトが SHLS を説明するので、どの AI も正しい SHLS を書きます。AI はリンクで回答します。クリックするとドキュメントがエディターに表示されます。「元に戻す」ですべての変更を戻せます。

SHLS エディターは有料ですか?

いいえ。エディターは無料で、広告も登録もありません。