最初、WordPressのテーマを自分で作ろうと思ったら、何から手を付けていいかわかりませんでした。
WordPressのテーマを自作する人のために、「ブランクテーマ」というベース的なテーマが存在します。
今回は利用したブランクテーマとCSSフレームワーク、そして実際に自作して公開しているWordPressのテーマをご紹介します。これをベースにテーマを作ってみたい人向けなので、最低限の機能しか付けていません。
レスポンシブ対応でデザインを変更できるテーマオプション機能も付いていますので、参考になればと思います。
絶賛公開中の自作テーマ
Under Strap
ブランクテーマの「Underscores」とレスポンシブ対応のCSSフレームワーク「Bootstrap」とを合わせたベーステーマです。
「Bootswitch」でデザインを変更できるテーマオプション機能も付けています。
Under Material
ブランクテーマの「Underscores」とレスポンシブ対応のCSSフレームワーク「Bootstrap」とマテリアルデザインの「Material Design for Bootstrap」を合わせたベーステーマです。
テーマオプション機能ではナビゲーションバーやサイドバーのカラーを変更できるようにしています。
Under Flat
ブランクテーマの「Underscores」とレスポンシブ対応のCSSフレームワーク「Bootstrap」とフラットデザインの「Flat UI」を合わせたベーステーマです。
こちらもテーマオプションでカラーを変更できるようにしています。
次は、どのブランクテーマとCSSフレームワークを作ったかを簡単に紹介します。
ブランクテーマ一覧
まずはブランクテーマを選びましょう。
ブランクテーマといっても種類がたくさんあり、ほぼ最初から作るものや、ある程度素材が揃っているもの、初心者から上級者向けまであるので自分に合ったものを選びましょう。
Underscores
ファイルやHTML（PHP）ファイルの構成がとても綺麗で一番のオススメです！
後に記述する自作テーマもこれを使用して作成しました。
Bones
とても有名なブランクテーマです。
ある程度揃っているので中級者向けに最適です。
Whiteboard
何もしなくてもレスポンシブテーマが出来上がっていて、初心者の方にオススメです。
ブランクテーマというより、ただのテーマっぽいです。
HTML5 BLANK
タイトルの通り、HTML5を使用した最先端のブランクテーマです。
自分で1から作りたいと考えている上級者向けです。
また、WordPressで用意テーマの中にもブランクテーマがあるようです。
WordPress管理画面からテーマの新規追加で検索してみてください。
ブランクテーマに追加したのも
Bootstrap
皆さんご存知、最も有名なレスポンシブ対応のCSSフレームワークです。
ベースはこれを使用しています。
Bootswatch
Bootstrapと一緒に使うことで、16パターンのデザインに変更できます。
自作テーマのオプション機能でデザインを切り替えれるようにしています。
Material Design for Bootstrap
Bootstrapと掛け合わせることで、Google、Android風のマテリアルデザインが実現できます。
書き方はBootstrapとほぼ同じなので、学習コストを削減できます。
Flat UI
これもBootstrapに掛け合わせるだけで、今流行のフラットデザインにできます。
上のと同じで、Bootstrapの書き方を変える必要はありません。
気に入ったらダウンロードして使ってみてください。
今回はデザインを中心に作成しましたが、次はアフィリエイト広告に強いレイアウトを中心に考えたベーステーマを作ってみたいと思います。
- Original:https://minory.org/create-wordpress-theme.html
- Source:Minory
- Author:管理者