前回、
「次回に続きます」と書いておきながら、すっかり忘れていました(^_^;)
ということで、
今回は細かい機能について書きたいと思います。
記事一覧を更新日時の順にする
記事一覧は投稿日時の順（降順）に並んでいます。
つまり新しい記事ほど先頭にあるというわけです。まぁ至極自然な並びですね。
しかし、以前に書いた古い記事の内容を更新しても、一覧における並びは変わりません。
せっかく更新したのに、それを訴求できないのは何か淋しい・・・(^_^;)
なので、こちらを参考に記事一覧を更新日時の順に変えるようにしました。
functions.php に以下のコードを追加しました。
add_action( 'pre_get_posts', function( $query ) {
// 記事一覧を更新日時の順にする→https://tabibitojin.com/post-list-sort-order-change/
if ( $query->is_main_query() ) {
$query->set( 'orderby', 'modified' );
}
});テキストエデイタにクイックタグを追加する
WordPressで記事を編集するためのエディタとして現状で使用できるものは、クラシックエディタ（テキストまたはビジュアル）とブロックエディタがあります。
デフォルトはブロックエディタですが、自分はどうにも馴染めずもっぱらテキストエディタを使っています(^_^;)
ブロックエディタは見た目通りに再現してくれるのは良いのですが、なんかじれったい感じ。
マウスカーソルをあちこちへ移動してボタンとかをポチポチ押したりせずに、キーボード入力メインで記事を書くことに極力注力してやりたいんです！
ただ、クラシックエディタのサポートがいつまで続くのかが気になります。
こちらによると、
Classic Editor は公式な WordPress プラグインであり、少なくとも2022年まで、または必要なくなるまでの間、完全にサポート・保守されます。
ということなので、まだしばらくは大丈夫なようですが・・・。
それはともかく、
テキストエディタの使い勝手を向上させるためにクイックタグを追加します。
クイックタグというのは↓こういうやつです。HTMLタグを入れる際に便利なボタンのことです。
こちらを参考にやってみます。
実際のソースコードを参照してみると以下のような感じになっていました。
wp-includes/js/quicktags.js の700行目あたりでやっています。
edButtons[10] = new qt.TagButton( 'strong', 'b', '<strong>', '</strong>', '', '', '', { ariaLabel: quicktagsL10n.strong, ariaLabelClose: quicktagsL10n.strongClose } );
edButtons[20] = new qt.TagButton( 'em', 'i', '<em>', '</em>', '', '', '', { ariaLabel: quicktagsL10n.em, ariaLabelClose: quicktagsL10n.emClose } );
edButtons[30] = new qt.LinkButton(); // Special case.
edButtons[40] = new qt.TagButton( 'block', 'b-quote', '\n\n<blockquote>', '</blockquote>\n\n', '', '', '', { ariaLabel: quicktagsL10n.blockquote, ariaLabelClose: quicktagsL10n.blockquoteClose } );
edButtons[50] = new qt.TagButton( 'del', 'del', '<del datetime="' + _datetime + '">', '</del>', '', '', '', { ariaLabel: quicktagsL10n.del, ariaLabelClose: quicktagsL10n.delClose } );
edButtons[60] = new qt.TagButton( 'ins', 'ins', '<ins datetime="' + _datetime + '">', '</ins>', '', '', '', { ariaLabel: quicktagsL10n.ins, ariaLabelClose: quicktagsL10n.insClose } );
edButtons[70] = new qt.ImgButton(); // Special case.
edButtons[80] = new qt.TagButton( 'ul', 'ul', '<ul>\n', '</ul>\n\n', '', '', '', { ariaLabel: quicktagsL10n.ul, ariaLabelClose: quicktagsL10n.ulClose } );
edButtons[90] = new qt.TagButton( 'ol', 'ol', '<ol>\n', '</ol>\n\n', '', '', '', { ariaLabel: quicktagsL10n.ol, ariaLabelClose: quicktagsL10n.olClose } );
edButtons[100] = new qt.TagButton( 'li', 'li', '\t<li>', '</li>\n', '', '', '', { ariaLabel: quicktagsL10n.li, ariaLabelClose: quicktagsL10n.liClose } );
edButtons[110] = new qt.TagButton( 'code', 'code', '<code>', '</code>', '', '', '', { ariaLabel: quicktagsL10n.code, ariaLabelClose: quicktagsL10n.codeClose } );
edButtons[120] = new qt.TagButton( 'more', 'more', '<!--more-->\n\n', '', '', '', '', { ariaLabel: quicktagsL10n.more } );
edButtons[140] = new qt.CloseButton();qt = window.QTags となっており、自前でコードを書く際は export されている QTags を使って書くことになります。つまり、QTags.TagButton() でクイックタグを作って、edButtons という配列に設定すれば良い感じですね。edButtons も export されているグローバルな変数です。
ただ、配列の添字が連続しておらず10の整数倍な値になっているのがちょっと謎です。
何か意図的にやっているのでしょうか。途中にも追加できるようになっているということかな？
ということで、
個人的に必要なクイックタグを設定するために、functions.php に以下のコードを追加しました。
add_action( 'admin_print_footer_scripts', function() {
// テキストエデイタにクイックタグを追加➔https://wpdocs.osdn.jp/%E3%82%AF%E3%82%A4%E3%83%83%E3%82%AF%E3%82%BF%E3%82%B0API
if ( wp_script_is( 'quicktags' ) ) {
?>
<script>
// タグ名と一致させるために既定の表示名を変更。
edButtons[10].display = 'strong';
edButtons[20].display = 'em';
// 順番も考慮しつつ、隙間に登録。
edButtons[9] = new QTags.TagButton('b', 'b', '<b>', '</b>');
edButtons[121] = new QTags.TagButton('h2', 'h2', '<h2>', '</h2>\n');
edButtons[122] = new QTags.TagButton('h3', 'h3', '<h3>', '</h3>\n');
edButtons[123] = new QTags.TagButton('h4', 'h4', '<h4>', '</h4>\n');
edButtons[124] = new QTags.TagButton('h5',' h5', '<h5>', '</h5>\n');
edButtons[125] = new QTags.TagButton('h6',' h6', '<h6>', '</h6>\n');
// for prism.js
edButtons[126] = new QTags.TagButton('html','html', '<pre><code class="language-markup">', '</code></pre>\n');
edButtons[127] = new QTags.TagButton('css','css', '<pre><code class="language-css">', '</code></pre>\n');
edButtons[128] = new QTags.TagButton('js','js', '<pre><code class="language-javascript">', '</code></pre>\n');
edButtons[129] = new QTags.TagButton('php','php', '<pre><code class="language-php">', '</code></pre>\n');
edButtons[130] = new QTags.TagButton('bash','bash', '<pre><code class="language-bash">', '</code></pre>\n');
</script>
<?php
}
}); さて、20数回に渡ってやってきましたこのシリーズですが、
とりあえずは今回で終わりにしたいと思います。