装飾に凝りだして本文が終わらない人へ——SWELLでデザインを固定化する
※本記事にはプロモーションが含まれます。
記事を書くつもりでWordPressを開いたのに、気づいたら2時間、ボックスの色を選んでいた——覚えがあるなら、この記事はあなた向けです。
装飾いじりは、集中が深く入るタイプの人にとって最悪の沼です。楽しいし、手応えもあるし、「サイトを良くしている」という大義名分まである。だから止まらない。そして本文は1文字も進んでいない。筆者もこのパターンで、書きかけの記事を何本も塩漬けにしてきました。
これは意志の弱さの問題ではありません。目の前に選択肢が多すぎることの問題です。色・余白・角丸・フォント——選べるものがある限り、こだわり始めたら終わりがない。だから対策は「我慢する」ではなく、デザインの選択肢を最初にゼロにする(固定化する)ことです。
この記事では、WordPressテーマSWELLを「デザインを固定化する装置」として捉え直し、Claude Codeと組み合わせて装飾で迷う余地そのものを消す考え方と手順を解説します。
装飾沼の正体:選択肢がある限り、過集中は止まらない
装飾沼にはまる流れは、だいたいこうです。
- 本文を書き始める前に「見出しのデザインだけ整えよう」と思う
- CSSやカスタマイザーを開く。選択肢が無限にある
- 集中が深く入る。時間の感覚が消える
- 気づいたら数時間経過。本文はゼロ。やる気だけが減っている
厄介なのは、装飾いじりが「サボり」に見えないことです。手は動いているし、サイトは(ほんの少し)良くなっている。でも読者を連れてくるのは装飾ではなく本文です。装飾に沈んだ時間は、ほぼそのまま機会損失になります。
そして「今日は装飾をいじらないぞ」という決意は、だいたい機能しません。選択肢が目の前にある限り、また開いてしまうからです。必要なのは決意ではなく、そもそも選べない状態を作る設計です。
対策:デザインは「決める」のではなく「固定化する」
固定化とは、次の状態を作ることです。
- デザインの判断はテーマに丸投げする(自分で決めない)
- 使う装飾パターンを最初に数種類だけ決めて、ルールとしてファイルに書き出す
- 記事を書くときは、そのルールの範囲内しか使わない(=毎回の判断が発生しない)
「毎回ベストな装飾を考える」のをやめて、「一度決めた型を機械的に当てる」に切り替える。決断の総量を最初の1回に圧縮するイメージです。そしてこの「型をファイルにしておく」やり方は、AIに記事を書かせる運用と極めて相性が良い。ここでテーマ選びの話につながります。
なぜSWELLなのか:基準は「AIが扱いやすいか」
AIで記事を作る前提に立つと、WordPressテーマ選びの基準は「デザインの好み」から「AIが扱いやすいか」に変わります。その観点でSWELLが有力な理由は3つです。
- 専用ブロックの装飾がHTMLパターンとして規則的:キャップ付きボックスやマーカーなどの装飾がシンプルなマークアップで再現でき、Claude Codeに「SWELL用のHTMLで出力して」という指示が通しやすい
- 利用者が多く、Web上に情報が豊富:国内で広く使われているため、Claude Codeに「SWELLでの設定方法」を聞いたときに正確な答えが返りやすい
- ブロックエディタ完全対応で手直しが速い:AI出力を貼り付けたあとの微調整が苦にならない
もうひとつ、固定化の観点で重要なのがSWELLの思想です。SWELLは「装飾はテーマの専用ブロックから選ぶだけ」という設計になっていて、CSSを書いて無限にカスタマイズする方向にユーザーを誘導しない。つまり、テーマ自体が「選択肢を絞る」方向にできています。装飾沼に沈みやすい人にとって、これは機能というより安全装置です。
📌 【公開前に対応】TODO: SWELL購入後に実スクショ・使用感を追記(導入前後で1記事の装飾時間がどう変わったか)
SWELLの基本情報
| 項目 | 内容 |
|---|---|
| 価格 | 17,600円(税込・買い切り) |
| ライセンス | 複数サイトでの使い回しOK |
| 特徴 | ブロックエディタ完全対応・表示速度・シンプルな操作性 |
買い切りで複数サイトに使えるため、2サイト目以降は実質無料です。サブスクではないので「使っていないのに払い続けている」という事故も起きません。
実践:Claude Codeに「SWELL仕様の記事」を書かせる型
ここからは、固定化を実際のワークフローに落とす手順です。Claude Codeをまだ入れていない方は、先にこちらをどうぞ。
📌 【公開前に対応】TODO: 内部リンク: claude-code-install-guide(コピペだけで終わるClaude Codeの始め方)公開済みなのでURL挿入
手順1:装飾ルールを1つのファイルに書き出す
作業フォルダに swell-style-guide.md というファイルを作り、自分のサイトで使う装飾のHTMLパターンを書いておきます。このファイル作り自体もClaude Codeに任せられます。
SWELLのブロック(キャップ付きボックス、マーカー、ふきだし、ステップ)を
WordPressのブロックエディタに貼り付けられるHTML形式でパターン集にして、
swell-style-guide.md に保存してください。ポイントは、ここで使う装飾を数種類に絞って書くことです。「注意点は赤系ボックス」「コツは黄色系ボックス」のように用途と装飾を1対1で対応させておくと、以後「どの装飾にするか」という判断そのものが消えます。
手順2:スタイルガイドを参照させて執筆させる
swell-style-guide.md の装飾パターンを使って、
「(キーワード)」の記事を装飾込みのHTMLで書いてください。
- 重要文はマーカー
- 注意点は赤系ボックス、コツは黄色系ボックス
- 手順はステップブロック
- article.html に保存生成されたHTMLをWordPressのカスタムHTMLブロックに貼れば、装飾済みの記事がそのまま入る——という流れです。自分の手で装飾を選ぶ工程が最初から存在しないので、沼に入る入口ごと塞がります。
📌 【公開前に対応】TODO: SWELL購入後に実スクショ・使用感を追記(貼り付け後のエディタ画面と実際の表示。実際に貼って表示崩れがないかの検証結果もここで書く)
手順3:一度作ったら「型」として使い回す
この仕組みの本質は、装飾ルールが自分の頭の中ではなくファイルになっていることです。
- 記事ごとにデザインがブレなくなり、サイト全体に統一感が出る
- 「前の記事、どの装飾使ったっけ」と思い出す必要がない(忘れる前提の設計)
- デザインを変えたくなったら、スタイルガイドを1箇所直すだけ
「デザインを変えたい欲」が湧いたときも、いじっていいのはこのファイル1つだけ、と決めておけば被害範囲が限定されます。過集中が起きても、沈む先がファイル1枚なら数時間は溶けません。
無料テーマ(Cocoon)ではダメなのか?
始められます。無料で高機能なCocoonは立派な選択肢です。
ただしAI運用の観点では、装飾のマークアップが複雑になりがちで、AIへの指示が長くなる傾向があります。指示が長くなるほど出力は安定しにくくなり、手直しが増える。手直しが増えると、そこからまた装飾いじりが始まる——という逆流リスクがあります。
「AIに書かせる時代のテーマ代は、デザイン費ではなく自動化への投資」と考えると、買い切り17,600円は回収が早い部類です。装飾に溶かしていた時間が時給換算でいくらだったかを思い出すと、判断はそう難しくないはずです。
まとめ:選択肢を消せば、過集中は本文に向かう
- 装飾沼は意志の問題ではなく、選択肢が目の前にあることの問題。対策は我慢ではなく固定化
- AI時代のテーマ選びの基準は「AIが扱いやすいか」。SWELLは装飾パターンが規則的で、スタイルガイド化→AI出力→貼り付けの流れが作りやすい
- 装飾ルールをファイル化すれば、毎回の判断が消え、デザイン変更の被害範囲も1ファイルに限定できる
過集中そのものは、消すべき敵ではありません。向かう先を装飾から本文に付け替えるだけで、いちばんの武器になります。そのための最初の一手が「デザインを自分で決めない」という決断です。
📌 【公開前に対応】TODO: 内部リンク: claude-code-blog-prompts(書き始められない人のためのプロンプト集)公開後にURL挿入
📌 【公開前に対応】TODO: 内部リンク: claude-code-wordpress-auto-post(WordPress自動投稿)公開後にURL挿入
【免責事項】※当サイトは医療情報を提供するものではありません。診断・治療に関する判断は医療機関にご相談ください。また、当サイトはアフィリエイトプログラムを利用しており、記事内のリンク経由で商品・サービスに申し込みがあった場合、運営者が報酬を受け取ることがあります。料金・キャンペーン情報は執筆時点のものです。最新の情報は各公式サイトをご確認ください。
