前編・中編に続いて、後編ではテキスト装飾・リスト・段落デザイン・テーブル・レイアウト制御・ボタン・共通コンテンツ機能を紹介します。
SYN Block以外にも、Synには「地味だけど便利」な機能がたくさんあります。
テキスト装飾──Syn独自の書式機能
マーカー（4色）
書式ツールから選べるマーカーは4色。それぞれにクラス名が割り当てられています。
manpuqu.comでは前編で説明したカラーセット設計と連動させて使っています。マーカーの色も「意味を持った色」として使うと、記事全体に統一感が生まれます。
きいろマーカー（is-yellow） オレンジマーカー（is-orange） みずいろマーカー（is-sky） きみどりマーカー（is-green）
たとえばG検定記事では、試験でよく問われる用語にオレンジ、10秒で説明できる定義にみずいろ、といった形で使い分けています。
インラインアイコン・文字色
テキストの途中にアイコンを挿入できます。書式ツールのアイコン一覧から選ぶか、SVGコードを直接貼り付ける方法もあります。
文字色もカラーセットと連動させられます。試験重要のポイントを赤で強調したり、10秒説明の箇所を青にしたり。マーカーとは異なる使い方ができます。
リスト拡張──4種類のデザイン
WordPressの標準リストブロックに、Synが独自のデザインを4種類追加しています。カラーセットとの組み合わせも可能です。
アイコンリスト：
ドットリスト：
- 教師あり学習（Supervised Learning）
- 教師なし学習（Unsupervised Learning）
- 強化学習（Reinforcement Learning）
丸番号リスト：
- 教師あり学習（Supervised Learning）
- 教師なし学習（Unsupervised Learning）
- 強化学習（Reinforcement Learning）
三角リスト：
- 教師あり学習（Supervised Learning）
- 教師なし学習（Unsupervised Learning）
- 強化学習（Reinforcement Learning）
チェックリスト的な使い方をしたいときはアイコンリスト、手順の要点整理には丸番号リスト、と使い分けています。
段落デザイン
通常の段落ブロックに、Synが2種類のデザインを追加しています。
背景色付き段落
右パネルの「色」→「背景」から背景色を設定できます。カラーセットの薄い色（ライト色）を使うと、強調しすぎず読みやすい囲みになります。
【構造理解】機械学習は「データからパターンを学ぶ」アプローチです。人間がルールを明示的にプログラムするのではなく、データそのものからルールを発見させます。
【試験重要】ディープラーニングは機械学習の一手法です。「AIの中に機械学習があり、機械学習の中にディープラーニングがある」という包含関係を押さえておきましょう。
三角のあしらい
右パネルの「スタイル」から「三角のあしらい」を選ぶと、段落ブロックの左上に三角のアクセントが付きます。カラーセットと組み合わせると、ブロック全体に色がつきます。
【10秒説明】強化学習とは、エージェントが環境と相互作用しながら「報酬を最大化する行動」を試行錯誤で学ぶ手法です。
【間違えやすい】「学習率が高い＝良い」ではありません。学習率が高すぎると最適解を飛び越えてしまい、収束しなくなります。
テーブル（横スクロール対応）
WordPressの標準テーブルブロックに、Synが「横スクロール」機能を追加しています。右パネルからONにするだけで、スマホでも表がはみ出さず横スクロールで見られるようになります。
G検定では「似た用語の比較」が頻出なので、比較表との相性が抜群です。
| 手法 | 学習データ | 目的 | 代表アルゴリズム |
|---|---|---|---|
| 教師あり学習 | ラベルあり | 分類・回帰 | 線形回帰、SVM、決定木 |
| 教師なし学習 | ラベルなし | クラスタリング・次元削減 | k-means、主成分分析（PCA） |
| 強化学習 | 報酬信号 | 行動の最適化 | Q学習、DQN |
レイアウト制御
デバイス表示切り替え
ブロックごとに「すべて」「PCのみ」「スマホのみ」「非表示」を書式ツールから設定できます。
たとえば、PCでは横並びの説明図を表示して、スマホでは縦積みのシンプルなリストに切り替える、といった使い方ができます。
ブロック単位の余白調整
Synの余白設計は「上マージンで統一」です。書式ツールから上マージンをブロック単位で調整できます。
「このブロックの前だけ少し詰めたい」「ここは広めに空けたい」という細かい調整が、CSSを書かずにエディター上でできます。地味ですが、記事の読みやすさに直結する機能です。
ボタンリンク
WordPressのボタンブロックに、Synのメインカラーと角丸設定が自動で反映されます。カスタマイザーで設定したサイトカラーがそのままボタンの色になるので、サイト全体の統一感が保てます。
記事末の誘導や、関連記事へのCTA（行動喚起）として使いやすいブロックです。
共通コンテンツ機能がかなり便利だった
これ、地味に一番気に入っている機能かもしれません。
「共通コンテンツ」として登録したブロックの組み合わせを、ショートコード一行で複数の記事から呼び出せる機能です。
たとえばmanpuqu.comでは以下を共通化しようとしています。
- G検定シリーズの記事一覧への導線
- 「この記事の読み方」（カラーセットの色の意味説明）
- NotebookLM音声解説への案内
- 記事末のお問い合わせ誘導
一度作って登録しておけば、あとは の一行で呼び出せます。しかも、共通コンテンツ側を修正すれば全記事に一括反映されます。
「記事末の定型文を全部直したい」という場面が来たとき、この機能の価値を実感するんだろうなと思っています。
まとめ──「テーマを変えました」ではなく「知識をどう届けるか」を設計しています
Synに移行して数週間。正直に言うと、まだ全部は使いこなせていません。
ふきだしのキャラクター登録もこれから。共通コンテンツの整備もこれから。カスタムCSSの資産化もこれから。やりたいことはたくさんあります。
でも、移行してよかったとはっきり思っています。
Synを使う中で気づいたのは、「ブロックを積む」というテーマの思想と、「知識を構造化して届ける」という自分の書き方が、同じ方向を向いているということでした。
ステップブロックで流れを見せる。QAブロックで試験対策を落とし込む。アイコンボックスで役割を色分けする。目次で全体像を先に示す。これらは全部、「読者にどう理解してもらうか」を考えた結果です。Synはその設計を、コードを書かずに実現させてくれます。
欠点も正直に書いておきます。
- HTMLクラス名がマニュアル非公開
- CSSでカスタマイズしたい場合は、自分でDevToolsを使ってクラス名を調べる必要があります。これはノーコード前提の設計思想の裏返しでもあります。
- 賢威からの移行コスト
- クラス名の体系が異なるため、スタイルの引き継ぎはできません。既存記事のカスタムCSSがある場合は修正が必要です。
- 情報がまだ少ない
- 2025年リリースの新しいテーマなので、ネット上の事例や解説記事はまだ多くありません。困ったときは公式マニュアルかDevToolsが頼りです。
それでも、今のmanpuqu.comの方向性──AI学習・G検定・WordPress運営を、文系シニア目線で整理する知識ブログ──には、Synがよく合っていると感じています。
今後の展望をざっくり書くと、こんな感じです。
-
UIパターン化（進行中）
ステップ・QA・アイコンボックスの使い方を記事ごとに固定し、読者が「色と構造で意味を読める」状態を作る。
-
共通コンテンツの整備（これから）
シリーズ記事の導線・読み方の説明・音声解説への案内などを共通化。記事の入口と出口を統一する。
-
manpuqu式学習システムへ（目標）
記事の集合ではなく「manpuqu方式で学ぶ体験」を設計する。G検定・AI・土木AIの記事が同じUI思想でつながっている状態。
「テーマを変えました」で終わるつもりは、最初からありませんでした。
Synというテーマを使いながら、「知識をどう届けるか」を少しずつ設計しています。その過程をこれからも記録していきます。
