javascriptについて

wordPressの記事内でjavascriptを使うには、javascriptをヘッダーに埋め込むことがが必要になり、カスタムフィールドを使って実装する方法が一般的のようである。 そこで、ページにカスタムフィールドを挿入するショートコードのプラグイン Add-css-jsを使って実現した。

＜インストール＞

  1. Add-css-jsをダウンロードして、解凍後、フォルダー毎 ・・・/wp-content/pluginsデ  ィレクトリにアップロードする。
  2. Add-css-jsプラグインを有効にする。
  3. 使い方は、ここを参照。

＜javascript＞

使用したjavascriptは日本時間とグリニッジ時間を表示するもので次のとおり。

<script type="text/javascript">
var timeId;
function disp()
{
    var now = new Date(); 

    // （不要な行を削除する）
    var watch1 = now.toLocaleString();  // ローカル時
    var watch2 = now.toGMTString();     // グリニッジ標準時

    // テキストフィールドにデータを渡す処理（不要な行を削除する）
    document.form1.field1.value = watch1; // ローカル時
    document.form1.field2.value = watch2; // グリニッジ標準時 

    timeId=setTimeout("disp()", 1000);
}
    // -->
</script>
<form action="#" name="form1">
<input type="text" name="field1" size="50"> ローカル時<br>
<input type="text" name="field2" size="50"> グリニッジ標準時<br>
<input type="button" value="開始" onClick="disp()">
<input type="button" value="停止" onClick="clearTimeout(timeId)">
</form>

 ＜カスタムフィールドの設定＞
カスタムフィールドに次を追加する

  • カスタムフィールド名：js
  • 値：上記のjavascriptで<script type=”text/javascript”>～</script>で囲まれた部分を記述。<script>と</script>は不要。

サンプル（上記javascriptの結果）

ローカル時
グリニッジ標準時