WordPress のカスタマイズを行う際、head タグ内や body タグの直前にコードを挿入することがよくあります。これにより、ページの見た目や動作を調整するためのスクリプトやスタイルシートを追加できます。本記事では、これらの位置にコードを挿入するための主要な方法をご紹介します。
wp_head アクションフックを使って head 内にコードを挿入する
wp_head アクションフックを使用すると、テーマの head タグ内にコードを追加できます。主に、CSS や JavaScript のリンクを追加するのに便利です。
テーマの functions.php ファイルを開き、次のコードを追加します。
function my_custom_code_in_head() {
?>
<!-- ここに挿入したいコードを追加 -->
<script src="https://example.com/script.js"></script>
<link rel="stylesheet" href="https://example.com/styles.css">
<?php
}
add_action('wp_head', 'my_custom_code_in_head');このコードは、head タグ内の適切な位置に JavaScript や CSS のリンクを挿入します。
wp_footer アクションフックを使って body タグの直前にコードを挿入する
wp_footer アクションフックを利用すると、body タグの閉じタグの直前にコードを追加できます。主に、トラッキングコードや追加の JavaScript を挿入するのに使用されます。
テーマの functions.php ファイルを開き、次のコードを追加します。
function my_custom_code_before_closing_body() {
?>
<!-- ここに挿入したいコードを追加 -->
<script src="https://example.com/footer-script.js"></script>
<?php
}
add_action('wp_footer', 'my_custom_code_before_closing_body');このコードは、body タグの閉じタグの直前にスクリプトを追加します。
カスタムプラグインを使用する
テーマの変更を避けたい場合や、複数のサイトで同じ変更を適用したい場合は、カスタムプラグインを作成してコードを挿入するのも良い方法です。
wp-content/plugins フォルダーに新しいフォルダーを作成し、その中に PHP ファイルを作成します。
<?php
/*
Plugin Name: Custom Code Inserter
Description: Insert custom code into head and footer.
Version: 1.0
*/
function my_custom_code_in_head() {
?>
<!-- ここに挿入したいコードを追加 -->
<script src="https://example.com/script.js"></script>
<?php
}
add_action('wp_head', 'my_custom_code_in_head');
function my_custom_code_before_closing_body() {
?>
<!-- ここに挿入したいコードを追加 -->
<script src="https://example.com/footer-script.js"></script>
<?php
}
add_action('wp_footer', 'my_custom_code_before_closing_body');WordPress 管理画面の「プラグイン」セクションで新しいプラグインを有効化します。
カスタムプラグインを使用すると、テーマの更新に影響されることなく、コードの挿入が可能です。
まとめ
WordPress で head 内や body タグ直前にコードを挿入するための方法には、wp_head および wp_footer アクションフックを使用する方法と、カスタムプラグインを作成する方法があります。これらの方法を活用することで、ページのカスタマイズや機能追加がスムーズに行えます。目的に応じて適切な方法を選んで、効果的なカスタマイズを行ってください。
