炭火Blog

WordPressで使う自作のテーマを作った記録[上巻]

Blogging
/

※このページにはプロモーションが含まれています。

Table of Contents

このブログで使用しているテーマは、ブログを始めた頃はGeneratePressやNeveを使っていましたが、自分で作れるかもしれないと思い、ネットで情報を得ながら作成したものです。

自作のテーマを作るにはHTMLとCSSを理解していることが前提になりますが、PHPはHTMLを出力する言語なので、HTMLが分かれば、そうは難しくないと思います。

PHPを自分で書くことはあまりなくて、追加したい機能をネットで調べ、それをはめ込めば良いので、細かいPHPの知識は必要ありません。また、当初には理解できなかった事柄も、しばらくすれば分かるようになるので、PHPの学習としてもテーマの自作は向いているように思います。

ただ、仕事でテーマを作っている訳ではなく、自分の使うものだけを作っていては、理解した知識も忘れてしまいがちです。久しぶりにテーマを触ってみると忘れそうになっていることがわかりました。

PHPの書き方を忘れるのは良いのです。調べればすぐ分かりますから。PHPの記述が何をしようとしているのかを忘れてしまっては困るので、自分の備忘録を残そうと思います。

本当は自作したテーマにコメントを残せば良いのですが、少しでも実行速度を上げるために、空白・コメントは削除しています。ただし、それで実行速度が上がるのかは、調べる方法が分からないので未だに謎のままです。

下のリストについて備忘録として記録しようと思います。

ローカル環境にWordPressをインストールする

自分のパソコンでWordPressが使えるようにします。

テーマができるまでに使うのはもちろんのこと、運用中のサイトの変更もローカル環境で行って、確認をしてからサーバーにアップします。

私はLinuxを使っているのでDockerを使っていますが、WindowsやMacOSならXAMPPを使うと良いでしょう。

コードライターはVisual Studio Codeを使います。完全無料で軽快に動きます。日本語にする機能拡張を入れることでメニューなどが日本語化されます。Visual Studio Codeは匿名の使用データをMicrosoftに送信しているので、不要な場合は設定から無効化できます。

以前は別途必要だった日本語全角スペースを判別する機能も、日本語化機能拡張に含まれているので、便利になっています。

もう一つおすすめの機能拡張は「Minify All」です。CSSをサーバーにアップする前に軽量化を目的に改行や余計なスペースを省くのですが、この機能拡張で右クリックから簡単に軽量化ができます。

一度軽量化したCSSを再度書き換える時は「CSS Formatter」などのサイトで復元しています。

スターターテーマを選定する

スターターテーマを使うことで1からPHPを書く必要がなくなります。家で例えるなら、基礎と柱ができた状態から建築を始められるといった所でしょうか。

ネットの世界を調べてみるとスターターテーマを使ったテーマの作り方を解説されているサイトもあるので、自作テーマ作成の近道になるはずです。

色々なスターターテーマがある中でおすすめはAutomattic社の提供する「Underscores」です。

他にも多くのスターターテーマがありますので自分にあったものを選ぶと良いでしょう。

PHP・HTML・CSSでテーマを作る

【自作テーマ開発】_s(underscores)でオリジナルブログサイトを作ろう!

テーマ作りの初期には、上のサイトにお世話になりました。Underscoresに書かれているPHPの意味が分かるので、大変参考になったと覚えています。

画像の設定

別途投稿します。

image size wordpress

[画像サイズの設定]WordPressの自作テーマ

炭火Blog

SEO対策

別途投稿します。

seo wordpress

[SEO対策]WordPressの自作テーマ

炭火Blog

読み込み速度対策

別途投稿します。

speed test wordpress

[読み込み速度対策]WordPressの自作テーマ

炭火Blog

レンタルサーバーを借りる

自分の好きなように作ったテーマを使ったサイトをを公開するためにサーバーを借ります。

私が最初に借りたのはスターサーバーでした。理由は安いからです。WordPressを使ったサイトは1つしか作れませんが300円以下/月でした。1年が経とうとしたころに、まだこのブログを更新していたので、1年間更新が続いたのであれば長期間契約しても良いだろうと思い、次にシンレンタルサーバーに申し込みました。理由は3年契約だと385円/月だったからです。

サイトの読み込みも速くなって喜んでいたのですが、今のようにCloudflareを使うならレンタルサーバーの速さについては考慮しなくても良いと思います。

Google AdSenseとCloudflareを併用すると外国語の広告が表示されて、AdSenseの収入が減るとの情報があり、特定のレンタルサーバーならそれを回避できるとのことですが、広告の表示は直接Googleのサーバーから行うので関連性はないと思います。

実際にGoogle AdSenseの広告レビュー センターで当ブログに表示されている広告を見ても日本語のものばかりです。そもそも、減るほどの広告収入はない弱小ブログなので分からないだけかもしれませんが。

超高速のCloudflareを利用するならサーバーはどこでも良いと思いますし、ブログを始めた頃はアクセスも殆どないので、アクセスが増えて問題が出始めたときに自分に合ったサーバーを選べば良いでしょう。

最後までお読みくださり、誠にありがとうございます。

Amazon.co.jp
WordPressオリジナルテーマ制作入門
Amazon.co.jp
【Amazon.co.jp限定】1冊ですべて身につくWordPress入門講座(DL特典:【100ページ超の大特典!】フルサイト編集に“対応していない”テーマのカスタマイズ方法)

関連投稿

週間アクセスランキング

このブログを書いている人

管理者 ほんだ

数多くあるブログの中で、このページをお読みくださりありがとうございます。このブログは、炭火で美味しいものを作ることを中心に、日々の趣味についてを文章にすることで、WordPressを使ってのWebページ作成を忘れないようにしています。熱帯魚の世話や野菜の栽培、Linuxについて興味のあることを、つたない文章で綴っています。兵庫県在住です。