日付を自動更新で表示させる! 簡単コピペ!!

先週『日付を毎月変えるの邪魔くさいし、サイトに書いてる日付とってくれへんやろか?』という依頼がありました。

とってもよかったのですが、やっぱり月に一回更新作業はしといた方がSEO的にもよいでしょうし、とるのはオススメはしませんでした。でもやっぱり依頼にはお応えしたい。。

ということで、とりあえず日付を自動で更新できたら、ちょっとは問題解決につながるかな?と思い、日付を自動更新させることにしました。
その記述、簡単だったので書いておきます。

記述方法

至って簡単です。
このように記載したい場合は

body内の表示したい場所に

<script language="JavaScript">
mydate=new Date();
Ye=mydate.getFullYear()+"年";
Mo=mydate.getMonth()+1+"月";
Da=mydate.getDate()+"日";
Day=mydate.getDay();
Day2=new Array(7);
Day2[0]="日";Day2[1]="月";Day2[2]="火";
Day2[3]="水";Day2[4]="木";Day2[5]="金";
Day2[6]="土";
document.write("<span style='color:#ff0000;'>");
document.write("今日は"+Ye+Mo+Da+"("+Day2[Day]+")");
document.write("です</span>");
</script>

と記述します。
※ 12行目はわかりやすいように直接styleを書いてますが、実際はオリジナルのクラスをつけて、text-align:center;等も足してます。

応用編

『今日は』とか『です』とか、クラスの設定(上の場合は、colorを赤になるクラス)
が必要ない場合はもっと簡単です。

<script language="JavaScript">
mydate=new Date();
Ye=mydate.getFullYear()+"年";
Mo=mydate.getMonth()+1+"月";
Da=mydate.getDate()+"日";
Day=mydate.getDay();
Day2=new Array(7);
Day2[0]="日";Day2[1]="月";Day2[2]="火";
Day2[3]="水";Day2[4]="木";Day2[5]="金";
Day2[6]="土";
document.write(Ye+Mo+Da+"("+Day2[Day]+")");
</script>

これでOK!!

『曜日』とか『日付』とかがいらない場合はさらに簡単です。

<script language="JavaScript">
mydate=new Date();
Ye=mydate.getFullYear()+"年";
Mo=mydate.getMonth()+1+"月";
document.write(Ye+Mo);
</script>

ついでにもうひとつ。
『年』とか『月』がいらない場合は、

<script language="JavaScript">
mydate=new Date();
Ye=mydate.getFullYear()+"/";
Mo=mydate.getMonth()+1;
document.write(Ye+Mo);
</script>

これでOK!!!

コピペするなり、応用して色んな表示にして使ってくださいね!



関連記事

wordmork.itの画像3

wordmark.it でフォントを選ぶ方法


フォント選びって結構大変ですよね。使用するフォントによって、そのサイトなりデザインの印象が変わってくるので、色選びもそう…

記事を読む▷


『Contact Form 7』で今日の日付けを表示させ、メールで送信する時『年月日』に変更する方法


WordPressで『問い合わせページ』を作る時になくてはならい存在のプラグイン『Contact Form 7』。 …

記事を読む▷


アイキャッチ_RSSImport

WordPress:プラグイン”RSSImport”を使って気になるサイト等の最新情報を表示させる方法


前回はRSSのボタンを自分のサイトに表示させる方法を書いたのですが、今回は自分のサイト以外(勿論自分のものもOK!)の気…

記事を読む▷


MySQL移行ツールにて移行

MySQL 5.5→5.7への移行手順:XSERVER(エックスサーバー)にて


数年ぶりに新規でワードプレスを使用したサイトを作ったのですが、MySQLのバージョン、5.7しか新規では追加できないよう…

記事を読む▷


右下のreCAPTCHA

『reCAPTCHA v3』を2ページ以上表示させる時の方法(問い合わせ+α・固定ページ・投稿ページetc..)


以前『reCAPTCHA v3』を問い合わせページのみ&左側に表示させる方法:その2を書いた時は、問い合わせページにのみ…

記事を読む▷


Message

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

  • 人気の記事

    デザイン・撮影サービス

    3STARS DESIGN(スリースターズ デザイン) |デザインサービス 3STARS(スリースターズ)|スタジオサービス

新着記事

  • デザインサービス

    3STARS DESIGN(スリースターズ デザイン) |デザインサービス