WordPressのカスタマイズ13選

2023年3月26日2023年4月11日

　こんにちは、その日暮らしです。

　今回は、WordPressのカスタマイズのお話です。

　当ブログで実際に使っているWordPressのカスタマイズ例を13件紹介します。

　コピペフリーですので是非試してみてください。

1. wp-config.php編
- 1.1. デバッグモード
- 1.2. 記事のリビジョンの停止
2. functions.php編
3. footer.php編
- 3.1. JavaScriptとStyleSheetの一覧

wp-config.php編

デバッグモード

/* Enable Debug mode */
//define( 'WP_DEBUG', true );
/* Enable Debug logging */
//define( 'WP_DEBUG_LOG', true );
/* Disable Debug logging to Display */
//define( 'WP_DEBUG_DISPLAY', false );
//@ini_set( 'display_errors', 0 );

　デバッグログをファイルに記録するためのコードです。普段はコメントアウトしておきます。2行目と4行目と6行目と7行目のコメントを外すとデバッグモードが有効になり「wp-content」フォルダの下の「debug.log」ファイルにログが記録されるようになります。ログを記録するには以下のようなコードをログを出力したい箇所に追加します。

error_log('hogehoge');

　すると、以下のようにログが記録されます。

[25-Mar-2023 22:57:02 UTC] hogehoge

　なお、6行目と7行目はデバッグログがブラウザの画面に表示されないようにするためのコードです。デバッグログには機微な情報が含まれることがあるのでこのコードは必須です。

記事のリビジョンの停止

/** Disable post revisions */
define( 'WP_POST_REVISIONS', false );
/** Set auto save interval to 86400 seconds */
define( 'AUTOSAVE_INTERVAL', 86400 );

　記事の更新時にリビジョンが保存されるのを停止するコードと記事の自動保存の間隔を1日にするコードです(個人的な趣味です)。2行目の「false」を数字に変えるとその数だけ記事のリビジョンが保存されるようになります。また、4行目では「86400」を他の数字に変えるとその秒数間隔で記事が自動で保存されるようになります。

functions.php編

sitemap.xml作成機能の無効化

// WordPress標準のsitemap.xml作成機能を無効にする。
add_filter('wp_sitemaps_enabled', '__return_false');

　WordPress5.5からsitemap.xmlの作成機能が標準で搭載されました。ただ、この機能で作成されるsitemap.xmlは、優先度や更新頻度や更新日の情報が含まれていません。そのため、当ブログでは、プラグイン「Google XML Sitemaps」を使ってsitemap.xmlを作成しています。なので、WordPressのsitemap.xml作成機能は無効化しています。

自動補完リダイレクトの無効化

// 前方一致による自動補完リダイレクトを無効にする。
add_filter('do_redirect_guess_404_permalink', '__return_false');
// 古いスラッグによる自動補完リダイレクトを無効にする。
remove_action('template_redirect', 'wp_old_slug_redirect');

　当ブログには、パーマリンクのスラッグが「20210922-python-matplotlib-logarithmic-graph」となっている記事と「20210922-python-matplotlib-logarithmic-graph-minor-ticks」となっている記事があります。前者が後者の前方一致になっています。このような場合、自動補完リダイレクトが有効だと、記事「20210922-python-matplotlib-logarithmic-graph」へのアクセスが記事「20210922-python-matplotlib-logarithmic-graph-minor-ticks」へリダイレクトされてしまいます。それが原因で記事「20210922-python-matplotlib-logarithmic-graph」がGoogleでインデックス化されないことがあり気づくのにずいぶんと時間がかかりました。このような不都合があるので前方一致による自動補完リダイレクトは無効にするのがおすすめです。

※ 2023/4/1現在上記現象は再現しなくなりました。前方一致部分が存在していないパーマリンクだった場合のみリダイレクトするようWordPressの仕様が変わったのかもしれません。とはいえ意図しない結果となる可能性があるのでやはり無効にすることをお勧めします。

