HPB18　｜　HPB19 コンテンツ一覧
ホーム　＞　HPB19　＞　現在の日付と時刻を表示する
目次　｜　元のページ 前のページ　｜　次のページ サイトマップ　｜　ページEND

ホームページビルダー19　現在の日付と時刻を表示する


ホームページビルダー19　現在の日付と時刻を表示する



ホームページビルダー19 では、ページ内任意の場所に、そのページを表示した際の日付と、ステータス（システム）行に、現在の日付と時刻をリアルタイム表示できます

ページ内 日付表示
ページ内に日付を表示したい場合、例えば、こんな感じで表示できます ⇒


システム行 日付時刻表示
右の枠内には、日付と時刻をステータス行に表示する為の設定が埋め込まれていますが、JavaScriptで設定しているため、ここには何も表示されません
実際の表示内容は、このページ下端、ステータス行の左端をご参照下さい		 ⇒


ともに、JavaScript を利用していますが、ホームページビルダーの「ページ編集」画面上の操作のみで、設定できます
JavaScript を自分でコーディングする必要はありません
インターネットエクスプローラー セキュリティ設定





 なお、ステータス行表示を行うためには、ブラウザのセキュリティ設定で、ステータス行表示を許可する必要があります

IE （ Internet Explore インターネットエクスプローラー ）の場合、ブラウザ上端メニューバーの「ツール」 → 「インターネットオプション」 → 「セキュリティ」タブ → 「レベルのカスタマイズ」 → 「スクリプト」カテゴリ内 → 「スクリプトでのステータスバーの更新を許可する」を有効にチェックを付けます

ページ内で、現在時刻をリアルタイム表示させる「時計」の作り方につきましては、「 JS 日付・時刻をリアルタイム表示する 時計の作り方 」をご参照下さい
JavaScript を記述するため、コピペするだけで作れるよう、サンプル文を用意しています



ページ内に現在の日付を表示する
ホームページビルダー19 現在の日付を表示する場所を指定する




 その日の日付を表示したい場所をクリックします
ホームページビルダー19 現在の日付を表示する為のスクリプトを呼び出す




 メニューバーから、「挿入」 → 「その他」 → 「スクリプト」をクリックします
ホームページビルダー19 現在の日付を表示する為のスクリプトを指定する




 左下枠、「ライブラリ」内、中程にある、「日付（YYYY年MM月DD日(W)）を表示します。」を右クリックします

「スクリプトに挿入」ダイアログが出ますので、そこをクリックします
ホームページビルダー19 現在の日付を表示する為のスクリプトを埋め込む




 右下枠内の、「～
// コードを挿入します。」の下に、「

function _HpbDays()
{
this[0] = "日"; this[1] = "月"; this[2] = "火"; this[3] = "水";
this[4] = "木"; this[5] = "金"; this[6] = "土";
}

var now = new Date();
var yr = now.getYear();
var mn = now.getMonth() + 1;
var dt = now.getDate();
var dy = now.getDay();

var fyr = (yr < 1900) ? 1900 + yr : yr;

var dys = new _HpbDays();
var dyj = dys[dy];

document.write(fyr + "年" + mn + "月" + dt + "日" + "(" + dyj + ")");

」 が埋め込まれます

この埋め込まれた行が、現在の日付を表示為の設定（JavaScript）です
ホームページビルダー19 現在の日付を表示する為のスクリプトのコメント行です




 左図で青色反転させている部分は、「 // 」で始まる行はコメント行です
ホームページビルダー19 現在の日付を表示する為のスクリプトのコメント行を削除する




 上記コメント行は削除して、左図の様にしても構いません

残しておいても、問題はありません

ただし、その前後にある
「 <!-- 」 と 「 //--> 」行は、
この中が、「 JavaScript 」であることを示す重要な行なので、絶対に削除してはいけません

「OK」をクリックします
ホームページビルダー19 現在の日付を表示する為のスクリプトは{S}マークで表示されます




 指定したところに、スクリプト｛ JavaScript ）が書かれていることを示す「 ホームページビルダー19 現在の日付を表示する為のスクリプトは{S}マークです 」 （ {S} ）マークが入ります
ホームページビルダー19 現在の日付を表示する為のスクリプトのブラウザ表示結果です




 ブラウザに表示させると、
「 2014年7月3日(木) 」と表示されます

（左図、中程、やや右寄りのところ）


日付と時刻をステータス行に表示する
ホームページビルダー19 日付と時刻をステータス行に表示する場所を指定する




 「日付と時刻をステータス行に表示する」為の設定を埋め込む場所をクリックします

この設定自体は、ブラウザには表示されませんので、ページレイアウトを邪魔しない場所（ページ末尾とか）がお勧めです
ホームページビルダー19 日付と時刻をステータス行に表示する為のスクリプトを呼び出す




 メニューバーから、「挿入」 → 「その他」 → 「スクリプト」をクリックします
ホームページビルダー19 日付と時刻をステータス行に表示する為のスクリプトを指定する




 左下枠、「ライブラリ」内、中程にある、「日付と時刻（YYYY年MM月DD日(W) HH時MM分SS秒）をステータス行に表示します。」を右クリック → 「スクリプトに挿入」をクリックします
ホームページビルダー19 日付と時刻をステータス行に表示する為のスクリプトを埋め込む




 右下枠内の、「～
// コードを挿入します。」の下に、
「_HpbClockStatusJpl();」が埋め込まれます

この埋め込まれた行が、日付と時刻をステータス行に表示する為の設定（JavaScript）です
ホームページビルダー19 日付と時刻をステータス行に表示する為のスクリプトのコメント行です




 その上の青色反転させている左先頭が「 // 」で始まる行はコメント行です
ホームページビルダー19 日付と時刻をステータス行に表示する為のスクリプトのコメント行を削除する




 上記コメント行は削除して、左図の様にしても構いません

残しておいても、問題はありません

ただし、その前後にある
「 <!-- 」 と 「 //--> 」行は、
この中が、「 JavaScript 」であることを示す重要な行なので、絶対に削除してはいけません

「OK」をクリックします
ホームページビルダー19 日付と時刻をステータス行に表示する為のスクリプトは{S}マークで表示されます




 指定したところに、スクリプト｛ JavaScript ）が書かれていることを示す「 ホームページビルダー19 日付と時刻をステータス行に表示する為のスクリプトは{S}マークです 」 （ {S} ）マークが入ります
ホームページビルダー19 日付と時刻をステータス行に表示する為のスクリプトのブラウザ表示結果です




 ブラウザに表示させると、
「 2014年7月4日(金)  9時32分15秒」と表示されます

（左図、左下端）


ブラウザ表示時は、「 ホームページビルダー19 日付と時刻をステータス行に表示する為のスクリプトは{S}マークですが表示されません 」 （ {S} ）マークは、表示されません



お断り　　説明内容に支障のないところでは、ホームページビルダー18 のハードコピーが使われておりますこと、ご了承下さい

目次　｜　元のページ 前のページ　｜　次のページ サイトマップ　｜　ページTOP
ホーム　＞　HPB19　＞　現在の日付と時刻を表示する
HPB18　｜　HPB19 コンテンツ一覧
　 　

© 2014 abhp.net All Rights Reserved.
ページTOP
ページTOP
ページTOP
ページTOP
ページTOP
ページTOP