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