HTML CSSを習得した後の方
最初の基礎を一緒に乗り越えて、基礎部分を繰り返して自分のものにすればそこからは自分で調べる事も容易になり、そこから本を読む事も全く知識0よりめちゃめちゃ頭に入ります。
まずは自分が作りたい物を作り上げて楽しいと感じて欲しい!という思いから、講座の内容をミニマムにしています。
丁寧に分かりやすく過保護に(w)説明します
このブログのコンセプトである、最初の壁を一緒に乗り越えましょう!
動的サイトの初めの一歩、PHP
WordPressでは、WordPress独自のテンプレートタグが存在します。
それをググりながらコピペで作る事も可能ですが、だいたい途中で混乱します。
PHPの一部しか使わないにしても、よく使う基礎部分を先に理解しておくと、結局は独自のテンプレートタグも同じ仕組みなんだな、と理解しやすく混乱を避ける事ができます。
PHPの簡単な基礎だけ押さえておきましょう。
PHPとはサーバーサイド言語
.htmlで書いたサイトは静的サイトと言われます。
それに対し、WordPressはデータベースがあり、投稿した記事を呼び出し動的にサイトの内容が変わるので、動的サイトと言われます。(見る人によってコンテンツの内容が異なる状態)
制作会社ではお客様がご自身で『サイトの一部を更新をしたい』『ブログを投稿したい』という場合は静的サイトではなくWordPressを使い、サイトの見た目を着せ替える事ができる「テーマ」をオリジナルで作り、納品する事が多いです。
実際にテーマ化する作業としては、.htmlで書いたページの拡張子を.phpに変更し、それぞれ必要に応じてテンプレートファイルをあてて、PHPで書き換えていく作業となります。
PHPはサーバーサイド言語なので、サーバーで必要な情報をデータベースから取得しHTMLにするので、サイト公開をしたソースにはPHPのコードが出る訳ではありません。最終的にはよく見るHTMLのDOM構造になります。
ここからはハンズオンで一緒にコードを書いてみましょう!
前回のおさらい
LOCALで作成したサーバー名/app/public/wp-content/themes/
ここにテーマディレクトリ(フォルダ)を作り、以下の2つを作ると管理画面から作成したテーマを選択できるようになります。
– style.css/*
Theme Name: テーマ名
*/
-index.php
※この先の講座でお伝えしますが、実際のテーマを制作する場合は静的サイトのようにTOPページをindex.phpにする事はあまりありません。分かりやすさを優先する為に一旦index.phpで下記を練習しますが、あくまでPHPの基礎を練習する為です。
PHPの開始タグと終了タグ・使える場所・出力方法
PHPは<?php から始まり ?> で終わるタグの中で書きます。
<?php
// 内容
?>
PHPHTMLの各所で書く事ができ、要素の内容やclass名、内部CSSの中に出力する事ができます。
<!-- class名 -->
<h2 class="<?php echo 'test'; ?>">見出し</h2>
<!-- 要素の中身 -->
<p><?php the_title(); ?></p>
<!-- 内部CSS -->
<p class="test01">テスト</p>
<?php $main = '#f00'; ?>
<style>
.test01 {
color: <?php echo $main; ?>
}
</style>
PHPechoで出力する事ができます。
<p><?php echo "こんにちは。"; ?></p>
<?php
echo '<a href="https://yahoo.co.jp">Yahoo</a>';
?>
PHPこんにちは。
Yahoo
とサイトに表示されればOK!毎回コードを書いたらサイトを確認しましょう。
デベロッパーツール(F12)で見ると、タグも一緒に出力されていますね。
数値・計算を出力してみましょう
文字以外も、数値や計算を出力する事ができます。
四則演算が使えます。
“”で囲うと数値も文字列として扱われます。
<?php
// 四則演算
echo '<br>';
echo 4 + 2; // 足し算 6
echo '<br>';
echo 4 - 2; // 引き算 2
echo '<br>';
echo 4 * 2; // 掛け算 8
echo '<br>';
echo 4 / 2; // 割り算 2
echo '<br>';
echo 10 % 3; // 割り算の余り 1
echo '<br>';
// 数値も""で囲うと文字列としてそのまま出力されます
echo "4 + 2"; // 4 + 2
echo '<br>';
?>
PHP6
2
8
2
1
4 + 2
変数と文字列連結
変数とは、データ(情報)を保管するための箱のようなものです。この箱には、数字や文字、文章など、様々なデータを入れることができます。そして、この箱には名前がついているので、必要な時にその名前を呼び出すことで、中に入れたデータを取り出したり、確認したりすることができます。
PHPでは、変数は$マークの後に命名し、各所で呼び出して使います。
また、文字列と変数を連結する事が可能で、ドット’.’で連結します。(jsの’+’と同じ役割)
<?php
$name = "太郎";
echo "こんにちは、" . $name . "です。";
?>
PHPこんにちは、太郎です。
コメントアウト
コードの中でHTML CSSでもコメントアウトを仕様したと思いますが、PHPでのコメントアウトは1行が// 、複数行は/* */で囲います。
<?php
// コメントアウト
// echo "こんにちは";
/*
テキストテキストテキスト
テキストテキスト
*/
?>
PHPデバック用関数 var_dump();
PHPで変数の情報を詳しく表示する為に、var_dump();がよく使われます。
JavaScriptでいうconsole.log()のようなものです。
<?php
$dump = "テキスト";
var_dump($dump);
?>
PHPstring(12) “テキスト”
データの型と値が出力されます。
環境によって改行位置が異なりますので、配列(後程説明します)のように出力が長くなり見づらい場合は、<pre>タグで囲うと見やすくなります。
<?php
$fav = array('えび', 'アボカド', 'コーヒー');
var_dump($fav);
echo '<pre>';
var_dump($fav);
echo '</pre>';
?>
PHParray(3) { [0]=> string(6) “えび” [1]=> string(12) “アボカド” [2]=> string(12) “コーヒー” }
preで囲った場合
array(3) {
[0]=>
string(6) “えび”
[1]=>
string(12) “アボカド”
[2]=>
string(12) “コーヒー”
}
if文
if文は、もし指定した条件の真偽値が正しければ出力する構文(文法)です。
また、そうでなければ、 else で出力する事も可能です。
if (条件式) {
条件の真偽値が正しい(true)場合の処理
} else {
条件の真偽値が誤っている(false)場合の処理
}
<?php
$age = 20;
if (20 <= $age) {
echo '私は成人しています';
} else {
echo '私は未成年です';
}
?>
PHP私は成人しています
三項演算子(条件 ? 真の場合の処理 : 偽の場合の処理)で書く事もできます。
<?php
$age = 19;
echo 20 <= $age ? '私は成人しています' : '私は未成年です';
?>
PHP私は未成年です
コロン構文
PHPを途中で区切ってHTMLを書き、続きをまたPHPで書きたい時にはコロン構文で書く事ができます。
初学者にはこちらの方が分かりやすい時もあります。
if文の場合で説明すると
<?php if (条件式) : ?>
<p>条件の真偽値が正しい(true)場合の処理</p>
<?php else : ?>
<p>条件の真偽値が誤っている(false)場合の処理</p>
<?php endif; ?>
慣れたHTMLで書いた方が分かりやすければこちらも使えるようにしましょう。
if : endif がセットで使われますが他の構文も、while : endwhile のように、end***がセットとなります。
<?php
$score = 30;
if (40 <= $score) :
?>
<p>合格です</p>
<?php else : ?>
<p>追試です</p>
<?php endif; ?>
PHP追試です
配列
配列は、複数の値を順序づけて格納してある箱です。
var_dump()で中身を見てみましょう
indexは0から始まる連番です。 ()は文字列のバイト数ですが、今は気にしなくてOKです。
確認したら、その2番目に当たるバナナを取り出してみましょう。indexが0から始まるので、[1]になります。
<?php
$array = array('りんご', 'バナナ', 'いちご');
echo '<pre>';
var_dump($array);
echo '</pre>';
echo $array[1];
?>
PHParray(3) {
[0]=>
string(9) “りんご”
[1]=>
string(9) “バナナ”
[2]=>
string(9) “いちご”
}
バナナ
連想配列
配列を key と value で扱いやすくしています。
<?php
$fruits = array(
'apple' => 'りんご',
'banana' => 'バナナ',
'strawberry' => 'いちご'
);
echo '<pre>';
var_dump($fruits);
echo '</pre>';
echo $fruits['banana'];
?>
PHParray(3) {
[“apple”]=>
string(9) “りんご”
[“banana”]=>
string(9) “バナナ”
[“strawberry”]=>
string(9) “いちご”
}
バナナ
While文
WordPressでよく使うループする為の構文です。
while (条件式) {
条件がtrueの間ずっと繰り返し
}
コロン構文で使う場合が多いでしょう
while (条件式) :
条件がtrueの間ずっと繰り返し
endwhile
<?php
$number = 0;
while ($number <= 3) {
echo $number . '<br>';
$number++;
}
?>
PHP0
1
2
3
その他ループ
ループの種類は沢山あります。for foreach do-while など
まずはWhileが一番使うので、ここを押さえておけばOKですが、一例としてforeachの例を出します。
配列を列挙しています。
<?php
$cars = ['Toyota', 'Honda', 'Ford'];
foreach ($cars as $car) {
echo $car . '<br>';
}
?>
PHPToyota
Honda
Ford
関数
関数は同じ処理が複数回ある時に、1つ定義し各所で呼び出す事ができます。
関数とはある特定の「仕事」をするための機械のようなものです。
関数を自動販売機に例えるとイメージがつきやすいでしょう。自動販売機にお金と商品を選ぶボタンの入力をすると、選んだ商品が出てきますよね。
関数も同じように、ある「入力」(これを引数と呼びます)を受け取り、それを使って何かしらの処理を行い、「出力」(これを戻り値と呼びます)を返します。
関数の基本
function 関数名() {
処理内容
}
<?php
function sayHello() {
echo 'こんにちは<br>';
}
// 関数の呼び出し
sayHello();
sayHello();
sayHello();
?>
PHPこんにちは
こんにちは
こんにちは
1つでは便利さが分かりませんが、これが100回、1000回になったら使う意味も出てきますし、修正も1箇所関数を修正するだけで良いので管理がしやすくなりますね。
引数
function 関数名(引数) {
処理内容
}
自動販売機の例で、お金(引数)を受け取り処理、と説明した箇所ですね
引数$nameを受け取り、こんにちは、に追加して出力します
<?php
function sayHelloTo($name) {
echo 'こんにちは、' . $name . '<br>';
}
// 関数の呼び出し
sayHelloTo('太郎');
sayHelloTo('花子');
?>
PHPこんにちは、太郎
こんにちは、花子
引数にデフォルト値を設定する事もできます。
(Scssを勉強した方はこの辺りは似ていますね)
<?php
function sayHelloToDefault($name = '名無しさん') {
echo 'こんにちは、' . $name . '<br>';
}
// 関数の呼び出し
sayHelloToDefault('太郎');
sayHelloToDefault();
?>
PHPこんにちは、太郎
こんにちは、名無しさん
戻り値
関数が処理を完了した後にその結果を呼び出し元に返す値のことを指します。関数内で計算や処理を行い、その結果を外部で使用したい場合に戻り値を利用します。
<?php
function getGreeting($name) {
return 'こんにちは、' . $name . '<br>';
}
// 関数の呼び出しと戻り値の使用
$greeting = getGreeting('二郎');
echo $greeting;
$greeting2 = getGreeting('三郎');
echo $greeting2;
?>
PHPこんにちは、次郎
こんにちは、三郎
比較しやすいように内容を揃えて説明しましたので、ちょっと戻り値が分かりづらいかもしれません。
他の例も載せておきます。
<?php
function add($number1, $number2) {
$sum = $number1 + $number2;
return $sum; // 計算結果を戻り値として返す
}
// 関数を呼び出し、戻り値を受け取る
$result = add(5, 3);
echo $result; // 出力: 8
?>
PHP8
PHP基礎まとめ
いきなり独自のテンプレートタグから始めた私は最初にこれだけでも理解しておけば良かった、と思った部分です。
というよりも、PHPの本を手にした時に、膨大すぎてWordPressで使うのは一部なのにそれを読む気になれなかったんですね
今は効率よく、教える時は上記の必要最低限だけ先に教えてからWordPress独自のテンプレートタグを教える事にしています。
コメント