ザリガニデザインオフィス

これからWordPressを勉強する前に覚えておきたいことのサムネイル

これからWordPressを勉強する前に覚えておきたいこと

WordPressはプログラミングです。

正確には違うけど。はじめて学ぶ人はそれくらいの気持ちで。

WordPress(以下、WP)は、ブログ感覚で更新ができるということで、最近はやりのCMSです。オープンソースで仕様が公開されていることもあり、非常に高いカスタマイズ性と利用料が無料というのも大きなポイントです。上手くカスタマイズすればブログだけでなく、企業のコーポレートサイトなどの構築もできます。

HTMLとCSSを勉強すれば静的なサイトは構築できるようになります。「よし、次はWPだ!」という人もいるかと思います。

まず、WPはPHPというプログラミング言語で書かれています。PHPはWebとの親和性が強いプログラミング言語で、HTMLの中にPHP文を挿入することで動的な生成を可能にしています。では、WPを勉強する前にPHPを勉強しなくてはいけないかと言うと、必ずしもそうではありません。もちろん、勉強するに越したことはないですが、自分もPHPの勉強の前にWPから入ったくちです。

WordPressはHTMLとは違う

ただし、WPの構造はHTMLとは大きく違います。HTMLがマークアップ言語というように、HTMLでは最終的な出力するものを書きます。

<h1>Hello World</h1>

と書けば、h1タグのスタイルに応じた「Hello World」が出力されます。書いたものがそのまま出力されるので明快で分かりやすいですが、もし(そして、往々にしてありますが)、リストが100個あれば、<li>タグを100個書かれなくてはいけません。

命令を書いていく記述する

それに対して、WP、もっと広くPHPなどの言語は、「出力させる処理」を記述します。先ほどのliタグ100個の場合、PHPでは「liタグを出力するのを100回繰り返せ」と記述すれば、自動的に100個生成してくれます。もし1000になれば、100の部分を1000に書き換えれば、文句も言わずに1000個出力してくれます。これがプログラミングによる動的生成の強みです。

WPもプログラムを上手く使うことで簡単にページを増やしたり、自動的に新規記事を一覧にしたりしています。なので、WPテンプレートの構築は、WPにさせる命令を記述していくことになります。

ここで初めて学ぶ人にとって問題なのが、HTMLまでは具体的なものを記述していったのに対し、WPは抽象的に記述していくことです。<li>タグの例をPHPで書くと、

for($i=0;$i<100;$i++){
  echo '<li>'.$i+1.'個目のリスト</li>';
}

となります。出力すると、

<li>1個目のリスト</li>
<li>2個目のリスト</li>
<li>3個目のリスト</li>
...

と100個生成されます、一瞬のうちに。またliタグの中には「何個目のリスト」の数字が自動的に入ります。ただ、知らない人はパッと見で「<li>タグを100回繰り返す命令」には見えないのが、WPを学ぶ上での障壁であり、それを覚えていくのがポイントです。

変数・関数・配列

もう一つポイントになってくるのが、「変数」「関数」「配列」などの概念です。いずれもHTMLやCSSにはない概念です。変数は、いろんな値を入れておく箱、関数は処理を実行する手順、配列はいろんな値が入っているクローゼットのような感じです。「変数」を「関数」に与えたりもらったり、配列にまとめたりする処理を書くのが、WP構築になります。

こうしたプログラミングのお作法とも言うものが必須になってきます。ここをきちんとマスターすれば、コード例をコピペでWPを構築している人から卒業できます。ここまで来れば、Wordpress Codexを見ながら自分なりにカスタマイズして、WPを自由にカスタマイズできるようになるでしょう。

また、上記の変数などの概念はJavaScriptでも同様です。JavaScript(jQuery)を先に勉強して、これらの概念を習得するのも手です。JavaScriptを先に勉強しなくても、HTMLやCSSとは全くの別物で、概念があると頭の隅に置いておくだけでも、習得に差が出てくるかと思います。

var_dump()関数を使って中身が分かるようになれば、バッチリです。