A Guide To The Options For WordPress Theme Development

最近の WordCamp Edinburgh で、WordPress テーマ開発とテーマ構築時の開発者のオプションについてのパネルディスカッションに参加した。 このセッションで得られた最も重要な結論は、万能な答えはなく、最適な方法はウェブサイトのニーズと開発者の能力によって異なるということでした。 セッションで得られた最も重要な結論は、万能な答えはなく、最適な方法は Web サイトのニーズと開発者の能力によって異なるということでした。 この記事では、WordPress テーマの仕組みを簡単に説明した後、開発するためのさまざまなアプローチを見て、どのアプローチがあなたの Web サイトや状況に最も適しているかのヒントを提供します。

SmashingMagの他の記事：

• Migrating A Website To WordPress Is Easier Than You Think
• Using WP_Query In WordPress
• Schedule Events Using WordPress Cron
• How To Improve The Deployment Of WordPress Websites

WordPressテーマはどう機能しますか？

WordPressでは、テーマがWebサイトを動かし、何が含まれ、どのように動作し、どのように見えるかを決定します。 テーマは、データベースに格納されるコンテンツとは別のものです。

テーマはいくつかのテンプレート ファイルで構成され、WordPress インストールの wp-content/themes にあるテーマ フォルダにすべて格納されています。 すべての WordPress テーマには、少なくとも 2 つのファイルが含まれていなければなりません。 index.php と style.css です。 インデックス ファイルは、テーマによって表示されるコンテンツを定義し、スタイル シート（ご存知でしょう）はそれをスタイルし、また、WordPress がテーマを正しく動作させるために使用するテーマに関するメタ情報を含んでいます。

sidebar.php ウィジェット領域を含むサイドバーが含まれます。

footer.php ウィジェット領域を持つか持たないかのフッターが含まれます。

functions.php あなたのテーマに固有の関数が含まれています。 関数ファイルについては、WordPress Codexで調べることができます。

データベースからコンテンツを呼び出す、ループを含むファイルです。 ウェブサイトのどの部分で作業しているかによって、これはいくつかのファイルのうちの1つになります：

• page.php 静的ページ用
• single.php 個々の投稿用（ブログ投稿など）
• index.php, archive.php, category.phpなどです。

Yoast は、テーマ ファイルがどのように機能するかについて素晴らしい視覚的表現を書いており、WordPress Codex は、さまざまなファイルやそれらがいつ呼び出されるかについての詳細を含む、テーマについての詳細な説明を含んでいます。 スタイル シートにはテーマ自体に関する重要なメタ情報が含まれており、すべてのスタイルの前にコメントアウトされています。 以下は、WordPress の現在のデフォルト テーマである Twenty Eleven のオープニング コメントです:

この情報はコメントアウトされているので、ブラウザでは読み取られませんが、WordPress では読み取られ、あなたのテーマを使用している人に情報を提供します。 まもなく、子テーマを作成する方法を見るときに、この話に戻ります。 始める前に、その判断に役立ついくつかの点を考慮する価値があるでしょう。

What To Considering When A WordPress Theme?

テーマを開発するために取るべきアプローチを決定する前に、制約を識別します。 制約にはおそらく次のようなものがあります：

• 時間。 テーマを開発したり、その方法を学んだりするためにどれだけの時間がありますか。
• 予算。 これは、時間に関連していますが、あなたがプレミアムテーマやテーマフレームワークにお金を払う余裕があるかどうかにも関係しています。 テーマ開発、CSSやPHP、そしてテーマがどのように機能するかについて、あなたはどの程度精通していますか？ もし慣れていなければ、どの程度学びたいですか。 あなたのテーマは、将来的に更新する必要がありますか？ あなた以外に他の開発者がそれに取り組んでいますか？ もしそうなら、あなたのアプローチは可能な限り堅牢である必要があります。
• 繰り返し。 将来、似たようなテーマをいくつも開発することになりますか。

この記事の最後に、これらの考慮事項を再検討し、どの開発オプションがさまざまな状況に最も適しているかを明らかにします。 あなたのオプション

テーマまたはテーマを開発するためにいくつかのオプションが利用可能であり、袖をまくり上げてコーディングを始める前にそれらを調査することは価値があるでしょう。 正しいアプローチを選択することで、より堅牢なコードを持つより良いテーマになり、後で行うことになる修正の量を最小にすることができます。 また、より効率的にテーマを構築することができます。

ここで見ていくオプションは次のとおりです。

• ゼロからテーマを構築する、
• 既存のテーマを編集する（または「ハック」する）、
• テーマ カスタマイザーを使用して既存のテーマを調整する。
• 既存のテーマを変更するために子テーマを作成する,
• 独自の親テーマ（上記のアプローチのいずれかを使用）と子テーマを作成する,
• テーマフレームワークを使用する.