　また、WordPressでは、パーマリンクを変更した場合に古いスラッグがデータベース上に記録され古いパーマリンクによるURLでアクセスしても新しいパーマリンクへリダイレクトされます。これも意図しない結果となる可能性があるので無効にするのがおすすめです。

非公開記事の非表示

// 非公開の記事を管理者ログイン状態でも非表示にする。
function my_pre_get_posts_1($query) {
    // 非管理画面かつ非プレビュー画面かつメインループの場合に・・・。
    if (!is_admin() && !is_preview() && $query->is_main_query())
        // クエリを公開状態に限定する。
        $query->set('post_status', 'publish');
}
add_action('pre_get_posts', 'my_pre_get_posts_1');

　記事の編集画面で「表示状態」を「非公開」にした記事が、管理者でログインした状態で表示したブログの記事一覧画面に表示されないようにするためのコードです(個人的な趣味です)。

特殊文字変換の無効化

// 記事のタイトルの特殊文字変換を無効にする。
remove_filter('the_title', 'wptexturize');
// 記事の本文の特殊文字変換を無効にする。
remove_filter('the_content', 'wptexturize');
// 記事の抜粋の特殊文字変換を無効にする。
remove_filter('the_excerpt', 'wptexturize');
// 記事のコメントの特殊文字変換を無効にする。
remove_filter('comment_text', 'wptexturize');

　記事のタイトルや本文や抜粋やコメント内にある「"」や「'」を勝手に全角に変換されないようにするためのコードです。これがないと、半角の「"」や「'」が全角の「”」や「’」に勝手に変換されてしまいます。技術系のブログなどでソースコードを紹介する場合には必須の設定です。

サイトヘルス警告の非表示

// WordPressのサイトヘルスで「永続オブジェクトキャッシュを使用してください」と表示されるのを止める。
add_filter('site_status_should_suggest_persistent_object_cache', '__return_false');
// WordPressのサイトヘルスで「ページキャッシュは検出されませんでしたが、サーバーのレスポンスは良好です」と表示されるのを止める。
add_filter('site_status_page_cache_supported_cache_headers', '__return_false');

　WordPressのバージョンが6になってから管理者画面のサイトヘルスステータスに「永続オブジェクトキャッシュを使用してください」や「ページキャッシュは検出されませんでしたが、サーバーのレスポンスは良好です」が表示されるようになってしまいました。うざいので表示しないように設定しました。サーバ側のキャッシュはちゃんと効いているはずなので。

記事一覧ページ等のソート順の変更

// 各管理画面のソート順を調整する。
function my_pre_get_posts_2($query) {
    // 記事一覧画面とメディア一覧画面の場合・・・。
    if (in_array($query->get('post_type'), array('post', 'attachment'))) {
        // 名前の・・・
        if($query->get('orderby') === '')
            $query->set('orderby', 'name');
        // 昇順でソートする。
        if($query->get('order') === '')
            $query->set('order', 'asc');
    }
    // 固定ページ一覧画面と再利用ブロック一覧画面の場合・・・。
    if (in_array($query->get('post_type'), array('page', 'wp_block'))) {
        // タイトルの・・・
        if($query->get('orderby') === '')
            $query->set('orderby', 'title');
        // 昇順でソートする。
        if($query->get('order') === '')
            $query->set('order', 'asc');
    }
}
add_action('pre_get_posts', 'my_pre_get_posts_2');

　管理者画面において、記事一覧画面とメディア一覧画面のソート順を「名前の昇順」に、固定ページ一覧画面と再利用ブロック一覧画面のソート順を「タイトルの昇順」に変更するためのコードです。「asc」を「desc」に変更するとソート順を降順にすることができます。

Contact Form 7とreCAPTCHAの無効化

