Skip to content

SC-007 メール画像ショートコード

概要

  • 指定ホール・日付に対応するメール画像を取得し、ページ内に埋め込み表示する。
  • hall(ホール名)と date(日付)を属性で受け取り、MailImageConverter でバリデーション・DTO 変換後、MailImageControllerMailImageService 経由で画像情報を取得、View で HTML にレンダリングする。

ワイヤーフレーム

同一 UI の記事埋め込み枠は PUB-001MailImageBlock(P-7)と共有する。

ブロック一覧

ブロックIDブロック名表示内容初期値ユーザー操作アクション
B-0メール画像シェル日時ラベル+枠(P-WORLD メール HTML または空メッセージ)+引用キャプション常時表示スクロール有効化(本番 P-WORLD 時)-

表示条件・注記

  • 属性: hall / date 必須。
  • メール無し: date + empty content シェルを残す(読込中/失敗と区別)。
  • 管理画面: 出力なし。日別記事テンプレ経路は REST 遅延取得あり。
  • ワイヤーフレーム: メールありの通常ケースをサンプル表示。

メイン画像のファイル名と配置(運用前提)

メインのブログ用静止画は、MailImageService画像ファイル名を規則に従って連結して URL を組み立て、View(MailImage)がその URL を img 等に渡して表示する実装になっている。表示に先立ち、次の規則で メディアサーバー(本番では wp-content/uploads/ 配下)に同名ファイルを保存・公開しておく必要がある。

ファイル名の規則

次の 1 ファイルを 1 枚のメイン画像として参照する。

{YYYYMMDD}{HallEnum の値}_blog.png

  • {YYYYMMDD}: ショートコードの date 属性(例: 20240101
  • {HallEnum の値}: 対象ホールの HallEnum英小文字の列挙値island / espasu / bigapple / uno)。日本語のホール名ではない。

ベース URL は AppConstants::IMAGE_BASE_URLhttps://www.slotkouryaku.com/wp-content/uploads/)。
連結例: https://www.slotkouryaku.com/wp-content/uploads/20240101island_blog.png

ファイル名の例(保存が必要な名前)

ショートコード例(抜粋)必要なファイル名(uploads/ 直下相当)
hall="アイランド秋葉原" date="20240101"20240101island_blog.png
hall="エスパス秋葉原" date="20240101"20240101espasu_blog.png
hall="ビッグアップル秋葉原" date="20240101"20240101bigapple_blog.png
hall="秋葉原uno" date="20240101"20240101uno_blog.png

※ コード参照: core_src/Service/mail_image_service/MailImageService.php$image_url の組み立て)、core_src/Constants/AppConstants.phpIMAGE_BASE_URL)。

P-WORLD メール HTML 内画像の遅延読み込み

P-WORLD アーカイブの processed_html を表示するとき、サニタイズおよび GIF 差し替え(PworldMailStillGifSrcReplacer)の後に PworldMailDisplayMediaCacheBust::append_to_fragment_html が同一 DOM 走査内で GIF の <img> に次を付与する(src のパスが .gif のもののみ。既存の loading / decoding 属性がある場合は上書きしない)。

属性目的
loadinglazyビューポート外の GIF 取得を遅延し、初回表示のネットワーク負荷を軽減
decodingasync画像デコードをメインスレッド負荷から切り離す

MailImage ブロックは 日別記事テンプレート経路のみ プレースホルダ + REST(GET /async-mail-image)で遅延取得する(Issue #2191)。既存投稿本文に直書きされた [MailImage] ショートコードは同期のまま。P-WORLD メール HTML 内 GIF には loading="lazy" / decoding="async" を付与済み(PR #2181、Refs #2180)。全体フローは 日別記事 初期描画フロー を参照。

外部インターフェース

ショートコードタグ

  • タグ名: [MailImage]
  • 入力例: [MailImage hall="アイランド秋葉原" date="20240101"]

属性一覧

属性役割必須
hall対象ホール名(HallEnum 対応)
date対象日付(YYYYMMDD 形式)

エラー

条件ユーザー向け挙動メッセージ / ログ
hall 未指定または不正値バリデーションエラーメッセージ表示(esc 済)ShortCodeHelper 経由でバリデーションログ出力
date 未指定または YYYYMMDD 形式不正バリデーションエラーメッセージ表示(esc 済)ShortCodeHelper 経由でバリデーションログ出力
サービス・コントローラーの Throwableエラーが発生しました:execute_if_not_adminerror_log(先頭 [ShortCodeHelper]

更新不可とみなすもの(git管理外の内容に依存し、リポジトリだけでは追従できない依存)

  • ショートコード名 MailImage を変更しない
    • 理由: 既存投稿本文にショートコードタグが直書きされているため
  • 属性名 hall / date を変更しない
    • 理由: 既存投稿本文に属性名が直書きされているため