PHPから適正にHTML化
HTMLで記述した方がわかりやすいか、PHPで記述した方がわかりやすか、悩ましいところがあり、とりあえずHTMLをPHPに書き換えてみました。
元々のHTMLタグは下記の通りです。
<?php echo $str1st; ?><br>
<a href=" <?php echo $FileName; ?> " target="_blank">
<img
src = <?php echo $FileName; ?>
alt = <?php echo $Name; ?>
title = <?php echo $str1st; ?>
width = "98%"
>
</a>
<div align="left">
<font size="1.0em">
<p>
<?php echo $str2nd; ?>
</p>
</div>
</font>変数の対応は下表のとおりです。
| 変数 | 内容 |
|---|---|
| $str1st | グラフタイトル |
| $str2nd | ※.このグラフはダミーです。 |
| $FileName | ./img/QR_ep_php.png |
| $Name | AmpiTa |
これを、そのままPHPにすると、下記のようになります。
<?php
echo $str1st.'<br>';
echo '<a href="'.$FileName.'" target="_blank">';
echo '<img '.
echo 'src = '.$FileName;
echo 'alt = '.$Name;
echo 'title = '.$str1st;
echo 'width = '.'"98%"';
echo '>';
echo '</a>';
echo '<div align="left"><font size="1.0em"><p>';
echo $str2nd."\n";
echo '</p></div></font>';
?>上記がHTMLタグに変換されると下記のようになります。
グラフタイトル
<a href="" target="_blank"><img src = ./img/QR_ep_php.pngalt = AmpiTatitle = グラフタイトルwidth = "98%"></a><div align="left"><font size="1.0em"><p>※.このグラフはダミーです。
</p></div></font>
改行が適切に行われないため、見づらいだけでなく正しく機能しません。
例えば、ファイル名（src）のあとは alt が続きますが、ここがファイルの拡張子が『pngalt』のような形になってしまい、そのあとのイコールが何なのかわかりません。
alt は『AmpiTa』と表示するよう指示しているはずが、後ろの titleとくっついてしまって『AmpiTatitle』という意味不明のものになっています。
そのあとの width も変です。
PHPで書き換えると、HTMLで正しく表示されるためには下記のように書く必要があります。
<?php
echo $str1st.'<br>'."\n";
echo '<a href="'.$FileName.'" target="_blank">'."\n";
echo '<img '."\n".
echo "\t".'src = '.$FileName."\n";
echo "\t".'alt = '.$Name.''."\n";
echo "\t".'title = '.$str1st."\n";
echo "\t".'width = '.'"98%"'."\n";
echo '>'."\n";
echo '</a>'."\n";
echo '<div align="left"><font size="1.0em"><p>'."\n";
echo $str2nd."\n";
echo '</p></div></font>'."\n";
?>上記の『”\t”』はタブです。これで頭が少し空きます。
上記の『”\n”』は改行です。HTMLの表示用の改行は『<br>』で表現していますが、ソースコード上の改行は『”\n”』です。
いずれもダブルクォーテーションで囲っています。シングルクォーテーションですと文字列として扱おうとしてしまうので、結果がおかしくなってしまいます。
上記をウェブブラウザで表示させ、ソースコードを確認してみると下記のように記述されていました。
グラフタイトル<br>
<a href="./img/QR_ep_php.png" target="_blank">
<img
src = ./img/QR_ep_php.png
alt = AmpiTa
title = グラフタイトル
width = "98%"
>
</a>
<div align="left"><font size="1.0em"><p>
※.このグラフはダミーです。
</p></div></font>見た目にもキレイになり、機能としても正常になりました。
空白で改行しない
HTMLで入力フォームを作るときに、 placeholder を使うことがあります。
この placeholder の難点として、半角スペース（空白）を改行として処理されてしまう機能があります。
PHPで placeholder に入れる文字を変数指示する際には、下記のように半角スペースを記号化する必要があります。
$str3rd = 'Write your name.';
$str3rd = str_replace(' ', ' ', $str3rd);上記の『 』が半角スペース１個という指示です。
『str_replace』は指定文字を置換するというものです。
多言語化のために
今回、PHPとHTMLを絡める中で変数を多用しているのは、多言語化対応のページを作るためです。
ページ中に出てくる文字はすべて、PHPで定義した変数を使います。
これにより、定義する際に充てる文字を置き換えることで多言語化できます。
ページのアドレスの後ろに『.php?lang=en』のようなものをつけて言語を指定することで、『en』だから英語を読み込ませようというプログラムが作れます。
現状では日本語（jp）と英語（en）だけですが、AI翻訳を使えば他の言語のページも作れるので、徐々に増やそうと思っています。