// JavaScriptの読み込みを調整する。
function my_wp_dequeue_scripts() {
    // お問い合わせページ以外でContact Form 7を無効にする。
    if (!is_page(array('contact'))) {
        wp_dequeue_script('contact-form-7');
    }
    // お問い合わせページ以外でreCAPTCHAを無効にする。
    if (!is_page(array('contact'))) {
        wp_dequeue_script('wpcf7-recaptcha');
    }
}
add_action('wp_enqueue_scripts', 'my_wp_dequeue_scripts', 99999);

　Lighthouse対策です。お問い合わせページ(スラッグは「contact」)以外でプラグイン「Contact Form 7」と「reCAPTCHA」の機能を無効化するコードです。各記事のコメント欄のスパム対策はプラグイン「SiteGuard WP Plugin」で行っているのでreCAPTCHAは不要との判断です。

// StyleSheetの読み込みを調整する。
function my_wp_dequeue_styles() {
    // お問い合わせページ以外でContact Form 7を無効にする。
    if (!is_page(array('contact'))) {
        wp_dequeue_style('contact-form-7');
    }
}
add_action('wp_enqueue_scripts', 'my_wp_dequeue_styles', 99999);

　JavaScriptと同様StyleSheetも無効にします。

FancyBoxのJavaScriptの非同期化

// JavaScriptを非同期で読み込む。
function my_script_loader_tag($tag, $handle, $src) {
    // いくつかのJavaScriptを非同期で読み込む。
    if (in_array($handle, array('jquery-fancybox', 'jquery-easing', 'enlighterjs', 'mathjax'))) {
        // HTMLをDOMにロードする。
        $doc = my_load_html_helper($tag);
        // <script>にdefer属性を付加する。
        $doc->getElementsByTagName('script')->item(0)->setAttribute('defer', '');
        // DOMをHTMLにセーブする。
        $tag = my_save_html_helper($doc);
    }
    return $tag;
}
add_filter('script_loader_tag', 'my_script_loader_tag', 10, 3);

　Lighthouse対策です。FancyBox関係のJavaScriptのロードタイミングをdeferにするためのコードです。Lighthouseでページを測定したときにFancyBoxのJavaScriptがページの読み込みをブロックしていると指摘されてしまったことに対する措置です。このコードを使うには、以下の2つのヘルパー関数が必要です。<script>タグにdefer属性を追加するだけでDOMを使うのは少し大袈裟かもしれません。

// HTMLをDOMにロードする。
function my_load_html_helper($html) {
    // HTMLの文字コードをUTF-8からHTML-ENTITIESに変換する。
    $html = str_replace('&', '&amp;', $html);
    $html = mb_convert_encoding($html, 'HTML-ENTITIES', 'UTF-8');
    // HTMLをDOMにロードする。
    // ロード時に<HTML>や<BODY>や<!DOCTYPE>が追加されないようにする。
    // その代わり一時的に<div></div>でラップする必要あり。
    $doc = new DOMDocument();
    @$doc->loadHTML("<div>$html</div>", LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);
    // ラップした<div></div>をはがす。
    $cont = $doc->getElementsByTagName('div')->item(0);
    while ($doc->firstChild) {
        $doc->removeChild($doc->firstChild);
    }
    while ($cont->firstChild) {
        $doc->appendChild($cont->firstChild);
    }
    return $doc;
}

// DOMをHTMLにセーブする。
function my_save_html_helper($doc) {
    // DOMをHTMLにセーブする。
    $html = $doc->saveHTML();
    // HTMLの文字コードをHTML-ENTITIESからUTF-8に変換する。
    $html = mb_convert_encoding($html, 'UTF-8', 'HTML-ENTITIES');
    return $html;
}

FancyBoxのStyleSheetの非同期化

