Appearance
有料記事 固定セクション ↔ ショートコード対応表
概要
- 有料記事(CPT
paid_article)の 固定セクション 8 本 および オプションセクション について、既存ショートコード・データ機能との対応方針を確定する。 - 正本のセクション定義は CPT-002 有料記事テンプレート構成設計。本書は #2385 の成果物として、実装 Issue(#2388 等)への引き継ぎ資料とする。
- Issue #2381 メモの「新台導入初日のデータ比較」は、CPT-002 の #2 初週のデータ比較 に統合する(導入初日を初週の先頭日として SC-009 で表示する)。
関連 Issue
| Issue | 内容 |
|---|---|
| #2381 | 親 Issue(有料記事の体制を整える) |
| #2383 | CPT-002 テンプレート構成設計 |
| #2385 | 本書(固定セクションと既存機能の対応整理) |
| #2388 | 固定セクションテンプレート実装 |
| #2386 | 画像スナップショット方針 |
| #2391 | 画像スナップショット機能の実装(方針は #2386) |
ワイヤーフレーム参照
有料記事テンプレート全体の React ワイヤーフレームは 未作成(#2388 で複合ワイヤーフレーム要否を判断)。各セクションの UI は連携先ショートコード/公開画面の既存ワイヤーフレームを参照する。
| 固定 # | 見出し | 主な連携 SC | ワイヤーフレーム | プレビュー |
|---|---|---|---|---|
| 1 | 冒頭挨拶 | — | なし | — |
| 2 | 初週のデータ比較 | SC-009 | なし(非同期カード) | SC-009 |
| 3 | 来月の導入台 | — | なし | — |
| 4 | 月差枚数 | hall_samai_graph | なし | — |
| 5 | 機種差枚数ランキング | SC-017 | あり → PUB-005(表レイアウト参考) | SC-017 を参照 |
| 6 | 増台・減台の結果 | SC-015 | SC-015 専用 WF なし。PUB-001 P-16 | PUB-001 説明を参照 |
| 7 | 新台出玉推移 | snapshot | SC-016 グラフ部分(PUB-005 B-4) | PUB-005 を参照 |
| 8 | ホール差枚数ランキング | SC-019 | なし | SC-019 を参照 |
オプションセクション(固定 8 本以外)
| 種別 | meta キー | 主な連携 SC | 備考 |
|---|---|---|---|
| 特定機種結果(オプション) | paid_article_section_smr_{instance_id} | SC-009 + SC-010 + snapshot | CPT-002「オプションセクション仕様」参照。sections_order で任意位置 |
| 可変セクション | paid_article_section_vs_{instance_id} | — | 手動 HTML。ショートコード埋め込み可 |
bash
npm run docs:dev
# http://localhost:5173 → 公開画面 > PUB-005(PeriodKishuSamaiRankingWireframeReactHost)固定セクション ↔ ショートコード対応表
基本メタ(固定セクション外)
| 項目 | meta_key | 連携先 | 対応方針 |
|---|---|---|---|
| 号数 | paid_article_issue_number | — | 手動 |
| 対象年月 | paid_article_target_month | — | 手動(YYYY-MM)。月次期間の自動算出の基準(下記「月次期間算出」) |
固定セクション 8 本
| # | 見出し | meta_key | 推奨 SC(タグ名) | 属性テンプレート(コピペ用) | 入力方式 | 対応方針 |
|---|---|---|---|---|---|---|
| 1 | 冒頭挨拶 | paid_article_intro | — | — | 手動 | 手動 |
| 2 | 初週のデータ比較 | paid_article_new_machine_first_week | SC-009 kishudata + SC-010 period_samai_summary | 初日: [kishudata day="{intro_day}" hall="{hall}" kishu_id="{kishu_a}'_'{kishu_b}"] / 初週サマリー: [period_samai_summary period_start="{week_start}" period_end="{week_end}" hall="{hall}" kishu="{kishu}"] × 機種数 | 手動 + 自動 | 既存流用 |
| 3 | 来月の導入台と期待感 | paid_article_next_machine_comment | db_new_machine_info(対象月翌月) + 手動コメント | 新台情報テーブルから機種名・導入日を自動表示(machine_name で重複排除、最早導入日を採用)。期待感は html フィールドで任意入力 | 手動 + 自動 | 手動 + 自動 |
| 4 | 月差枚数 | paid_article_month_diff | hall_samai_graph | ホールごと: [hall_samai_graph halls="{hall}" period_start="{3m_start}" period_end="{3m_end}" mode="monthly"](直近3暦月・日次累計を月別折れ線で重ね表示) | 手動 + 自動 | 新規 SC |
| 5 | 機種差枚数ランキング | paid_article_ranking | SC-017 kishu_samai_3months_ranking | [kishu_samai_3months_ranking hall="{hall}" target_month="{target_month}"] | 手動 + 自動 | 新規 SC(#5 専用) |
| 6 | 増台・減台の結果 | paid_article_machine_count | SC-015 + SC-010 | 一覧: [kishu_count_delta_list period_start="{month_start}" period_end="{month_end}" hall="{hall}"] → 抽出機種ごとに SC-010(CPT-002 #6 節) | 手動 + 自動 | 既存流用 |
| 7 | 新台出玉推移 | paid_article_new_machine_trend | period_kishu_samai_ranking_snapshot | [period_kishu_samai_ranking_snapshot hall="{hall}" period_start="{trend_start}" period_end="{month_end}" kishu="{kishu_a},{kishu_b}" display="graph"] | 手動 + 自動 | 既存流用 |
| 8 | ホール差枚数ランキング | paid_article_hall_samai_ranking | SC-019 hall_samai_ranking | [hall_samai_ranking halls="{hall_a},{hall_b}" target_month="{target_month}"] | 手動 + 自動 | 新規 SC(#8 専用) |
オプションセクション(特定機種結果)
| 種別 | meta キー | 推奨 SC(タグ名) | 対応方針 |
|---|---|---|---|
| 特定機種結果 | paid_article_section_smr_{instance_id} | SC-009 + SC-010 + period_kishu_samai_ranking_snapshot | 旧固定 #7 をオプション化(#2553)。公開表題は section_title(必須) |
ショートコード補足(設計書未整備分)
| タグ名 | 概要 | 設計書 | 有料記事での位置づけ |
|---|---|---|---|
period_kishu_samai_ranking_snapshot | フォームなしの静的ランキング表・折れ線グラフ。kishu はカンマ区切り必須。display: both / ranking / graph | 未整備(実装あり) | 固定 #7 の埋め込み向き。#5 は SC-017 を使用 |
月次期間算出
paid_article_target_month(例: 2026-02)から各ショートコード属性へ渡す日付を算出するルール。
| 用途 | 算出ルール |
|---|---|
当月 month_start | target_month の 1 日(YYYYMMDD、例: 20260201) |
当月 month_end | target_month の末日(例: 20260228) |
| 直近 3 か月(#4) | target_month を含む連続 3 暦月。#4 は期間全体を period_start / period_end に指定 |
| 初週(#2) | JSON の intro_day(導入初日)を起点に 7 日間、または week_start / week_end を明示指定 |
| 特定機種結果(オプション) | intro_day の暦月から 2 か月経過した月に該当する機種を対象(下記ギャップ参照) |
| 出玉推移(固定 #7) | 導入日〜month_end、または JSON の period_start / period_end を明示指定 |
日付形式はショートコードごとに YYYYMMDD または YYYY-MM-DD を受け付ける。テンプレート生成時(#2388)は Converter 層で統一する。
REST API / WordPress MCP での JSON 固定セクション
固定セクション(paid_article_* の JSON meta)を REST API または WordPress MCP 経由で更新する場合のフィールド仕様。
| フィールド | 型 | 値の形式 | 備考 |
|---|---|---|---|
halls | string[] | HallEnum スラッグ: island, espasu, bigapple, uno | 日本語ホール名(例: アイランド秋葉原)はサニタイズ時に 無視 される |
kishu_list | int[] | 機種マスタ ID(正の整数) | 管理画面のチェックボックス選択と同じ。機種名文字列は受け付けない |
enabled | bool | セクション表示フラグ | — |
comment | string | HTML 可 | #2 初週以外の JSON セクション向け |
#2 初週のデータ比較(paid_article_new_machine_first_week)専用
| フィールド | 型 | 備考 |
|---|---|---|
comment_before | string | 前半考察。データ連携・グラフの前に表示 |
comment_after | string | 後半考察。データ連携・グラフの後に表示 |
例(月差枚数セクション):
json
{
"enabled": true,
"halls": ["island", "espasu"],
"kishu_list": [101, 202],
"comment": "<p>考察</p>"
}月次更新用ショートコード記述例
プレースホルダ: {hall} = アイランド秋葉原、target_month = 2026-02(month_start = 20260201、month_end = 20260228)。
#4 月差枚数(ホール2件・target_month=2026-02)
[hall_samai_graph halls="アイランド秋葉原" period_start="20251201" period_end="20260228" mode="monthly"]
[hall_samai_graph halls="エスパス秋葉原" period_start="20251201" period_end="20260228" mode="monthly"]#4 月差枚数(旧 SC-010 例・参考)
[period_samai_summary period_start="20260201" period_end="20260228" hall="アイランド秋葉原" kishu="機種A"]
[period_samai_summary period_start="20260201" period_end="20260228" hall="アイランド秋葉原" kishu="機種B"]#5 機種差枚数ランキング(当月・ホール全体・3ヶ月比較)
[kishu_samai_3months_ranking hall="アイランド秋葉原" target_month="2026-02"]#6 増台・減台の結果
[kishu_count_delta_list period_start="20260201" period_end="20260228" hall="アイランド秋葉原,エスパス秋葉原" layout="merged"]SC-015 出力から機種を抽出したあと、各ホール・各機種に対し(変化日を result_period_start とする):
[period_samai_summary period_start="20260210" period_end="20260228" hall="アイランド秋葉原" kishu="変化機種名"]#2 初週のデータ比較(導入初日 + 初週サマリー)
表示順: comment_before → ショートコード群 → comment_after
[kishudata day="20260201" hall="アイランド秋葉原" kishu_id="機種A'_'機種B"]
[period_samai_summary period_start="20260201" period_end="20260207" hall="アイランド秋葉原" kishu="機種A"]
[period_samai_summary period_start="20260201" period_end="20260207" hall="アイランド秋葉原" kishu="機種B"]JSON 例:
json
{
"enabled": true,
"halls": ["island"],
"kishu_list": [101],
"comment_before": "<p>導入前の期待</p>",
"comment_after": "<p>初週の総括</p>",
"intro_day": "20260201",
"week_start": "20260201",
"week_end": "20260207"
}#7 新台出玉推移(グラフのみ)
[period_kishu_samai_ranking_snapshot hall="アイランド秋葉原" period_start="20260201" period_end="20260228" kishu="機種A,機種B" display="graph"]#8 ホール差枚数ランキング(対象月・ホール2件例)
[hall_samai_ranking halls="アイランド秋葉原,エスパス秋葉原" target_month="2026-06"]関連制約と対応方針
| ID | セクション | 制約 | 対応方針 |
|---|---|---|---|
| G-1 | #5 | SC-017 の静的テーブルを使用する | SC-016 埋め込み向け簡易モードは使わない |
| G-2 | 固定 #7 | 3 期間横並び・「上り調子」トレンド UI が存在しない | snapshot display="graph" + 手動考察 or 手動画像 |
| G-4 | 特定機種結果(オプション) | 導入日から 2 か月経過機種の自動抽出ロジックなし | SC-002 索引 + 運用マニュアルで手動選定 |
| G-5 | 特定機種結果(オプション) | 該当機種 0 件の月はセクション非表示(CPT-002 仕様) | enabled: false または kishu_list: [] でテンプレート側がスキップ |
| G-6 | #6 | SC-015 → SC-010 連鎖はテンプレート層のロジック | CPT-002 #6 節どおり。SC 自体の拡張は不要 |
| G-7 | #2 | 初日横並び・初週日次の並べ方はテンプレート設計依存 | intro_day + kishu_list を JSON に追加。初日は SC-009 複数機種、週次は SC-010 |
| G-8 | 全体 | period_kishu_samai_ranking_snapshot の契約 | 本書でタグ・属性・表示モード・エラー契約を定義する |
パフォーマンス・キャッシュ方針
| 観点 | 方針 |
|---|---|
| 更新頻度 | 月 1 回。公開後は過去号を恒久表示するため、公開時点の HTML を正 とする |
| SC-009 非同期 | 初回 HTML はプレースホルダ + API-001-14。有料記事 1 ページに複数 kishudata が並ぶとリクエスト数が増える。固定 #2・オプション特定機種結果は機種数を絞る運用を推奨 |
| SC-016 / snapshot | Chart.js + REST(API-001-15)。固定 #5・固定 #7 が同一ページに複数あると JS/CSS は共有されるが API 呼び出しはブロックごとに発生 |
| ページキャッシュ | 有料記事単体は更新頻度が低いため、編集者向けプレビューはフルページキャッシュを許容。一般訪問者は note 案内ページ(または 404)のみのため漏洩リスクは低い。Phase 2(#2390)導入後は未購読者向け表示と整合を取る |
| Object Cache | 既存ショートコードの DB クエリキャッシュに依存。有料記事専用キャッシュ層は初版では設けない |
| 管理画面プレビュー | 編集者は edit_post 権限で非同期 API にアクセス可能(SC-009 既存仕様) |
スナップショット優先度(#2386 / #2391)
デグレやショートコード仕様変更時に、画像スナップショットへ切り替える優先度。詳細運用は 画像スナップショット方針。
| 優先度 | セクション | 理由 |
|---|---|---|
| 高 | 固定 #5, 固定 #7 | Chart.js・REST 依存。UI 変更の影響が大きい |
| 中 | 固定 #4, 固定 #6, 固定 #8 | 数値サマリー・表形式。仕様変更時に過去号の数値整合が課題 |
| 低 | 固定 #2, オプション特定機種結果 | 日次カード中心。再取得で復旧可能だが API 負荷は要注意 |
| 対象外 | #1, #3 | 手動 HTML。スナップショット不要(本文そのものが正本) |
関連 Issue
| Issue | 内容 |
|---|---|
| #2388 | PaidArticleTemplate ショートコード動的生成 |
| #2547 | セクション表示順とドラッグ UI |
| #2553 | 特定機種結果(オプション)の機種選択・表示 |
| #2386 | 画像スナップショット方針 |