ガジェット通信

見たことのないものを見に行こう

WordPressのContact Form 7プラグインで独自のショートコードを呼ぶ方法

DATE:
  • ガジェット通信を≫

こんにちは、エンジニアの段田です。

世間的にはもうシーズン・イン・ザ・サンですね。
自分の中では夏を待ちきれなくて、情熱が花火のようで、夏だねって感じたら、きっと、どこかでひまわりを見ちゃうんじゃないかと思ってました。
こんなSUMMER DREAMはセンチメンタルに首ったけで僕も恋してムーチョしそうです。あー夏休みまでもう少し! Only You 君と夏の日を過ごすのが待ち遠しいですね。

じゃあ、話を進めます。(飽きた)

今回はWordPressのメールフォームプラグイン「Contact Form 7」で、自作のショートコードを呼ぶ方法についてです。

Contact Form 7とは?

https://ja.wordpress.org/plugins/contact-form-7/

WordPressでメールフォームを設置できるプラグインです。
公式サイトはこちらから。

 

編集画面はこのようになっていて、HTMLとContact Form 7で用意されているショートコードを書くことによりメールフォームを作成できます。
 

実際に画面表示させるとこんな感じで表示されます。
簡単! 便利!

自分で作ったショートコードを埋め込む

ここで本題です。Contact Form 7でテーマ内の画像を呼び出す必要があり、ショートコードで対応しようとしました。

/**
* テーマ内の画像を呼び出します。
*/
function the_required_image(){
return ‘<img src="’.get_stylesheet_directory_uri().’/images/required.png" alt="必須" width="40" height="20"/>';
}
add_shortcode("required_image","the_required_image");

こんなかんじでWordPressで用意されているadd_shortcode関数を使って、ショートコードを登録しました。
 

が、ショートコードは実行されずタグのまま表示されました・・・。

/(^o^)\ナンテコッタイ

でもご安心を。
Contact Form 7プラグインではプラグイン内で実行できるショートコード登録関数があります。それがwpcf7_add_shortcode関数です。
 

/**
* テーマ内の画像を呼び出します。
*/
function the_required_image(){
return ‘<img src="’.get_stylesheet_directory_uri().’/images/required.png" alt="必須" width="40" height="20"/>';
}
wpcf7_add_shortcode("required_image","the_required_image");

このように呼び出しをwpcf7_add_shortcodeに変更すると・・・
 

ショートコードが実行され、画像表示されるようになりました!

最後に

今回はテーマ内の画像を呼び出すだけでしたが、カスタマイズが必要な場合は柔軟に対応ができそうです。

他にもプラグイン内でフィルターが用意されているので、別の機会があれば紹介したいと思います。

ではでは・・・。

カテゴリー : 生活・趣味 タグ :
LIGの記事一覧をみる ▶
  • 誤字を発見した方はこちらからご連絡ください。
  • ガジェット通信編集部への情報提供はこちらから
  • 記事内の筆者見解は明示のない限りガジェット通信を代表するものではありません。