Ghost

Ghost Look & Feel カスタマイズ

aqua

01 5月 2026 • 3 min read

ブログを立ち上げて、本来なら真っ先に機能面のセットアップを済ませるべきなのは分かっている。けれど、初めて触る管理画面のUIを理解しようとあちこちクリックしているうちに、いつの間にか「見た目」のカスタマイズに没頭してしまう――。

今回はテーマやアクセントカラーの変更といった、簡単に印象を変えられるところから着手しつつ、現代的なAIによる画像生成もフル活用して、自分好みのLook & Feelへ一気に寄せてみた。

1. タイトルとユーザー名の「微調整」

最初は他のブログのようにテーマをタイトルにしようと思って「Trial and Error」と付けてみたけれど、実際にカスタマイズを進めていくうちに、もっとシンプルにしたくなった。結局、タイトルは以前同様にドメイン名（nodoka.org）に戻し、元のフレーズはDescription（サイトの説明文）に回すことで落ち着いた。

また、うっかり「Full name」に本名を入れてしまったら、サイト上の投稿者名やシステムが自動生成するメールの署名など、あちこちに表示されて慌てる一幕も。ここもハンドルネームに修正。タイトルやユーザー名は、初期に用意されるポスト、ページ、メールの文面にも入り込んでくるので、一貫して直したいなら広くチェックする必要がある。あちこちに入り込んでいる分、後からの修正は意外と骨が折れる。

2. 結局、Casperが一番「Ghost」らしい

テーマ選びでも一悶着あった。管理画面で各テーマのプレビューを確認しているうちに、いつの間にか設定が「Source」というテーマに切り替わってしまっていたのだ。「あれ、Ghostってもっと小綺麗じゃなかったっけ？」と寂しく感じ、改めて Casper に戻してみたら、「ああ、最初はこれだったな。こっちの方が全然いいじゃん」と納得がいった。

見た目の好みもさることながら、公式テーマは本体のアップデートに最も追従しやすく、新機能が壊れにくいという実利もある。特にこだわりがなければ、Casperを選択しておけば間違いなさそうだ。

3. AI画像生成との「死闘」と「サイト感」の誕生

アクセントカラーを「緑」に決めたあとは、現代のツールらしくAIをフル活用して画像を揃えていったが、ここが一番のハイライトだった。

Publication cover での覚醒: テーマをCasperに戻した時点では、まだ「いかにも初期状態に近いシンプルさだな……」という印象だったが、AIで生成したカバー画像を設定した瞬間に感触が一変した。好みを伝えて生成された画像は、幸いにも一発で気に入る出来栄え。これを据えた途端、サイト全体に一気に「自分の場所」という実感が吹き込まれ、初期状態の頼りなさが消えてオリジナリティが生まれた。
Publication logo の課題: 背景が透過しない画像だとカバー画像の上で浮いてしまうため、透過処理が必要だという「Ghostの作法」に気づけたのは収穫だった。ただ、AIに「背景を透過させて」と何度注文しても、結局透過したファイルは出力されなかった。AIの万能感に期待しすぎたようで、結局は自力でツールを使って修正するしかないのか、という妥協点も見えてきた。
Publication icon との死闘: アイコンサイズに縮小されると、AI特有の「細かな描き込み」は逆効果になる。何度特徴を伝えて「シンプルなものを」と言っても、AIは頑なに複雑なものを作りたがる。「今度こそ依頼通りのものを作りました！」と自信満々に出してくる画像が、さっきと同じものだった……なんてことも。
最終的にはAIが壊れたのか、「長い間、本当にありがとうございました！さようなら！」と連呼し始める始末。コード開発の応答ではこんな体験をしたことはなく、ビジュアルコンテンツの生成はAIにとっても特有の難易度があるのかもしれない。

4. ダークモードと「広告」の相性

格好良さに惹かれて一度はダークモードにしてみたものの、結局はライトモードに戻した。
多くの広告ユニットは背景が白であることを前提にデザインされているため、ダークモードだとそこだけ白浮きしてしまい、サイトの一体感が損なわれてしまうからだ。

5. Code Injectionで見出しを整える

最後に、管理画面のメニューだけでは手が届かない細かな調整。特に H2見出しの色変更 は、Code Injectionを使ってCSSを流し込んでみた。

<style>
    /* H2をアクセントカラーの緑に合わせる */
    .gh-content h2 {
        color: #2fb67e;
    }
</style>

Ghost自体の思想としては、すべて同じ文字色にするのが「美学」なのかもしれない。けれど、個人的には見出しくらいは少し色味が違うほうが、パッと見た時に構造が掴みやすいと思っている。自分だけかな？

まとめ

機能設定も大事だが、こうして実際にデザインをいじり、AIと（時に決別するほど）格闘していくプロセスこそが、Ghostというツールの仕組みを理解する一番の近道だったように思う。箱が整ったので、これから中身の記事を積み上げていくのが楽しみだ。