記事をリライトした時に更新日を「自分で付け足す」やり方
自動で「更新日」を表示させる方法ではありません!!
自分で記事ごとに「手動」で付け足す方法です。
それは、なぜか?
出来なくて、諦めたからですよ(笑)
設定の仕方
この記事の日付のようになります。
更新ではなく、新規での投稿で実験しています。
(この記事を書いてる、今日は 2019.11.8なので過去の日付になってます)
ざっくりとした「私の設定メモ」です↓
フッタ
<script> document.addEventListener('DOMContentLoaded', function(){ var entry = document.getElementsByClassName("page-entry"); if(entry.length >=1){ var x = entry[0].getElementsByClassName("date entry-date first"); var y =entry[0].getElementsByClassName("entry-updated updated"); if(x.length >=1 && y.length >=1){ x[0].appendChild(y[0]); } } }, false); </script>
デザインCSS
/*更新日表示*/
.lastmod
{ font-size: 100%; display: inline; margin-left: 10px; font-weight: bold; }
.lastmod::before
{ margin-right: 5px; padding-left: 3px; font-family: FontAwesome; content: '\f021'; }
.entry-date a::before
{ margin-right: 5px; padding-left: 3px; font-family: FontAwesome; content: '\f017'; }
.entry-content .updated{ display:none; } .page-entry .entry-header .updated{ display:inline-block; }
.page-entry .entry-header .updated:before { font-family: FontAwesome; content: "\f021"; left: 0; font-size: 95% !important; top: 0; color: #454545; padding-left: 20px; padding-right: 8px; }
headに要素を追加
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
※Font Awesomeを読み込んでいなければ追加
記事ごとに表示させる時にすること
HTML編集
<time class="entry-updated updated" datetime="2019-11-08">2019-11-08</time>
※更新日付を指定して、コードを付け足す
参考にした記事
設定は、こちらの記事を参考にさせて頂きました♪
自動で表示させたい人は、こっちで頑張って挑戦してみてください!!
過去のカスタマイズとの格闘履歴
schizoid-personality.hatenablog.com
↑会話をしてるみたいな、吹き出しのカスタマイズ。頑張ったけど、まだ使用してません(笑)
schizoid-personality.hatenablog.com
↑出来たと思ったけど、アイコンが斜めで、全体的にサイズが小さかったりしてます(笑)
schizoid-personality.hatenablog.com
↑斜体のボタンで蛍光ペンのようなマーカーを引くやつ。これは簡単でした。大活躍してます!!
記事の書き直し、リライトしてますか?
記事を修正した時用に、更新日付のカスタマズに挑戦したのですが、私は「リライト」をしていません(笑)
なので今後、記事を書き直したり、何か付けたしたりする時に、使ってみまーす。
そもそも「リライト」って、どうしてますか??
ただ内容を更新(修正)するだけ?
日付を新しく指定して、更新ですか?
下書きに戻して、再度投稿?
なんとなく、最初に投稿した日付は残しておきたいような…。
最初の頃の記事は、ホンマにしょぼ過ぎるー!!
書き直すより、削除して新しく書いたほうが早い気がします(笑)