もくじ
0. 全体像とURL
PDFをアップロードすると「めくれるURL」に変換して配信するシステムです。ページは画像化されてCloudflareから配信されるため、閲覧者側の環境を選ばず、原本PDFが直接配布されることもありません。
| URL | 用途 |
|---|---|
studio.nicoichi.site | 社内専用(Cloudflare Access保護)。ビルダー / と管理画面 /admin/ |
book.nicoichi.site | 公開。閲覧URL /view/ブックID と本棚 /shelf/クライアントID |
| クライアント独自ドメイン | catalog.client.com のようなサブドメインで閲覧URLを提供(→ 8章) |
| クライアントの既存サイト配下 | www.client.com/ebook/…/ のようなパス配下に設置(→ 9章) |
2つのキー
| キー | 使う場所 | できること |
|---|---|---|
| ビルダーキー | ビルダー/管理画面「カタログ管理」 | アップロード・公開設定変更・削除・ドメイン割当 |
| 管理キー | 管理画面の解析ダッシュボード | 閲覧統計の参照 |
どちらも社内共有のキーです(Cloudflare Workers Secretと一致)。ブラウザに保存されるので入力は初回のみ。
1. クイックスタート(5分)
studio.nicoichi.site。PDFをドラッグ&ドロップ(タイトル・クライアントIDを先に入れておくと確実)book.nicoichi.site/view/… をコピーして送るだけ。QRコードは管理画面から2. カタログを作る(ビルダー)
取り込めるファイル
- PDF — 複数ファイル可。1ページずつ分かれた入稿PDFはファイル名順に連結されて1冊になります
- JPG / PNG — 複数可(ファイル名順)
設定項目
| 項目 | 説明 |
|---|---|
| タイトル | ビューア上部・シェア時のOGPに表示。公開後も管理画面から変更可 |
| クライアントID | 半角英数。本棚URL(/shelf/クライアントID)のグルーピングに使用 |
| 変換品質 | 標準(推奨)/高画質(文字の細かいカタログ向け)/軽量 |
| 表示モード | ブック=ページめくり/スライド=横送り・常に単ページ(Instagram風)。公開後の変更は再変換が必要 |
| 見開き表示 | PCで2ページ見開きにする(ブックモードのみ)。スマホは自動で単ページ |
| 開き方向 | 左開き(横書き)/右開き(縦書き・右綴じ。和風カタログなど) |
200ページを超えると警告が出ます(ブラウザのメモリ上限に注意)。
3. AI-OCRと全文検索
「AI-OCRを実行」を押すと、Gemini(AI)が全ページのテキストを読み取り、ビューアに🔍全文検索が付きます。実行しなくても公開はできます(その場合は検索なし)。
- 検索は全角/半角・大文字/小文字・スペースの有無を無視してヒットします
- PDFにしおりが無い場合、各ページの先頭行が目次候補として自動で入ります(手で整えられます)
- 一時的なエラーは自動でリトライされます。万一途中で止まっても、もう一度実行すれば続きから再開します
4. 目次とリンク注釈
目次(もくじ)
見出しと飛び先ページを設定すると、ビューアの「目次」パネルからジャンプできます。PDFのしおり・OCR結果から候補が自動で入り、手動でも自由に追加・並べ替えできます。
リンク注釈
ページ画像の上をドラッグして矩形を描き、URLを設定すると、閲覧者がタップできるリンクになります(「詳しくはこちら」ボタンや商品ページへの誘導など)。クリック数は解析ダッシュボードで確認できます。
YouTubeやGoogleマップのURLも設定可能です(新しいタブで開きます)。
5. 公開設定と共有
公開レベル(3種類)
| レベル | 動き | 向いている用途 |
|---|---|---|
| URLを知る人のみ | 推測困難なURLを知っている人だけ閲覧可(既定) | クライアント限定の提案書・見積など |
| 完全公開 | 誰でも閲覧可 | 一般配布するカタログ |
| パスワード保護 | URL+パスワード(4文字以上)で閲覧 | 社外秘・限定資料 |
その他の設定
- 公開期限 — 指定日の23:59(日本時間)まで閲覧可。期限が切れると専用の終了画面になります
- 本棚に追加 —
book.nicoichi.site/shelf/クライアントIDにカタログ一覧として並びます - PDFダウンロードを許可 — ONにするとビューアに「PDF」ボタンが出ます(既定OFF=配布制御優先)
- GA4 / GTM — クライアントの計測タグを入れたい場合に測定IDを設定
共有
- 公開完了時に表示される
/view/…のURLを送るだけ。QRコードは管理画面のカードから表示できます - URLをLINE・X・FacebookなどにシェアするとOGP(タイトル+表紙画像)付きで展開されます。※パスワード保護ブックは表紙なし
6. カタログ管理(管理画面の最上部)
ビルダーキーを入れて「一覧を読み込み」すると、全ブックがカードで並びます。
- フィルタ — 全て/完全公開/URL限定/パスワード/期限切れのタブと、タイトル・クライアントID検索
- 開く / URL / QR — ビューア表示・共有URLコピー・QRコード表示
- 編集 — タイトル・公開レベル・パスワード・期限・PDF許可を変更。公開後でもすべて即時反映されます(パスワード欄を空にすると現在のパスワード維持)
- 統計 — そのブックの解析ダッシュボードへジャンプ(管理キーが必要)
- 削除… — 編集ダイアログ内。R2上の全画像を消し、共有URLも無効化します(復元不可)
7. 解析ダッシュボード
管理キーを入れて「読み込み」→ ブックを選ぶと詳細が出ます。
| 指標 | 意味 |
|---|---|
| 閲覧数 / ユニーク閲覧 | 開かれた回数/人数(セッション)ベース |
| 平均ページ滞在 | 1ページあたりの平均閲覧時間 |
| 平均訪問時間 | 1人がカタログ全体を見ていた平均時間 |
| ページ別閲覧数 | どのページまで読まれたか(サムネ付き) |
| 離脱ページ TOP | どのページで閉じられたか=改善ポイント |
| リンクエリアクリック数 | リンク注釈がどれだけ押されたか(ページ×URL別) |
| クリックヒートマップ | ページ上のどこがタップされたか(パスワード保護ブックは枠のみ) |
| 流入元 / デバイス | どこから来たか・スマホ/PC比率 |
個人を特定する情報(IPアドレス等)は収集していません。日時表示はUTC(日本時間−9時間)です。
8. クライアント独自ドメイン(サブドメイン型)
catalog.client.com のようなクライアントのサブドメインで閲覧URLを提供できます。パスワード・期限・解析などの機能はすべてそのまま使えます。
Custom Hostnameは100件まで無料。手順の詳細はリポジトリの docs/CLIENT_DOMAIN_GUIDE.md 参照。
9. 外部サーバー公開(クライアントの既存サイト配下)
www.client.com/ebook/catalog2026/ のように、クライアントの既存ドメインのパス配下で公開したい場合に使います(ebook5の「外部サーバー」に相当)。
index.html を、クライアントのサーバーの公開したいディレクトリへファイル名そのままアップロード(FTP等)注意: ビューア本体を大きく更新した場合は再ダウンロード→再設置が必要です。詳細はリポジトリの docs/EXTERNAL_SERVER.md。
10. ビューアの操作(閲覧者向け)
| 操作 | やり方 |
|---|---|
| ページをめくる | ページ端をドラッグ/スワイプ/◀▶ボタン/←→キー。右開きのブックは左へめくると次のページです |
| 任意のページへ | 下部スライダーをドラッグ/「一覧」(サムネイル)/「目次」 |
| 拡大・縮小 | ダブルタップ(ダブルクリック)/ピンチ/+−ボタン。拡大中は高精細画像に自動で切り替わり、ドラッグで移動できます |
| 全文検索 | 🔍ボタン(OCR実行済みのブックのみ)。2文字以上で検索 |
| 全画面 | ⛶ボタン |
| PDF保存 | 「PDF」ボタン(許可されたブックのみ) |
| 共有 | 「共有」ボタンでURLコピー |
11. よくある質問・注意
Q. 画質が物足りない
拡大すると自動で高精細表示になります。それでも通常表示が粗い場合は、ビルダーの変換品質を「高画質」にして再変換してください。
Q. 公開後にタイトルや公開設定を変えたい
管理画面のカード →「編集」からいつでも変更できます。ページの中身(画像)の差し替えだけは再変換→再公開(URL変更)が必要です。
Q. 間違って公開してしまった
編集ダイアログの「削除…」で即時に閲覧不可にできます。急ぎなら公開レベルをパスワード保護に変えるのでも止まります。
Q. たくさん見られたら料金は?
通常規模(月数千閲覧)は無料枠内。1日1,000閲覧を超えるような日が出はじめたら、Cloudflareの有料プラン(月$5)への切り替えを検討してください(切り替えはcs.supportアカウントで、コード変更は不要)。
Q. 右開き・見開きで最後に白いページが出る
右開き×ページ数が奇数のブックの仕様です。気になる場合は偶数ページで入稿してください。
NICO BOOK — 社内向けガイド。技術詳細はリポジトリの CLAUDE.md / docs/ を参照。