公開日: / 更新日:

テーマの作り方3 手持ちのテーマや HTML を渡して直させる

テーマの作り方の3つ目は、今あるテーマや、HTML と CSS で作ったデザインを渡して、Claude Code に直させる方法です。

HTML や CSS、WordPress をある程度分かっている人に向けた作り方です。

【広告・スポンサーリンク】

HTML と CSS のデザインをテーマにする

HTML と CSS で作ったデザインがあるなら、それを渡して、WordPress のテーマにしてもらうことができます。

この実践編で扱うクラシックテーマにするには、デザインをページの種類ごとのファイルに分ける必要があります。どのページにも出る上と下の部分、記事のページ、固定ページ、といった分け方です。

あわせて、デザインの中に直接書かれた記事のタイトルや本文を、WordPress が記事ごとに中身を差し込む形に置き換えます。こうした作業を、Claude Code に任せられるわけです。

関連記事:テーマはページの種類ごとのファイルの集まり

私の場合は自作のテーマを渡した

すでにテーマになっているものを渡して、直させることもできます。

私も、自分で作ったテーマを Claude Code に渡して、直させたことがあります。HTML と CSS は独学ですが、基本的な古いタイプのデザインなら、自分で作れるからです。

直させたのは、トップページに何をどのように表示させるかといったレイアウトや、テーマの中の仕組みです。見た目のデザインには、ほとんど手をつけさせていません。

3つの作り方から選ぶ

この実践編では、テーマの作り方を3通り紹介しています。手元に画像のデザインがあるなら2つ目、HTML や CSS、WordPress がある程度分かっていて、手持ちのテーマやデザインがあるなら3つ目です。

関連記事:テーマの作り方1 ゼロから言葉だけで作らせる

関連記事:テーマの作り方2 デザインやラフ案をテーマにする

とはいえ、多くの方は1つ目の方法で足りるはずです。どの作り方でも、できたテーマをブログに入れる手順は同じです。

関連記事:できたテーマを自分のブログに反映する

\ この情報をお友達にシェア! /
サムリ
在宅で働くフリーランス。2026年9月、右も左も分からない状態から Claude Code を使い始め、フォルダを部門に見立てた自分専属の AI チームを育てています。使い始めて2日でサイトを1つ作り、その4日後に Kindle 本を出版しました。プログラミングの経験がない人に向けて、仕組みと付き合い方をまとめています。
サムリ

準備編が本になりました[PR]

あなたの夢をかなえる!Claude Code 専属AIチーム構築法

このサイトの準備編を、頭から通して読める1冊にまとめ、Kindleで出版しました。

書き下ろしのまえがき・あとがきも収録しています。

Amazonで見る

Claude Code 活用術とは?

Claude Code 活用術
プログラミング経験がなくても大丈夫。Claude Code を、道具ではなく、育てる社員として捉え、あなただけの AI チームを持つ方法をまとめたサイトです。チームづくりの準備から、ブログやゲーム作りなどの実践まで、順に紹介します。