// StyleSheetを非同期で読み込む。
function my_style_loader_tag($tag, $handle, $href, $media) {
    // いくつかのStyleSheetを非同期で読み込む。
    if (in_array($handle, array('fancybox', 'enlighterjs'))) {
        // HTMLをDOMにロードする。
        $doc = my_load_html_helper($tag);
        // media属性をprintとしておき・・・
        $doc->getElementsByTagName('link')->item(0)->setAttribute('media', 'print');
        // ロード後に本来のmedia値に切り替える。
        $doc->getElementsByTagName('link')->item(0)->setAttribute('onload', htmlspecialchars("this.media='{$media}'"));
        // DOMをHTMLにセーブする。
        $tag = my_save_html_helper($doc);
    }
    return $tag;
}
add_filter('style_loader_tag', 'my_style_loader_tag', 10, 4);

　Lighthouse対策です。FancyBox関係のStyleSheetの適用をページのロード後にするためのコードです。Lighthouseでページを測定したときにFancyBoxのStyleSheetがページの読み込みをブロックしていると指摘されてしまったことに対する措置です。

メンテナンスモード

// ただいまメンテナンス中です・・・。
// function maintenance_mode() {
//     if (!current_user_can('manage_options')) {
//         wp_die('ただいまメンテナンス中です・・・。');
//     }
// }
// add_action('get_header', 'maintenance_mode');

　2行目以降のコメントを外すとサイトのどのページにアクセスしてもエラーメッセージ「ただいまメンテナンス中です・・・。」が表示されるようにするためのコードです。サイトに対してなにか大掛かりな改修を行う場合を想定し、普段からこのコードをコメントアウトした状態で追加してあります。

footer.php編

JavaScriptとStyleSheetの一覧

<!-- <?php
// 管理者としてログインしている場合にScriptとStyleの一覧を表示する。
if (is_user_logged_in() && current_user_can('manage_options')) {
    my_print_scripts_and_styles('Scripts', wp_scripts());
    my_print_scripts_and_styles('Styles', wp_styles());
}

// ScriptとStyleの一覧を表示する。
function my_print_scripts_and_styles($title, $resources) {
    echo '<p style="margin:10px 0 5px 0;padding:0;">*** ' . $title . ' ***</p>';
    echo '<ol style="margin:0;padding:0 0 0 30px;">';
    foreach ($resources->queue as $handle)
        my_print_scripts_and_styles_helper($resources->registered[$handle]);
    echo '</ol>';
}

// ScriptとStyleの一覧を表示するヘルパー関数。
function my_print_scripts_and_styles_helper($registered) {
    $li = '<li style="list-style-type:decimal;">';
    $li .= 'handle: ' . $registered->handle . '<br>';
    $li .= 'src: ' . $registered->src . '<br>';
    $li .= 'deps: ' . implode(", ", $registered->deps) . '<br>';
    $li .= 'args: '. $registered->args . '<br>';
    $li .= 'before: ' . (isset($registered->extra['before']) ? 'exists' : 'not exists') . '<br>';
    $li .= 'after: ' . (isset($registered->extra['after']) ? 'exists' : 'not exists') . '<br>';
    $li .= '</li>';
    echo $li;
}
?> -->

　管理者でログインしている場合に登録されているJavaScriptとStyleSheetのハンドル名などを一覧するコードです。必要なときにコメントを外すことでJavaScriptとStyleSheetのハンドル名をフッターに一覧表示することができます。JavaScriptやStyleSheetごとになにかカスタマイズ処理を行うときにハンドル名が必要になるので重宝すると思います。

　以上、「WordPressのカスタマイズ13選」でした。

この記事を書いた人

プロフィール

　その日暮らし

　こんにちは、その日暮らしです/地方国立大理系院卒→大手大企業就職→ソフト開発二十年超→メンタル壊して退職→ちょっと回復→資格取得頑張る(簿記3級と応用情報は合格でデスペはギブアップ)→コロナ禍で再就職無理→離婚orz→実家へ出戻ってこどおじ化(笑)→WordPressの勉強のためブログに挑戦/そんな訳でブログは始めたばかりですが日々いろんなことを試して得た知識を投稿していこうと思ってます/以上

CustomizationWordPress

Posted by その日暮らし