🕛

【効率化】HTMLでよく使うPHPの機能4選

2021/07/10に公開

HTML

PHP

コーディング

tech

HTMLとCSSとJavaScriptでコーディングしていると、タイマー設定やHTMLを使いまわしたくなったり、微妙にPHPが必要になってくるタイミングが来ます。

問い合わせフォームとかが代表例ですが、正直WordPressがここまで浸透しているとほとんどの方がWordPressで問い合わせフォームを実装しているかと思います。

なので、今回は問い合わせフォーム以外のコーディングでよく使うPHPの機能とその使い方についてまとめてみました。

今回紹介するPHPの機能は以下の4つです！

変数で文字列の使いまわし
共通HTMLの呼び出し
タイマーでの切り替え設定
自動キャッシュ対策

変数で文字列の使いまわし

最初に紹介するのは、変数の機能を使って同じ文字列を使い回す機能。

具体的な例を挙げると、ECサイトなどで「登録者数〇〇人！」みたいな文言を複数箇所でテキストを打っている場合、いちいち登録者数が増える度にコーディングをするのは面倒です。

そこでPHPで変数を定義して要素を使いまわします。
具体的なコードとしては、最初に変数を定義して使いたい場所でprintを使うという流れ。

<?php $register="15" ?>

<h2>登録者数<?php print $register; ?>万人突破！</h2>
<p>
  いつもご利用ありがとうございます。<br>
  皆様のおかげで<?php print $register; ?>万人を超えるご登録をいただきました。
</p>

$registerで15という変数を定義して、
print $registerで変数を呼び出しています。

修正する際は、15の部分を変えるだけで全ての<?php print $register; ?>部分が修正することができて便利です。

実際の表示例はこんな感じ。▼
PHPでHTMLの変数を呼び出して使い回す

デモサイトはこちら

PHP で共通の HTML ファイルを呼び出す

複数ページのコーディングをする際、ヘッダーやフッターは共通のHTMLになるかと思います。その全く同じデザインのヘッダーをページごとに同じHTMLを書くのは面倒ですし、何より保守性・管理面的に問題です。

そういうときはよく、ヘッダーだけのHTMLをつくり、PHPを使って呼び出して使い回すことが多いです。

PHPのincludeをHTMLに直接書いて反映させることができます。

index.html

<?php include ('./../component/header.html')?>

ただ、header.htmlに画像ファイルのsrcなど相対パスがある場合、親ページと子ページでパスが変わってしまいます。

そういう場合は、PHPでパスを定義してheader.htmlにも定義したパスを使います。
ちょっと言葉だけだとわかりにくいので、具体的なコードを紹介するとこんな感じ。

トップページのindex.html▼

index.html

<?php 
  // pathの深さを定義
  $Path="../" 
?>
<!-- header.htmlを呼び出す -->
<?php include ('./../component/header.html')?>

共通のheader.html▼

component/header.html

<!-- index.htmlのパスの深さを使い回す -->
<img src="<?php print $Path; ?>asset/img/header_logo.png" alt="" />

子ページのindex.html▼

page/index.html

<?php 
  // pathの深さを定義
  $Path="../../" 
?>
<!-- header.htmlを呼び出す -->
<?php include ('./../../component/header.html')?>

$Pathでパスの深さをページの階層ごとに定義することで、共通のheadr.htmlを使い回すことができます。

実際の表示例はこんな感じ。（濃い灰色部分がヘッダーです。）
PHPで共通のHTMLを呼び出す

デモサイトはこちら

PHP でタイマー設定を実装

期間限定キャンペーン系のバナーをページに設置する際、日付や時間の切り替わりと同時に表示させたり消したりしたいことがあるかと思います。

そういう場合は、PHPのif文をHTMLに組み込むことでタイマー設定を実装することができます。

使うのはこういう単純なif文です。

<?php if (条件) : ?>

条件時に実行する内容

<?php else : ?>

条件以外のときに実行する内容

<?php endif; ?>

一応、こういう書き方もできます。（HTMLを埋め込みにくくてあまり使いませんが…。）

<?php
  if(条件){
    echo('実行する内容');
  } else {
    echo('実行する内容');
  } 
?>

実際のコーディングでは、日付を定義し、日付ごとのif文を使って実装します。

<?php
  // 現在の日付を定義
  $now = date('Y-m-d H:i:s');
?>
<?php if ($now <= '2021-02-28 23:59:59'): ?>

<p>実行する内容（2021年2月28日以前に表示される内容）</p>

<?php elseif ($now <= '2021-03-31 23:59:59'): ?>

<p>実行する内容（2021年3月31日以前に表示される内容）</p>

<?php else: ?>

<p>実行する内容（2021年4月1日以降に表示される内容）</p>

<?php endif; ?>

表示例はこちら。

PHPでHTMLのタイマー設定

デモサイトはこちら

時期ごとにHTMLを変えて実装します。本番環境だとパソコンの時間を変えても確認することができないので要注意です。

PHP で自動キャッシュ対策

既存ページで画像を変更した際に、再読み込みしてもキャッシュが原因で差し替えた画像が読み込まれないことがあります。

あまり変更しない画像や変更点が気にならない画像ならまだしも、緊急時や重要な訂正などキャッシュで変更前の画像が表示されてしまうのをなんとしてでも食い止めたい場合はPHPで半自動的にキャッシュ対策が実装できます。

一般的なキャッシュ対策は、以下のように画像の URL の後ろに「?＋何かしら」でキャッシュを通さずに読み込んでくれます。

<img src="./asset/img/header_logo.png?20210701" alt="" />
<img src="./asset/img/header_logo.png?aaaa" alt="" />
<img src="./asset/img/header_logo.png?tekitou" alt="" />

ただ、このやり方だと頻繁に画像を差し替えていかないといけない場合、いちいち「?」の後ろを修正しないと行けないので、めちゃくちゃ面倒です。

以下のように、PHPの日付設定を使って「?」以降の部分をリロードするたびに変更させる仕様にすると、画像を差し替えるだけで十分なのでかなり便利です。

<img src="./asset/img/header_logo.png?<?= date('YmdHis') ?>" alt="" />

?以降が PHP で日付から秒までの数字を呼び出しています。

Chrome のディベロッパーツールで読み込んでみるとちゃんと秒までの数字が表示されます。

PHPでHTMLのキャッシュ対策

デモサイトはこちら

最後に

ということで、HTMLでよく使うPHPの機能4選でした。

今回紹介したPHPの機能だけでもかなり効率的にコーディングができるようになりました。

ただ、私自身、PHP専門でもなんでもないので、まだまだコーディングで使えるPHPはあるかと思います。
今後も実務経験や学習のなかで使えそうなPHPのネタがあれば随時更新していきます。

それでは。

変数で文字列の使いまわし

PHP で共通の HTML ファイルを呼び出す

PHP でタイマー設定を実装

PHP で自動キャッシュ対策

最後に

Discussion