レンちゃんとペンタ

WordPressの<head>内の不要な要素をスッキリ削除する(ついでに<footer>も)

WordPressの<head>内の不要な要素をスッキリ削除する(ついでに<footer>も)

WordPressのhead要素内に、自分で書いた覚えのない不要なコードがたくさん追加されていることがあります。
これは、テーマ内で使用されているwp_head()の仕業です。
そうした記述をなくして、コードをキレイにするためのショートコードを集めてみました。

この記事で分かること

  • WordPressのheadタグ内の不要な要素をスッキリ削除するコード
  • WordPressのfooterタグ内の不要な要素をスッキリ削除するコード

    Webデザインとブログで豊かに引きこもる。

    レンちゃんとペンタ

    Webデザインは器。ブログは中身。
    「レンちゃんとペンタ」では、2つのスキルを掛け合わせて、
    おウチで豊かに楽しく暮らす方法をご紹介しています。

    WordPressのバージョン情報を消す

    head要素内の以下の記述が対象です。(X.X.Xには使用しているWordPressのバージョンが入ります)

    <!-- 削除したい要素 -->
    <meta name="generator" content="WordPress X.X.X" />

    使用しているテーマのfunctions.phpに以下を記述すると、消すことができます。

    // functions.phpに追加するコード
    remove_action('wp_head', 'wp_generator');

    WordPressのEmbed対応を消す

    以下の記述が対象です。

    <!-- 削除したい要素 -->
    <link rel="https://api.w.org/" href="http://XXX/wp-json/" />
    <link rel="alternate" type="application/json" href="http://XXX/wp-json/wp/v2/pages/1" />

    functions.phpに以下を記述すると、消すことができます。

    // functions.phpに追加するコード
    remove_action('wp_head','rest_output_link_wp_head');

    絵文字に関する対応を消す

    以下のような記述が対象です。長いので、一部は端折ってあります。

    <!-- 削除したい要素 -->
    <script type="text/javascript">window._wpemojiSettings = (途中省略)</script>
    <style type="text/css">
    img.wp-smiley,
    img.emoji {
      display: inline !important;
      border: none !important;
      box-shadow: none !important;
      height: 1em !important;
      width: 1em !important;
      margin: 0 .07em !important;
      vertical-align: -0.1em !important;
      background: none !important;
      padding: 0 !important;
    }
    </style>

    functions.phpに以下を記述すると、消すことができます。

    // functions.phpに追加するコード
    remove_action('wp_head', 'print_emoji_detection_script', 7);
    remove_action('wp_print_styles', 'print_emoji_styles');

    Really Simple Discoveryを消す

    以下の記述が対象です。
    こちらは、WordPress外部のサービス(ブログ投稿ツール等)を使用する際、同サービスがWordPress内の情報を取得するために必要な記述です。

    <!-- 削除したい要素 -->
    <link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://XXX/xmlrpc.php?rsd" />

    不要な場合には、functions.phpに以下を記述して消すことができます。

    // functions.phpに追加するコード
    remove_action('wp_head', 'rsd_link');

    Windows Live Writerを消す

    以下の記述が対象です。
    これは、Windows Live Writerを使用している場合、マニフェストファイルへのリンクを生成する記述です。

    <!-- 削除したい要素 -->
    <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://XXX/wp-includes/wlwmanifest.xml" />

    不要な場合には、functions.phpに以下を記述して消すことができます。

    // functions.phpに追加するコード
    remove_action('wp_head', 'wlwmanifest_link');

    WordPress同梱のjQueryを消す

    以下の記述が対象です。コード内の「X.X.X」にはjQueryのバージョンが入ります。

    <!-- 削除したい要素 -->
    <script type='text/javascript' src='https://XXX/wp-includes/js/jquery/jquery.min.js?ver=X.X.X' id='jquery-core-js'></script>
    <script type='text/javascript' src='https://XXX/wp-includes/js/jquery/jquery-migrate.min.js?ver=X.X.X' id='jquery-migrate-js'></script>

    jQueryが不要、もしくは自分でjQueryを用意している場合には不要な記述かもしれません。
    functions.phpに以下を記述して消すことができます。

    // functions.phpに追加するコード
    function new_deregister_script() {
      if (!is_admin()) {
        wp_deregister_script('jquery');
      }
    }
    add_action('init', 'new_deregister_script');

    ブロックエディター用のCSSを消す

    以下の記述が対象です。コード内の「XXX」には設定されているドメインが、「X.X.X」にはバージョン入ります。

    <!-- 削除したい要素 -->
    <link rel='stylesheet' id='wp-block-library-css'  href='https://XXX/block-library/style.min.css?ver=X.X.X' type='text/css' media='all' />

    こちらも、自作テーマを使っている場合などは、不要なCSSかもしれません。
    functions.phpに以下を記述すると、消すことができます。

    // functions.phpに追加するコード
    function remove_block_library() {
      wp_dequeue_style('wp-block-library');
    }
    add_action( 'wp_enqueue_scripts', 'remove_block_library');

    おまけ:フッター側もスッキリと

    ちなみにget_footer()を使用している場合、footer要素にこのような記述が追加されます。

    <!-- 削除したい要素 -->
    <script type='text/javascript' src='https://XXX/wp-includes/js/wp-embed.min.js?ver=X.X.X' id='wp-embed-js'></script>

    こちらも、functions.phpに以下を記述すると消すことができます。

    // functions.phpに追加するコード
    function register_javascript() {
      wp_deregister_script('wp-embed');
    }
    add_action('wp_enqueue_scripts', 'register_javascript');

    まとめ

    紹介したコードをまとめるとこんな感じです。

    // バージョン情報
    remove_action('wp_head', 'wp_generator');
    
    // Embed対応
    remove_action('wp_head','rest_output_link_wp_head');
    
    // 絵文字表示用
    remove_action('wp_head', 'print_emoji_detection_script', 7);
    remove_action('wp_print_styles', 'print_emoji_styles');
    
    // Really Simple Discovery
    remove_action('wp_head', 'rsd_link');
    
    // Windows Live Writer
    remove_action('wp_head', 'wlwmanifest_link');
    
    // WordPress同梱のjQuery
    function new_deregister_script() {
      if (!is_admin()) {
        wp_deregister_script('jquery');
      }
    }
    add_action('init', 'new_deregister_script');
    
    // ブロックエディター用CSS
    function remove_block_library() {
      wp_dequeue_style('wp-block-library');
    }
    add_action( 'wp_enqueue_scripts', 'remove_block_library');

    みなさんのWordPressが、キレイなコードになりますように。

    1. Home
    2. WordPressの<head>内の不要な要素をスッキリ削除する(ついでに<footer>も)

    Related Posts