📖 アウトライン表 操作マニュアル(Ver 4-1,3-13)
🚀 はじめに — このアプリについて
「アウトライン表」は、アウトライナーと表(スプレッドシート)を一つに統合したWebアプリです。HTMLファイル一枚をブラウザで開くだけで使えます。インストール不要・サーバー不要・無料です。
対応環境:Windows / Mac / iPad のChrome・Edge・Safariで動作します。データはJSON形式で保存・読み込みします。
🖥️ 画面の構成
① ヘッダー(上部ツールバー)
各種操作ボタンが並んでいます。画面上部に常に表示(スティッキー)されるため、スクロールしても操作できます。
② 表題エリア
ドキュメント全体のタイトルを入力する欄です。アウトラインモード・表モード共通で表示されます。
③ アウトラインエリア / 表エリア
メインの編集エリアです。「📊表」ボタンでアウトラインモードと表(家計簿)モードを切り替えられます。
④ ステータスバー(下部)
操作結果や警告メッセージが表示されます。文字色・ハイライト色のカラーパレット、背景テーマの選択スウォッチもここにあります。
📝 アウトラインモードの基本操作
項目の追加・削除・分割
【+追】または Enter キー:現在の項目の直下に兄弟項目を追加します。
【-削】または Ctrl+X(テキスト未選択時):選択中の項目を削除します。子項目がある場合はまとめて削除されます。削除した項目はクリップボードに残るので、Ctrl+V で別の場所にペーストできます。
【✂分】または Ctrl+Q:カーソル位置でテキストを分割し、2つの項目にします。長い文を整理するときに便利です。
Backspace(カーソルが行頭にあるとき):前の項目と結合します。
階層の操作(インデント)
【→子】または Tab キー:項目を一段下の階層(子レベル)へ移動します。
【←親】または Shift+Tab キー:項目を一段上の階層(親レベル)へ移動します。
タブ文字の挿入:Ctrl+Shift+Space でテキスト内にタブ文字(インデントスペース)を挿入できます。
折りたたみ・展開
項目左の【▾】ボタン:その項目の子階層を折りたたみ/展開します。
【全折】ボタン:すべての項目を折りたたみます。全体の構造を素早く俯瞰したいときに使います。
【展開▾】ボタン:展開する階層を選べます。「全展開」または「1階層」「2階層」「3階層」など指定の深さまで展開できます。
コピー・ペースト
【📋コ】または Ctrl+C(テキスト未選択時):選択中の項目(子項目ごと)をコピーします。
【📌ペ】または Ctrl+V:コピーした項目を選択中の項目の直下にペーストします。
項目の移動(ドラッグ&ドロップ)
項目をドラッグして別の位置へ移動できます。子項目ごとまとめて移動します。
Ctrl を押しながらドロップするとコピー移動になります。
Shift+↑ / Shift+↓ キー:キーボードで一つ上または下の項目へフォーカスを移動します。
元に戻す・やり直す
【↩】または Ctrl+Z:直前の操作を元に戻します(アンドゥ)。
【↪】または Ctrl+Y:やり直します(リドゥ)。
Shift+Backspace / Shift+Delete:テキスト編集中、直前の文字入力一操作分を元に戻す「テキスト専用アンドゥ」です。
🎨 テキスト装飾と背景テーマ
文字色の変更
画面下部のステータスバーにある「文字色」カラーパレットをクリックすると、選択中の項目の文字色が変わります。「✕」をクリックするとリセット(デフォルト色に戻る)できます。
ハイライトの変更
同じくステータスバーの「ハイライト」パレットで、項目の背景色(蛍光マーカー風)を設定できます。「✕」でリセットします。
背景テーマの変更
ステータスバー右の「背景色」スウォッチから6種類のテーマを選べます。選択したテーマはJSONに保存されます。
利用可能なテーマ:デフォルト(ブルー)/ホワイト/ミントグリーン/ピーチ/ラベンダー/レモン の6種類です。
🔗 リンク・テーブル・画像の挿入
リンクの設定
項目左の🔗ボタン(シングルクリック):リンク設定モーダルが開きます。URLを入力して「設定」を押すとリンクが付与されます。「リンクを削除」で削除できます。
🔗ボタン(ダブルクリック):設定済みのリンクを新しいタブで開きます。
テーブル(表)の挿入
【表】ボタン:テーブル挿入モーダルが開きます。行数・列数を指定してテーブルを挿入できます。テーブルノードはアウトラインの一項目として扱われます。
テーブル内ではセルをクリックして編集できます。Tab で右のセルへ、Enter で下のセルへ移動します。行・列の追加・削除、数値列の挿入、タイトル(キャプション)の設定も可能です。
画像の挿入
【画】ボタン:画像挿入モーダルが開きます。画像ファイルのパス(例:images/photo.jpg)と代替テキスト(説明文)を入力して挿入します。
【📂画】ボタン:画像フォルダを選択します(Chrome/Edge対応)。JSONファイルと同じフォルダを選ぶと、相対パスで指定した画像が自動表示されます。
📊 表モード(家計簿モード)の操作
モードの切り替え
【📊表】ボタン:アウトラインモードと表モードをワンクリックで切り替えます。同じデータを二つの顔で使えます。
列の追加・削除・移動
【+列▾】ボタン:「テキスト列」または「数値列」を追加できます。
【-列】ボタン:選択中の列(テキスト列・数値列共用)を削除します。
【◁列▷】ボタン:選択中の列を左右に移動します。
合計列・総計列
【Σ列】ボタン:合計列を追加します。各行の子ノードの数値を自動で合計して表示します。家計簿の小計・中計などに使います。
【∑総計】ボタン:総計列を追加します。ヘッダーに「s1-s2+s3」のような式を入力すると、Σ列どうしを演算した結果を表示します。収支の差額や合算などに活用できます。
【ID整理】ボタン:Σ列のIDを s1, s2, s3… と順番に整理し直し、∑総計列の式も自動修正します。列の追加・削除を繰り返してIDが乱れたときに使います。
ソートと日付機能
【↑↓ソート】ボタン:列を選択して行を並び替えます。昇順・降順を切り替えられます。「ソート状態をリセット」で元の順番に戻せます。
【📅 日付追加】ボタン(表モード時のみ表示):指定期間の日付項目を自動生成して追加します。日付帳票や日記帳の作成に便利です。
【📅 年月追加】ボタン(表モード時のみ表示):指定期間の年月項目を自動生成します。月次家計簿などに使います。
【📌 今日】ボタン:今日の日付の項目へ自動でジャンプします。
表モードでのキー操作
Tab:同じ行の右のセルへ移動します。末尾セルでは次の行の先頭セルへ移ります。
Enter または ↓ キー:下のセルへ移動します。↑ キーで上のセルへ移動します。
→ / ← キー:右・左のセルへ移動します(テキスト末尾・先頭のときのみ)。
Alt+S:表モード内で保存します(Ctrl+Z でアンドゥ、Ctrl+Y でリドゥも有効)。
💾 ファイルの保存・読み込み
保存(JSON形式)
【💾J保▾】ボタン:保存方法を選べるドロップダウンが開きます。
「💾 上書き保存」:現在開いているJSONファイルに上書きします(Chrome/Edge対応。未対応ブラウザはダウンロードフォルダへ保存)。
「📁 別名保存」:保存先を選択して保存します(Chrome/Edge対応。未対応ブラウザはファイル名を入力してダウンロードフォルダへ保存)。
「📌 タイムスタンプ付き保存」:「ファイル名_YYYYMMDD_HHMMSS.json」の形式で自動命名してダウンロードフォルダに保存します。バックアップに最適です。
読み込み
【📂開】ボタン:JSONファイルを選択して読み込みます。現在の内容は上書きされます。
ドラッグ&ドロップ読み込み:JSONファイルを画面上にドロップしても読み込めます。
新規作成
【新規】ボタン:現在の内容をすべて破棄して白紙の状態にします。実行前に確認ダイアログが表示されるので、誤操作の心配はありません。
📤 エクスポート(出力)
【📤出▾】ボタンから出力形式を選べます。
🌐 HTML出力:折りたたみ可能なアウトライン構造のHTMLファイルとして出力します。ブラウザで閲覧・配布に適しています。
📃 プレーンHTML:装飾なしのシンプルなHTMLとして出力します。他ツールへの貼り付けに向いています。
📄 RTF出力:Wordなどのワープロで開けるRTF形式で出力します。
📝 Blogger出力:Blogger(Google)向けのHTML形式でクリップボードにコピーします。そのままBloggerの投稿画面に貼り付けられます。
📊 表HTML出力(表モード時):表モードの内容をHTMLファイルとして出力します。
📋 表CSV出力 / 📂 表CSVインポート(表モード時):表の内容をCSV形式でエクスポート・インポートできます。エクセルとのデータ連携に活用できます。
⌨️ キーボードショートカット一覧
アウトラインモード(テキスト編集中)
Enter ▶ 兄弟項目を追加
Tab ▶ 子レベルへ(インデント)
Shift+Tab ▶ 親レベルへ(アウトデント)
Ctrl+Q ▶ カーソル位置で項目を分割
Ctrl+X(未選択時)▶ 項目をカット(削除+クリップボード保存)
Ctrl+C(未選択時)▶ 項目をコピー
Ctrl+V ▶ 項目をペースト
Ctrl+Z ▶ 元に戻す
Ctrl+Y ▶ やり直す
Shift+Backspace / Shift+Delete ▶ テキスト専用アンドゥ
Shift+↑ / Shift+↓ ▶ 上・下の項目へフォーカス移動
Backspace(行頭) ▶ 前の項目と結合
Ctrl+Shift+Space ▶ テキスト内にタブ文字を挿入
表モード(セル編集中)
Tab ▶ 右のセルへ移動
Enter / ↓ ▶ 下のセルへ移動
↑ ▶ 上のセルへ移動
→ / ← ▶ 右・左のセルへ移動(テキスト末尾・先頭時のみ)
Alt+S ▶ 保存
Ctrl+Z / Ctrl+Y ▶ アンドゥ/リドゥ
Shift+Backspace / Shift+Delete ▶ セル内テキスト専用アンドゥ
Escキー
開いているモーダル(リンク設定・テーブル挿入・画像挿入など)を閉じます。
💡 Tips & よくある質問
Q. データはどこに保存されますか?
A. データはブラウザ内には自動保存されません。必ず「💾J保」ボタンでJSONファイルとして保存してください。JSONはテキストファイルなのでどこでも保管できます。
Q. 画像が表示されません。
A. 【📂画】ボタンでJSONファイルと同じフォルダを選択してください(Chrome/Edge対応)。Safariや他ブラウザでは絶対パスで指定するか、ローカルサーバー経由で開く必要があります。
Q. テーブル(挿入した表)の合計はどう計算されますか?
A. アウトラインに挿入するテーブルとは別に、表モード(家計簿モード)のΣ列・∑総計列は「子ノードの数値を集計する」機能です。アウトラインの親子関係をそのまま集計ツリーとして使えます。
Q. iPadで使えますか?
A. はい、iPadのSafari / Chromeで動作します。ドラッグ&ドロップはiPadにも対応しています。ファイルの保存・読み込みは「ファイル」アプリ経由になります。
Q. バックアップはどうすればいいですか?
A. 「📌 タイムスタンプ付き保存」を定期的に使うことをおすすめします。日時がファイル名に入るので、複数世代のバックアップを簡単に保持できます。