WordPressの記事装飾は見出しだけじゃない|H2〜H6一発変換よりパーツ単体変換を選んだ理由

WordPressで記事を書いていると、見出しやBOX、Q&A、箇条書きなど、記事の見た目をもう少し整えたいと思うことがあります。

僕もそうです。

でも毎回CSSを調べて、「これどこに貼るんだっけ?」となるのは面倒ですよね。

だったらCSSが分からなくても、記事を着せ替えられるプラグインを作ればいいじゃん。

そんなところから作り始めたのが、「AIちいちゃんパレット Pro」です。

現在は、記事全体を一発で着せ替えたあと、必要なところだけパーツ単位で変更できる方向へ進めています。

ただ最初から、この形を考えていたわけではありません。

途中では、「H2〜H6を全部まとめて一発変換できたら便利じゃない?」とも考えていました。

ところが実際に使う場面を考えていくと、「あれ?」となったんですよね。

今回は、AIちいちゃんパレット Proの開発中に気づいた、記事装飾は全部まとめて変えるだけじゃなく、必要なパーツだけ変えられた方が使いやすいというお話を書いてみます。


最初は「H2〜H6の見出しを一発でまとめて変換する機能」を考えていた

AIちいちゃんパレット Proには、記事全体をまとめて着せ替える機能があります。

ブルー系。

かわいい系。

追加コーデ。

こうしたコーデを選ぶと、見出しやQ&A、BOX、箇条書きなど、対応している記事パーツをまとめて同じ雰囲気へ変えられます。

ここまではいいんです。

じゃあ次に、H2〜H6の見出しだけをまとめて別デザインへ変えられたら、もっと便利なんじゃない?と思ったんです。

「見出しをまとめて変えられたらラクじゃん」と考えた

たとえば記事全体を着せ替えたあと、「見出しだけ、もう少し違う感じにしたい」と思うこともあるかもしれません。

だったら、H2、H3、H4、H5、H6をまとめて別の見出しセットへ変換できたらラクです。ひとつずつ選んで変更する必要もありません。

なので最初は、「見出し一括変換」という方向を考えていました。

ただ、ここで僕のいつものクセが出ます。

「これ、本当に使う?」です。

開発を進める前に、実際に自分がどう使うか考えてみた

僕は最近、ツールを作るときに「作れるかどうか」だけで決めないようにしています。

作れる。

便利そう。

だから作る。

これを続けると、機能がどんどん増えていきます。そして最終的に、どこに何があるのか分からないツールになってしまうんですよね。

なので最近は、「自分なら本当に使う?」をかなり考えるようになりました。


「一発着せ替えしたあと、見出し全部をもう一回変えるかな?」

ここで改めて、実際の使い方を考えてみました。

僕が一番使う流れは、

  1. 記事全体を一発着せ替え
  2. 全体を見る
  3. 気になるところだけ変更

です。

たとえばブルーコーデを適用したとします。

見出しもいい。

BOXもいい。

全体の雰囲気もいい。

でも、「このQ&Aだけもう少し目立たせたい」とか、「ここの箇条書きだけ別デザインにしたい」となる。

これなら分かります。

でも、記事全体を着せ替えたあとで、

「よし。今度はH2〜H6全部だけ、まとめて別セットへ変えよう」

ってやるかな……?

あまりやらなそう。

ここで気づいたんですよね。僕は見出し全部の再着せ替えが欲しいわけじゃなくて、気になる場所だけ変更できる機能が欲しいんじゃないかと。


ユーザーが本当に変えたいのは「見出し全体」じゃなくて「部分パーツ」だった

正確には、「ユーザー全員がそうだ」という話ではありません。僕自身が実際に使う流れを考えた結果です。

記事全体を一発で着せ替える。そこから、必要なところだけ変える。これが一番自然でした。

全体を着せ替えたあとに触りたくなるのは部分パーツ

たとえば、

  • 見出しはそのまま
  • でもQ&Aだけ変更
  • 箇条書きだけ変更
  • BOXだけ変更
  • ボタンだけ変更

こういう使い方。これならかなりあります。

実際、現在のAIちいちゃんパレット Proでも、

  • 一発着せ替え = 全体
  • パーツ変換 = 部分的な着せ替え直し

という役割分担で考えるようになっています。

ここで、「だったらH2〜H6全部をまとめて変換する巨大な機能より、単体パーツを使いやすくした方がいいじゃん」となりました。