1. テーマをゼロから構築する

この方法は、経験の浅い人には最も難しい方法です。 しかし、あなたが経験豊富な WordPress 開発者であれば、最もコントロールしやすい方法です。

しかし、Web サイトを WordPress に転送する場合、単にコードをコピーするのではなく、プロセスの一部としてレビューを行うことは良いアイデアです。 静的な Web サイトをコピーする場合は、コードがクリーンで効率的で有効であることを確認するために、コードに目を光らせる必要があります。 既存のテーマを編集（またはハック）する

これは、ほとんどの人が WordPress テーマ開発を始める方法です。 ダウンロードしたテーマで作業しているうちに、どこかスタイルがおかしいと感じ、スタイルシートを読み込んで編集する。このようなやり方は、手っ取り早く、簡単に思い通りの効果を得られるような気がして、魅力的です。 しかし、いくつかの危険性があります。

• テーマを変更した場合、その更新により、行った変更が上書きされます。
• 不要なものを削除するのではなく、上位のスタイルを上書きするスタイル シートの下位に新しいスタイルを追加すると、繰り返しコードを追加することは簡単です。
• Web サイトは、必要以上に多くのコードで終わる可能性があります。
• そもそもテーマがうまくコーディングまたはコメントされていない場合、より大きな混乱に陥り、多くの修正を行う必要があることに気づくかもしれません。 以下が当てはまる場合、それは選択肢となりえます:
  • 使用しているテーマは、よく書かれており、有効で、コメントされています (例,
  • テーマに含まれる PHP と CSS を理解しており、テーマを壊すことなく編集、追加、削除することに抵抗がない。 また、不要なコードをコメントアウトし、削除する前に何が起こるかテストすることをお勧めします。
    

    3. テーマ カスタマイザーを使って既存のテーマを調整する

    WordPress 3.4 で、テーマ カスタマイザーがリリースされました。 これは、コードを書かずに、WYSIWYG インターフェイスを使用して簡単にテーマをカスタマイズするオプションを提供します。 テーマ自体にどの程度カスタマイザーが書き込まれているかにもよりますが、画像、タイトル、色、そしてレイアウトまで変更することが可能です。 カスタマイザーが組み込まれたテーマが増えることを期待します。

    

    テーマ カスタマイザーは、テーマのスタイルシートではなく別のファイルに変更を保存するので、コードの繰り返しが発生します。

    詳細については、Otto on WordPress のビデオ チュートリアルまたはテーマ カスタマイザーを自分のテーマに統合するガイドをご覧ください。

    4. 既存のテーマを変更するための子テーマを作成する

    この方法は既存のテーマの編集に似ていますが、より安全です。 これは、既存のテーマの子として定義される、まったく新しいテーマを作成することで構成されます。 子テーマが特定のファイルを持っておらず、親テーマが持っている場合、それを使用します。 子テーマがファイルを持つ場合、そのファイルは親テーマの同等ファイルを上書きします。 例を見てみましょう。

    親テーマのファイル	子テーマのファイル
    style.css page.php single.php archive.php header.php sidebar.php footer.php	style.css page.php header.php

    上記の例でいうと。 WordPressは以下のファイルを使ってコンテンツを配信することになります。

    • style.css from the child theme,
    • page.php from the child theme,
    • single.php from the parent theme,
    • archive.php from the parent theme,
    • header.php from the child theme,

    sidebar.php from the parent theme,

  • footer.php from the parent theme…。

  親テーマのマークアップをほとんど使用したいが、ヘッダーのコンテンツを変更したい場合 (たとえば、ロゴと住所の詳細を追加する)、および任意の静的ページを変更したい場合 (おそらくメタデータの表示方法を変更する) に有用であることはおわかりいただけるでしょう。 これを行うには、スタイル シートのコメントにいくつかの余分なコードを追加します：

  余分な行を見つけられますか？ 最初の行は:

  Template: twentyeleven

  この行は、テーマが子テーマであり、Twenty Elevenがその親であることをWordPressに伝えています。 フルネームではなく、親テーマのディレクトリ名を追加します。

  そして2つ目は:

  @import url("../twentyeleven/style.css");

  この行は、現在のスタイルシートのスタイルを表示する前に親テーマのスタイルシートを読み込むようブラウザに指示します。 これにより、使用したい親テーマのスタイルを複製する必要がなくなります。

  つまり、これが子テーマの動作方法です。 しかし、これはいつが最適な方法なのでしょうか。 私は、次のような場合に使用することをお勧めします。

  • 自分のテーマに必要なもののほとんどを含む（親として使用する）テーマがすでにある場合。
  • 親テーマを更新できるようにしたい場合（たとえば、WordPress の更新に伴いテーマの更新がリリースされたときなど）です。
  • 既存のテーマをハックして結び目を作りたくない。
  • 親テーマに戻すか、将来的に別の同様のテーマ (これは新しい子テーマになる) を開発するオプションが欲しい。
  • 似たような Web サイトを多数開発しているが、スタイルやコンテンツに若干の違いがある場合 (複数の会社を所有しているクライアントのために同様の Web サイトを構築したときに、これを行いました)、
  • 子供と親のテーマの間の違いは、ゼロから始める必要があるほど大きくなく、親テーマへの更新によって影響を受けるものを子供テーマのコードが上書きするほど大きくもありません。

  5. 独自の親テーマ (上記のアプローチの 1 つを使用) と子テーマを作成する

  先ほど言及した、複数の会社を持つクライアントのために一連の Web サイトを構築する状況は、親テーマを作成し、個々の Web サイト用に子テーマを設定することができる機会です。

  • 将来、同じようなコンテンツやマークアップの Web サイトを多数開発する予定がある場合（1 つのクライアントに対してだけでなく）、
  • 多数の Web サイトを管理し、それぞれを定期的に参照する必要があり、コードを非常に似たものにする場合、
  • 自分で親テーマを作成したりコードを編集して子テーマとうまく機能する頑丈な親テーマを作成することが好きな場合、このようにすることも可能です。

  このアプローチを採用する場合、ゼロから親テーマを構築するか、既存のテーマをハックすることができます。 私が構築するほとんどの Web サイトでは、WordPress の以前のデフォルトのテーマである Twenty Ten テーマをハックして開発した親テーマを使用しています。 多くの変更を加えたので、オリジナルのテーマのアップデートを有効化する必要がなくなりました。 また、テーマ内のコードに満足していたので、コードを削減し、私の仕事のやり方に合うように再構築し、必要ないとわかっているコードを削除するなど、テーマに大きな変更を加えたいと思いました。 この利点は、孫テーマに受け継がれる子テーマへの変更を柔軟に行いながら、オリジナル テーマのコードを上書きしないことです。 しかし、ここでひとつ警告があります。

  6. テーマ フレームワークを使用する

  最後のオプションは、何千人もの WordPress ユーザーおよび開発者が使用しているものです。 多くのテーマ フレームワークが存在し、親テーマの一種として使用できますが、はるかに多くの機能を持ち、場合によっては、一行のコードも書かずにかなり派手なレイアウトとスタイルの変更を行うオプションがあります。 フレームワークには、無料のものもあれば、プレミアムなものもあります。 Smashing Magazine ですでに詳しくレビューされていますが、主なものを以下にリストアップします。

  Free WordPress frameworks:

  • Theme Hybrid には、テーマのカスタマイズを支援する無数のフックとウィジェット領域が含まれています。 また、いくつかの子テーマも利用可能です。 フレームワークと子テーマはすべて無料ですが、サポートが必要な場合は、Theme Hybrid の Web サイトで登録することで料金を支払う必要があります。 PHPを理解しているか、子テーマの1つを使用していない限り、これでの作業はかなり複雑になる可能性があります。
  • Wonderfluxは、柔軟なグリッドシステムに基づいています。 コードを書かずにレイアウトとスタイルを調整するオプションがあり、多くのフックとウィジェット領域が含まれています。
  • Carringtonは、無料のフレームワークの中で最も確立されたものであり、多くの子テーマを備えている。

  Premium WordPress frameworks:

  • その開発者は、Genesisを「業界標準」と表現している。
  • Thesis は他の大きなプレミアムフレームワークで、これもコードを書かずに子テーマをカスタマイズするオプションがあります。

  Summary: Choosing An Approach

  Chances that have an idea of which approach to go with. しかし、まだ頭を悩ませている方のために、ここでは、それぞれの方法が適切な場合についてまとめています。

  。

  の作成

  高

  アプローチ	時間	コスト	能力	将来性	Future->	Capability	Time	Time	Capability	リピート
  ゼロから作る	高い	低い	High	Low
  Hack existing theme	Low	LowMedium	Low
  Use theme customizer	Low	LowLow	Low
  既存の親をベースに子テーマを作成する	Medium	Low	Medium	High
  親テーマの作成	High	Low	High
  Theme framework (free)	Medium	Low	Medium	High
  Theme framework (premium)	中	低～中	高

  全体的に。 各アプローチには、それぞれ適した場所があります。 ただ、ウェブサイトとあなた次第です。 重要なのは、長所と短所を比較検討した上でアプローチを選択することです。いきなり飛び込んでみて、テーマを破ってしまったり、多くの手戻りを作ってしまったりしないようにしましょう。