フリーランス|WEB 制作経験丸7年、制作会社様からのご依頼に丁寧・高クオリティでお手伝いいたします。 IRODORI DESIGN

B L O G

【Contact Form 7】自作ショートコードを使用する方法

Contact Form 7
wcpf7_add_shortcode
WordPress
wpcf7_add_form_tag
ショートコード

こんにちは、岐阜・名古屋を拠点に全国各地からご依頼いただくWEBサイトを制作しているフリーランスエンジニアの寺井です。

WordPressでお問い合わせフォームを作成する際に使用する人気プラグインの「Contact Form 7」。
今回の記事ではこのプラグイン内のエディタで自作ショートコードを使用する方法をご紹介します。

WordPressの投稿エディタで自作ショートコードを使用する方法は以下の記事で紹介しています。

wpcf7_add_form_tagを使用する

「Contact Form 7」のエディタ内で自作ショートコードを使用する場合、WordPressのadd_shortcodeでは正しく動作しません。
そのため、「Contact Form 7」で自作ショートコードを使用する場合は、このプラグインに用意されているwpcf7_add_form_tagを使用します。

wpcf7_add_form_tagを使用する場合、引数は2つ指定します。

wpcf7_add_form_tag( 'ショートコード名', '自作関数名' );

それでは続いて具体的な使用例を交えてwpcf7_add_form_tag見ていきましょう。

使用テーマまでのディレクトリを出力する

使用しているテーマまでのディレクトリを出力する場合はfunctions.phpに以下のように記述します。

<?php
function my_wpcf7_get_theme_dir() {
    return get_template_directory_uri();
}
wpcf7_add_form_tag( 'theme_dir', 'my_wpcf7_get_theme_dir' );
?>

そして「Contact Form 7」のエディタ内で以下のようにショートコードを記述します。

<img src="[theme_dir]/images/logo.jpg">

このように記述することで直接エディタ内にURLを記述することなく動的にテーマまでのディレクトリURLを出力することが出来ます。

サイトのホームURLを出力する

サイトのホームURLを出力する場合はfunctions.phpに以下のように記述します。

<?php
function my_wpcf7_get_home_url() {
    return home_url();
}
wpcf7_add_form_tag( 'home_url', 'my_wpcf7_get_home_url' );
?>

そして「Contact Form 7」のエディタ内で以下のようにショートコードを記述します。

<a href="[home_url]/privacy">個人情報保護方針はこちら</a>

このように記述することで直接エディタ内にURLを記述することなく動的にホームのURLを出力することが出来ます。

wcpf7_add_shortcodeとの違いは?

「Contact Form 7」で独自ショートコードを使用する方法としてよく紹介されているwcpf7_add_shortcode
このフックを使うことでも同じことが出来ますが、wcpf7_add_shortcodeは非推奨となっています。
そのため現在は使用することが出来ても、将来的には使用できなくなってしまう恐れがあるので、wpcf7_add_form_tagを使用するようにしましょう。

また、wcpf7_add_shortcodeの中身を見てみると

function wpcf7_add_shortcode( $tag, $callback, $has_name = false ) {
    wpcf7_deprecated_function( __FUNCTION__, '4.6', 'wpcf7_add_form_tag' );

    return wpcf7_add_form_tag( $tag, $callback, $has_name );
}

このようになっていて、内部ではwpcf7_add_form_tagを呼び出しているのがわかりますね。
つまりwpcf7_add_shortcodeを使ってもwpcf7_add_form_tagを使っているのと同じことなんです。

まとめ

wpcf7_add_form_tagを使用することで応用次第では、記事を出力したり、様々なことが出来るようになりカスタマイズの幅は広がります。
以上、「Contact Form 7」で自作ショートコードを使用する方法のご紹介でした。