Kashiwazaki SEO Step Flow マニュアル
記事の中の「手順」や「作業の流れ」を、STEP 01 → STEP 02 → … の形で見やすく表示するプラグインです。ステップの設置と入力はブロックエディターの中で完結し、ページに表示した手順から HowTo 構造化データ（JSON-LD）を自動で出力します。
手順の説明は、ただの箇条書きにすると「どこからどこまでが 1 ステップなのか」が読者にも検索エンジンにも伝わりにくくなります。このプラグインは、ステップ名と説明文を分けて入力する形にすることで、見た目の分かりやすさと、機械が読み取れる構造の両方を同時に用意します。デザインは 6 種類から選べ、サイト全体の既定を決めたうえで、ブロックごとに別のデザインへ切り替えることもできます。
このマニュアルの読み方
はじめての方は「インストール・初期設定」→「ブロックの使い方」の順に読めば、最初のステップフローを記事に置くところまでたどり着けます。見た目を変えたくなったら「デザインを選ぶ」、構造化データの中身を知りたくなったら「HowTo 構造化データ」を参照してください。
主要機能
ブロックで作る
ブロックエディターに「Kashiwazaki SEO Step Flow」を追加し、デザインが表示された画面のままステップ名と説明文を入力します。追加・並べ替え・削除は通常のブロック操作と同じです。既存の番号付きリストからの変換にも対応します。
6つのデザイン
タイムライン・カード・ビッグナンバー・アローリボン・ホリゾンタル・ミニマルの 6 種類。サイト全体の既定デザイン、アクセントカラー、ステップの前に付くラベルを決めたうえで、ブロックごとに上書きできます。
HowTo 構造化データ
ステップが 2 つ以上あるフローから HowTo（JSON-LD）を出力します。名前も各ステップも、ページに表示されている文字だけから作ります。ブロック単位・サイト全体のどちらでも出力を止められます。
実際の表示
記事の中では次のように表示されます。下の例は「アローリボン」デザインで、直前の見出し「記事制作と公開のフロー」がそのまま HowTo の名前として使われる形です。
SEO / GEO における強み
SEO（検索エンジン最適化）の観点
- 手順を順序付きリスト（
<ol>と<li>）として出力し、1 ステップごとに「ステップ名」と「説明文」を別々の要素に分けます。手順の順序と区切りが HTML の構造から読み取れる形になります。 - ステップ番号とラベル（STEP 01 など）は CSS の装飾ではなく HTML のテキストとして出力します。スタイルが読み込まれない環境でも、順番の情報が本文に残ります。
- ステップ名を見出しタグ（
h2〜h6）にしません。記事の見出し階層を崩さずに手順を挿入できます。 - HowTo 構造化データは、ページに表示されている文字だけから作ります。「ページ上でユーザーに見えないコンテンツをマークアップしない」という構造化データのガイドラインに沿った出力になります。
- フロントに読み込むのは CSS 1 ファイル（約 20KB、gzip 圧縮時 約 3KB）のみで、JavaScript は読み込みません。さらに、ステップフローを含むページでのみ読み込みます。ページの表示速度を低下させにくい構成です。
GEO（生成エンジン最適化 / AI 検索）の観点
- ステップ名と説明文が別の要素に分かれているため、AI が「手順 1 は何か」を 1 つのまとまりとして取り出しやすい構造になります。
- JSON-LD の各ステップは
position（順番）・name（ステップ名）・text（説明文）を持ちます。手順を順序付きの構造として読み取る助けになります。 - 本文の表示内容と JSON-LD の内容が一致するため、「表示と構造化データが食い違っている」状態が起きません。
ここに挙げたのは「検索エンジンや AI が判断するための材料となる出力を、プラグインが作る」という意味です。順位が上がることや AI に引用されることを保証するものではありません。評価は検索エンジンや AI 側の判断によります。
HowTo リッチリザルトについて
Google 検索での HowTo リッチリザルト（検索結果に手順が展開される表示）は 2023 年に終了しています。このプラグインの HowTo 出力は、検索エンジンや AI が手順の構造を読み取るためのマークアップとして役立てるものであり、検索結果での特別な見た目を得るためのものではありません。
目次
- 概要 - プラグインの全体像と主要機能、SEO / GEO の観点
- インストール・初期設定 - 導入手順と、最初のステップフローを置くまで
- ブロックの使い方 - 入力・追加・並べ替え・リストからの変換・ブロック単位の設定
- デザインを選ぶ - 6 デザインの見本と使い分け、表示幅による自動調整
- 管理画面 - デザイン設定・設置箇所一覧・使い方の 3 タブと全設定項目
- ショートコード -
[ks_stepflow]の書き方と属性一覧 - HowTo 構造化データ - 名前の決まり方、出力される条件、確認方法
- トラブル・FAQ - 症状別の対処、動作要件、技術仕様
動作要件
- WordPress 6.3 以上
- PHP 7.4 以上
- ブロックエディター（クラシックエディターの場合はショートコードで設置します）
データベースにテーブルを追加しません。外部サーバーとの通信も行いません。設定は wp_options の ks_stepflow_settings 1 件だけに保存します。