H2〜H6の無理な一発変換はやめて、単体でパーツを選べる設計へシフトした

現在、外部パーツ機能はまだ正式完成ではありません。

試作として「斜めマーカーブルー見出し」を追加し、パーツ一覧へ表示させて選択中のH2へ単体適用するところまでは確認できています。

つまり、外部から新しいパーツを追加して、必要な場所だけ着せ替える土台はでき始めています。

今作ろうとしているのは「もっと使いやすい単体パーツ」

そして今日。この外部パーツ機能をもう少し実用的にしようとしていました。

たとえば、外部パーツのお気に入り表示、H2への一発変換、増えて狭くなってきた上部UIの整理などです。

今できている仕組みを壊さず、「実際に使いやすい状態」まで仕上げるという小規模なバージョンアップですね。

ここも大事で、いきなりH2〜H6、Q&A、BOX、リストと全部追加するつもりはありません。

まずH2。使う。確認する。問題なければ次。

今は、「1機能追加 → 動作確認 → 安定版保存 → 次」という開発方法をかなり意識しています。


洋服と同じで「全部セット」じゃなくて「好きなパーツを重ねる」のが一番ラク

これを考えていて、やっぱりクローゼットの考え方と合ってるなと思いました。

AIちいちゃんパレット Proでは、コーデ=記事全体の服として考えています。

だったらパーツは、上着、靴、バッグみたいなものです。

全身コーデを着る。でも靴だけ変える。バッグだけ変える。これって普通ですよね。記事も同じです。

ベースのコーデを着てから、気になるパーツだけ着せ替える便利さ

使い方はかなりシンプルです。

まず記事全体を一発着せ替え。

そのあと、見出しはそのまま、Q&Aだけ変更、箇条書きだけ変更、必要ならボタンだけ変更。

これでいい。

全部をゼロからひとつずつ装飾する必要もないし、全部セットのまま使わなきゃいけないわけでもありません。

セット+単品。これが一番使いやすそうです。

妥協ではなく、使い方を考えたらこっちだった

最初は「H2〜H6をまとめて変更できたら便利そう」と思っていました。

でも実際の使い方を考えてみると、そこまで必要じゃなかった。だったら作らなくていい。

最近こういうことが多いです。機能を追加しようとして、途中で「これ、いらなくない?」となる。

昔なら「せっかく考えたんだから作ろう」となっていたと思います。

でも今は違います。使わない機能なら作らない。これもツールを作っていて覚えたことです。


そして今日、単体パーツをバージョンアップしようとしたら……

そんなわけで今日は、外部パーツ機能をもう少し使いやすくしようとしていました。

お気に入り。

H2一発変換。

上部UI整理。

よし、次のバージョン作ろう!となったところで。

ChatGPT Workの使用上限。

まじか(笑)

前にもメルマガツールを作り続けて上限になりましたが、またです。

今回も「完成しました!」ではありません。完成させようとしたところで止まりました。

なので、現在の外部パーツはまだ試作・検証段階。今日やろうとしていたバージョンアップも途中です。

でもまあ。これも実践記です。


まとめ:最初から完璧を目指さなくても、使ってみると正解が見えてくる

今回改めて思ったのは、ツールって最初に完璧な完成図を作ってその通りに作るだけじゃないんですよね。

考える。

作る。

使う。

「あれ?」となる。

考え直す。

方向を変える。

そしてまた作る。

僕の場合はこの繰り返しです。

今回も「H2〜H6を全部まとめて変換」という方向から、「必要なパーツだけ単体で着せ替える」という方向へ変わりました。

そして今は、

  1. 記事全体を一発着せ替え
  2. 気に入った部分はそのまま
  3. Q&A・箇条書き・見出しなど、必要な場所だけ変更

という使い方が一番しっくりきています。

今日その続きを作る予定だったんですけどね。Work上限です。

なので続きは、リセットされてから。開発って、こういうもんなのかもしれません(笑)

今回僕がたどり着いた「パーツ単位で自由に着せ替える考え方」や、具体的にどんな組み合わせができるのかについては、AIちいちゃんクローゼットの記事で詳しく解説しています。気になる方はこちらも覗いてみてください。

WordPressの記事装飾は全部セットじゃなくていい|見出し・Q&A・箇条書きを好きに組み合わせる考え方

アンリミ特典付きレビュー
10年前に挫折した僕が、AIちいちゃんと再挑戦。
特典を見る →