以前、作成したブログカスタマイズをまとめてみました。
どのテーマでも使えるので、気になったら導入してみてください。
目次に戻るボタン

各見出し(h2)の終わりに「↑目次へ戻る」ボタンが一時期流行しましたので、それぞれの目次用に作成したものです。
やり方はfunction.phpへ下記のコードを挿入するだけです。
cssも入れてあげると見た目が調整できます。
目次下ウィジェットの追加するカスタマイズ[プロフィール]

目次下に自分のプロフィールを追加すると著者のことがわかりやすいので作成しました。
やり方はfunctions.phpに下記のコードを入れると、ウィジェットで目次下という項目が追加されます。

目次の表示方法によって、コードを一部変更する必要があります。
ショートコードで特定のカテゴリーリストを表示するカスタマイズ

functions.phpにコードを挿入
下記のコードをfunctions.phpに挿入します。
cssにコードを挿入
下記のコードをcssに挿入します。
Note風シェアボタンのカスタマイズ

Noteのシェアボタンって、使いやすくて良いですよね?
WordPressでも似たようなことをしてみました。
記事下のウィジェットにHTMLの追加
記事下のウィジェットにカスタムHTMLにて下記のコードを貼り付けます。
※一箇所<TwitterID>と書いてある場所は手動でご自身のTwitterIDを入力してください。
CSSの追加
CSSも追加します。
functions.phpの追加
functions.phpに下記のコードを追加すると追従するようになります。
シェアボタンの高さの調整
スマホでシェアボタンを確認します。
フッターメニューがある場合は高さを変えるCSSを入れて調整します。
.share a {
position: fixed;
bottom: 26px;
}
Note風いいねボタンを導入するカスタマイズ
さらにいいねボタンも追加してみます。

プラグイン「WP ULike」のインストール
いいねの計測プラグインをインストールします。

HTMLの追加
記事下ウィジェットにカスタムHTMLを追加します。
<div class="like-button-mobile">[wp_ulike]</div>
CSSの追加
Noteの見た目に近づけるためにCSSを追加します。
以上です。
年齢の計算
年齢の表示を動的に変更する方法です。やり方は下記のコードをfunctions.phpに挿入。
function calcAge($attr) {
$now = date("Ymd");
$birth = $attr[0];
return floor(($now-$birth)/10000);
}
add_shortcode('my_age', 'calcAge');
あとは28歳
といった感じショートコードを入れるだけです。
28歳
(現在の年月日-生年月日)/10000で計算して少数点以下を切る捨てると年齢になります。
便利なブログカスタマイズまとめ
本記事では【WordPress】UX向上!便利なブログカスタマイズ[どのテーマでも使える]について書きました!
是非お試しください。
functions.phpまとめ

プラグイン無しでカスタマイズできます。
⇨ 【WordPress】プラグイン無しで機能拡張!「functions.php」のおすすめコード

画像を差し替える方法

最適化した画像に差し替える時の参考になります。
⇨ 【WordPress】画像パスをまとめて変して差し替える方法
