トマシープが学ぶ

Unity/VR/AR/デザイン好きのミーハー 記事内容は自分用のメモです

古い記事に警告を出す

古い記事に警告を出す

いろいろあったので、Qiitaみたいに古い記事には警告を出すようにする。

f:id:bibinbaleo:20220327221716p:plain

正直技術記事ばかりじゃないから、全部に出すのは変な感じがするけどまあいいか。

 

最終更新日をもとに警告を出した方がいいのかな?更新していたとしても情報が古いのは私のブログだとよくあるしな・・・

 

こちらの記事のスクリプトをお借りした

masawada.hatenablog.jp

headに書く

f:id:bibinbaleo:20220327222604p:plain

できた〜

f:id:bibinbaleo:20220327222053p:plain

bibinbaleo.hatenablog.com

最終更新日ではなく、公開日をもとに出るみたいなのでいいね!

 

最終更新日を表示

それはそれとして最終更新日も表示したい!

こちらの記事のスクリプトをお借りした!記事下に書く

www.bambi.pro

<!-- 最終更新日 -->
<style>
.lastmod{
    margin-left: 1em;/*位置調整 - 左からの距離*/
    padding: 0.2em 1em;/*位置調整 - 周りの余白*/
    /*background-color: #f5f5f5; 背景色 -不必要ならこの行消す*/
    /*border-radius: 0.5em; 背景の角丸 -不必要ならこの行消す*/
    color: #000; /*日付の色*/
}
.lastmod:before{
    font-family:"blogicon";
    content: "\f02b";/*更新日のアイコン*/
    position: relative;
    letter-spacing: 0.5em;/*アイコンと日付の隙間*/
    font-size: 1em;/*アイコンのサイズ*/
    color: #000; /*アイコンの色*/
}

}
</style>
<script type="text/javascript">
    var jsonld = JSON.parse(document.querySelector('script[type="application/ld+json"]').innerHTML);
    var dateModified = jsonld.dateModified;
    var date = document.querySelector('div.date'); 
    var time = document.createElement('time');
    var lastmod = dateModified.substr(0, 10);
    time.innerText = lastmod
    time.setAttribute("datetime", lastmod );
    time.setAttribute("dateModified", "最終更新日:" + lastmod);
    time.className = 'lastmod';
    date.appendChild(time);
</script>

 

ちょっとデザインをいじってこんな感じにした

f:id:bibinbaleo:20220327223837p:plain


・・・と思ったけど、全部の記事にこれが出てしまう。追加で更新したものだけがいいな〜それは無理なのかな?

というかそもそもうちのブログの日付のデザインこんなだったっけ・・・?

dayがでかい。普通にしたい・・・

日付のデザイン変更

こちらの記事のシンプルなのを試してみた

blog.minimal-green.com

が、変になってしまった。元の個性を消せない

f:id:bibinbaleo:20220327224612p:plain

 

じゃあいいや。最終更新日の方を見てもらおう