WordPressの記事にiframeタグでPHPコードを埋め込む（動きのあるものを表示）

WordPressでPHPプログラムを実行するためにiframeタグで記事の中にPHPコードを埋め込むことができます。（→関連記事「WordPressの記事にiframeタグでPHPコードを埋め込む」）

文字の表示だけではなく、動きのあるものも表示することが可能です。

この記事では、inputに対して回答するプログラムをPHPで作って、iframeタグでWordPress記事に埋め込んでみます。

今回実施すること
まとめ

今回実施すること

PHPでプログラム

PCくんと健康会話をするプログラムをつくってみました。

動作説明と、コードは次のとおりです。ファイル名は「test002.php」にしておきました。

■コード■

<!-- 
 //ファイル名//
 test002.php
 
 //　機能　//
 PCくんと健康会話

 // 動作説明 //
 自分（＝プレイヤー）とPCくん（＝パソコン）の
 健康状態を比較してPCくんがコメントをしてくれる
 プログラムです。

 健康状態は、次の３つ
　　良好！  普通。  最悪。。 
 この３つの健康状態から１つ選択して
 「回答」ボタンをクリックすると
 PCくんの健康状態と比較して
 回答してくれます。

 //　作成日　//
 ２０２５年６月８日

-->

<?php
// 健康状態を配列に代入
$conditions = ['良好', '普通', '最悪'];

// プレイヤーの健康状態がPOSTされたら
if (isset($_POST['condition'])) {
    // プレイヤーの健康状態を代入
    $playercondition = $_POST['condition'];

    // PCの健康状態をランダムで選択
    $key = array_rand($conditions);
    $pccondition = $conditions[$key];

    // 返事の内容を判定
    if ($playercondition == $pccondition) {
        $result ='一緒だね';
    } elseif ($playercondition == '良好' && $pccondition == '普通') {
        $result = 'いいね';
    } elseif ($playercondition == '良好' && $pccondition == '最悪') {
        $result = '元気分けてくれる？';
    } elseif ($playercondition == '普通' && $pccondition == '良好') {
        $result = '元気出していこう';
    } elseif ($playercondition == '普通' && $pccondition == '最悪') {
        $result = '頑張ろうね';    
    } elseif ($playercondition == '最悪' && $pccondition == '良好') {
        $result = '元気分けてあげる';
    } elseif ($playercondition == '最悪' && $pccondition == '普通') {
        $result = 'ゆっくり休もう';       
    } else {
        $result = '？';
    }
}
?>

<!DOCTYPE html>
<html lang="ja">
<head>
    <title>体調</title>
</head>
<body>

  <h1>今日の体調は？</h1>

  <?php if($_SERVER['REQUEST_METHOD'] === 'POST'){ ?>   
  <dl>
    <dt>自分の体調：<?php echo $playercondition;  ?> </dt>
    <dt>PCくんの体調：<?php echo $pccondition;  ?></dt>
    <dt>PCくんの回答：<?php echo $result;  ?></dt>
  </dl>

  <?php
  }

  ?>

  <form method="post">
      <label> 良好！ <input type="radio" name="condition" value="良好" required ></label>
      <label> 普通。 <input type="radio" name="condition" value="普通" required ></label>
      <label> 最悪。。 <input type="radio" name="condition"  value="最悪" required ></label>
      <input style="display:block;" type="submit"  value="回答">

  </form>


</div>
</body>
</html>

<!--

//ファイル名//

test002.php

//　機能　//

PCくんと健康会話

// 動作説明 //

自分（＝プレイヤー）とPCくん（＝パソコン）の

健康状態を比較してPCくんがコメントをしてくれる

プログラムです。

健康状態は、次の３つ

　　良好！普通。最悪。。

この３つの健康状態から１つ選択して

「回答」ボタンをクリックすると

PCくんの健康状態と比較して

回答してくれます。

//　作成日　//

２０２５年６月８日

-->

<?php

// 健康状態を配列に代入

$conditions = ['良好', '普通', '最悪'];

// プレイヤーの健康状態がPOSTされたら

if (isset($_POST['condition'])) {

// プレイヤーの健康状態を代入

$playercondition = $_POST['condition'];

// PCの健康状態をランダムで選択

$key = array_rand($conditions);

$pccondition = $conditions[$key];

// 返事の内容を判定

if ($playercondition == $pccondition) {

$result ='一緒だね';

} elseif ($playercondition == '良好' && $pccondition == '普通') {

$result = 'いいね';

} elseif ($playercondition == '良好' && $pccondition == '最悪') {

$result = '元気分けてくれる？';

} elseif ($playercondition == '普通' && $pccondition == '良好') {

$result = '元気出していこう';

} elseif ($playercondition == '普通' && $pccondition == '最悪') {

$result = '頑張ろうね';

} elseif ($playercondition == '最悪' && $pccondition == '良好') {

$result = '元気分けてあげる';

} elseif ($playercondition == '最悪' && $pccondition == '普通') {

$result = 'ゆっくり休もう';

} else {

$result = '？';

}

<!DOCTYPE html>

<head>

</head>

<body>

<h1>今日の体調は？</h1>

<?php if($_SERVER['REQUEST_METHOD'] === 'POST'){ ?>

<dl>

<dt>自分の体調：<?php echo $playercondition; ?> </dt>

<dt>PCくんの体調：<?php echo $pccondition; ?></dt>

<dt>PCくんの回答：<?php echo $result; ?></dt>

</dl>

<?php

}

</form>

</div>

</body>

</html>

■解説等■

isset は、値が NULL ではない場合に true を返す関数です。
POSTで送信したデータを取得するには、スーパーグローバル変数である$_POSTを使用します。スーパーグローバル変数は、定義済み変数でプログラムコード中何処からでも使用可能な変数のことです。
array_randは、配列から一つ以上のキーをランダムに取得する。配列の値ではなく配列のキーを返すので注意
$_SERVER[‘REQUEST_METHOD’]は、ページにアクセスする際に使用されたリクエストのメソッド名を取得。

サーバーにアップロード

次に、準備したPHPファイル「test002.php」をサーバーにアップロードします。

アップロード先は、「public_html」です。

私の環境では、「/public_html/newrongo55.hopto.org」内に「test002.php」をアップロードしました。

iframeタグで記事に埋め込む

最後に、iframeタグで、「test002.php」を読み込む処理を記事内に記述します。

■コード■


<iframe frameborder="0"  width="900" height="300" allow="fullscreen" src="https://newrongo55.hopto.org/test002.php"></iframe>

普通にiFrameタグのみの場合、サイズが合わないので、iFrameのパラメータでカスタマイズします。

幅（width）：このパラメーターを使用すると、iFrameの幅をピクセル単位で設定できます。
高さ（height）：幅パラメーターと同様に、高さはウェブページ上のiFrameウィンドウのサイズをピクセル単位で設定します。
許可（allow）：このパラメータを使用すると、全画面表示など、iFrameの特定のデフォルト機能を設定できます。

結果を表示する

この記事にiFrameタグで埋め込むと、このように表示されました。↓

まとめ

今回は、inputに対して回答するプログラムをPHPで作って、iframeタグでWordPress記事に埋め込んでみました。

これからWordPressでWEBサイトを立ち上げる方の参考になれば嬉しいです。

参考