[Vaster2]時計マークの変更と「公開日」の文字追加、最終更新日の文字の前にリフレッシュマークを追加

時計マークの変更

ここでイイ感じのマークを選んでおきます。 Font Awesome Icons今回はペンシルのマーク<i aria-hidden="true" class="fa fa-pencil"></i>にしました。

検索と置き換え

HTMLを編集します。必ずバックアップを取ってから作業してください。

テーマ==>>HTMLの編集からfa-clock-oを検索

<i aria-hidden='true' class='fa fa-clock-o'/>

fa-clock-oをfa-pencilに書き換え

<i aria-hidden='true' class='fa fa-pencil'/>

自分の環境では2か所でした。 1つ目がTOPページ、2つ目が記事ページのようです。

公開日の文字追加

先ほど置き換えた <i aria-hidden='true' class='fa fa-pencil'/>の下に

<span>公開日</span>

を追加

 <i aria-hidden='true' class='fa fa-pencil'/>
 <span>公開日</span>

これも2か所でした。

<span>で囲いましたが<div>や<p>でもいいのかもしれません。

この書き方でもいいかも

<i aria-hidden='true' class='fa fa-pencil'/>公開日

最終更新日の文字の前にリフレッシュマークを追加

以前設置した最終更新日。 この「最終更新日の文字」の前にリフレッシュマークを追加します。

HTMLを編集します、必ずバックアップを取ってから作業してください。

テーマ==>>HTMLの編集から

<span id='last-modified'><!-- ここに表示される --></span> を検索。

上に

<i aria-hidden='true' class='fa fa-refresh'/>

を追加

<i aria-hidden='true' class='fa fa-refresh'/>
<span id='last-modified'><!-- ここに表示される --></span>

公開日の日付とリフレッシュマークの間が狭かったので、すこし広げました

<i aria-hidden='true' class='fa fa-refresh' style='margin-left:0.5em;'/>

なんとなくイイ感じになってきました。