★===　テーマ「Palette（パレット）」Q & A のページ　===★

ページャーの表示に関して

.pager{display:block;}

グローバルヘッダーとグローバルナビゲーションについて

日付の表記について

★id:ooyukidaさんからの質問★
最終更新日の表示の仕方です。
2021/11/15 - 追記
新しくjavascriptで作ったやり方を載せています。コードめちゃ短くて簡単です♪
Paletteを使っている人用のCSSコードも一緒に載せてます。
【はてなブログ】最終更新日を追加する方法（短くて簡単！コピペでOK）CSSとJavascript利用 - バンビの初心者ブログ教室

↓↓古いやり方（一応、残しておきますね）
当ページで利用しているものですが、sitemap.xmlから最終更新日を取得するやり方で表示速度が極端に遅いことと、Google検索の日付表示などには対応できてないみたいです。
私は専門家ではないので、動作やGoogleのSEO的なことは保証できませんので、その点はご了承の上、ご自身の判断で使ってくださいね^^;

★javascriptはこちらの記事のものを利用しました↓↓（自分で必要箇所を改変しています）★
はてなブログの記事の最終更新日を取得 - はしくれエンジニアもどきのメモ

★CSSとjavascript↓↓★
デザイン→記事→記事下にコピペ

<style>
    .lastmod{
        margin-left: 1em;
        padding: .2em 1em;
    	background-color: #f5f5f5;
    	border-radius: .5em;
    	color: #3fc1c9;
    }
    .lastmod:before{
        font-family:"blogicon";
        content: "\f02b";
        position: relative;
        letter-spacing: .5em;
        font-size: 1em;
        color: #3fc1c9;
    }
    .date a:before{
        font-family:"blogicon";
        content: "\f024";
        position: relative;
        letter-spacing: .5em;
        font-size: .8em;
        color: #3fc1c9;
    }
</style>

<!-- 更新日を追加 -->
<script type="text/javascript">
(function(){
/*
- args: lastmod: str
*/
function addLastmod(lastmod){
  /* ここでlastmodを追加 */
  var time = document.createElement("time");
  time.setAttribute("datetime",lastmod);
  var lastmod = lastmod.substr(0, 10);
  time.setAttribute("last-modified-date", lastmod);
  time.innerText = lastmod;
  var span = document.createElement("span");
  span.innerHTML = time.outerHTML;
  span.className = "lastmod";
  var date_elements = document.querySelectorAll("div.date")
  Array.prototype.map.call(date_elements, function(e){e.appendChild(span);});
}

var blog_uri = document.querySelector("[data-blog-uri]").getAttribute("data-blog-uri");
var sitemap_url = blog_uri + "sitemap.xml";
var article_url = document.querySelector('[property="og:url"]').getAttribute("content");

function fetch2str(res) {
  return res.text();
}

function str2dom(str) {
  var parser = new DOMParser();
  var dom = parser.parseFromString(str, 'text/xml');
  return dom;
}

/*
return : Promise([URL1, URL2, ...])
*/
function getSitemapURLArrayPromiseFromSitemapXML() {
  return fetch(sitemap_url)
    .then(fetch2str)
    .then(str2dom)
    .then(function(dom) {
      return Array.prototype.map.call(dom.querySelectorAll("sitemap"), function(e) {
        return e.querySelector("loc").innerHTML
      });
    });
}

/*
- return Promise([""<xml >?page=1...</xml>", "<xml >?page=2...</xml>", ...])
*/
function getXMLStrArrayPromiseFromAllSitemapURL(URL_array) {
  return Promise.all(URL_array.map(function(e) {
    return fetch(e).then(fetch2str);
  }));
}

/*
return Promise(url_element in DOMParser)
*/
function find_urlElementMatchedAtriclePromiseFromXMLStrArray(xml_str_arr) {
  var parser = new DOMParser();
  var find_url_e = undefined;
  for (var xml_str of xml_str_arr) {
    var dom = parser.parseFromString(xml_str, 'text/xml');
    var url_elements = dom.querySelectorAll("url");
    find_url_e = Array.prototype.find.call(url_elements, function(e, idx, arr) {
      return e.querySelector("loc").innerHTML === article_url;
    });
    if (find_url_e) break;
  }
  return find_url_e;
}

function getLastmodFrom_urlElement(url_element){
  return url_element.querySelector("lastmod").innerHTML;
}

try{
getSitemapURLArrayPromiseFromSitemapXML()
  .then(getXMLStrArrayPromiseFromAllSitemapURL)
  .then(find_urlElementMatchedAtriclePromiseFromXMLStrArray)
  .then(getLastmodFrom_urlElement)
  .then(addLastmod);
}catch(e){
  console.log(e);
}
}());
</script>

（自分メモ）javascript変更したところ
↓↓
【オリジナル】

span.innerHTML = "(LastModified: " + time.outerHTML + ")";

【日付表示部分】
time.outerHTML（←最終更新日）だけの表示にして、CSSのclass名（className）を設定した。
↓↓

span.innerHTML = time.outerHTML;
span.className = "lastmod";

【更新日】の時刻（時分秒まで）が表示されてしまうのを直しました。
↓↓

  var time = document.createElement("time");
  time.setAttribute("datetime",lastmod);
  var lastmod = lastmod.substr(0, 10);
  time.setAttribute("last-modified-date", lastmod);
  time.innerText = lastmod;

目次の表記について

★えりな (id:exciting-sky) さんからの質問
目次のアイコンを変更するやり方です。

★アイコンの変更

/*== icons ==*/
ul.table-of-contents li:before
{font-family:"blogicon";
content:"\f006";/*（←アイコンは数字を変更する）*/
color:#7a443b;}/*（←色を変更する）*/

アイコンはこちらの記事の「はてなブログ」に元々備わっているものを利用しています。
↓↓
【はてなブログ】ブログアイコン、Webフォント一覧（124種類）使い方、表示されない時の対処法 - バンビの初心者ブログ教室

★ちなみに、[ もくじ ]の表記を変えたい場合は、こちら。
（デザインCSSへコピペ）

ul.g-box:before {
  content: "[  もくじ  ]"; }/*←目次の上部に表示される文字*/

目次については、以下の記事も参考にしてください。
はてなブログ目次をCSSだけで開閉式にする方法 コピペOK（目次の表示/非表示切り替え） - バンビの初心者ブログ教室
www.bambi.pro