【はてなブログ】リライトしてる?記事の最終更新日時を自動表示させる方法!

f:id:yuichan53world:20181122202241j:image

 

皆さんこんにちは。ゆいです🙋‍♀️

 

 

ゆいさん!ゆいさん!

はいはい!どうしました?

ゆいさんのブログを見ていたらこんなものが...

 

f:id:yuichan53world:20181122210229j:image

 

あ~。最終更新日時の自動表示ですね!

凄く気になります!

では、私が参考にしたブロガーさんの記事と合わせて紹介していきますね!!一か所にコピペを貼りつけるだけで設定完了ですよ~(^^♪

 

 

皆さん、『リライト』してますか?

 

ブログ記事を投稿した後、投稿しっ放しになっていませんか?

 

記事を投稿してから時間が経ってしまった場合、誤った情報になっている可能性もあります!

 

投稿した記事は積極的にリライトしましょう!

 

リライトは『SEO』からも大きな評価を貰えますからね〜(^^)

 

 

 

更新日時表示のメリット

 

ブログを投稿した日時から時間が経つにつれて、読んでいる人はこの情報は

 

『今現在も正しいの?』

  

と思われてしまうケースがあります!

 

例えば、1年前は正しかった情報も1年後には違った情報が正しくなっている事もざらにありますよね!

 

その為に、ブログ記事を更新し直した場合は、『更新してあるよ!!』と表記されていると読み手は安心して情報を読み取る事が出来るようになりますね!

 

これが『最終更新日時表示』のメリットです!

 

1つの『HTML』をコピペするだけで、全ての記事に反映されますので、まだやってない人はやる事をお勧めします!

 

 

私はこちらの方のブログを参考にしました!『HTML』の貼り付け場所の説明を加えて、説明していきます!!

 

psn.hatenablog.jp

 

 

 

『HTML』の貼り付け場所

 

<!-- すなばいじり はてなブログPro用の最終更新日時表示 -->















<script>















(function () {















	var blogData = document.getElementsByTagName("html")[0].dataset;















	if (blogData.page === "entry") {















		if (document.readyState == "uninitialized" || document.readyState == "loading") {















			window.addEventListener("DOMContentLoaded", function () {















				$.ajax({















					dataType: 'html',















					url: location.origin + location.pathname + "?amp=1"















				}).done(function (data, status, xhr) {















					data = data.match(/<script type="application/ld+json">(.*?)</script>/);















					if (data != null) {















						data = data[1];















						var ldData = JSON.parse(data);















						var datetimeHTML = new Date(ldData.dateModified);















						var deltaDatetime = Hatena.Locale.deltaDatetime(new Date(ldData.dateModified));















						console.log("data " + deltaDatetime);















						var ButtonElm = document.createElement('div');















						ButtonElm.innerHTML = '最終更新' + datetimeHTML.toLocaleDateString() + ' (' + deltaDatetime + ')';















						document.querySelector("header.entry-header").appendChild(ButtonElm);















					} else {















						console.log('AMPを利用できる設定ではない');















					}















				}).fail(function (xhr, status, error) {















					// 通信失敗















					console.log('通信失敗');















				});















			}, false);















		}















	}















})()















</script>















<!-- すなばいじり はてなブログPro用の最終更新日時表示 ここまで -->

 

はてなブログで記事の最終更新日時を表示する - すなばいじり

 

・まずはじめにこちらをすべて【コピペ】します!!

 

 

次に『ダッシュボード』⇒『デザイン』

 

 

f:id:yuichan53world:20181122202730p:plain

 

 

次に『デザイン』⇒『カスタマイズ』

 

 

f:id:yuichan53world:20181122192601p:plain

 

 

最後の『ヘッダ』⇒『タイトル下』

 

 

f:id:yuichan53world:20181122192950p:plain

 

 

ここまできたら、『タイトル下 HTMLを記述できます』の下枠に先ほどの【コピペ】を貼り付け、変更を保存をクリックして完了です!!

 

 

f:id:yuichan53world:20181122192311p:plain

 

 

あとはすでに投稿してある、記事を更新して、確認してみてください!『更新日時』が表示されていたらOKです!!

 

 

 

それでは!