見出し画像

【解決】Contact Form 7 に画像を入れたい!

普段WordPressでお問い合わせを作る時にContact Form 7を使用しているのですが、今回初めて説明用のイメージ画像をつけることになしました(言い出しっぺ)

素直に<img>タグを使用し相対パスで書くも、もちろん表示されず。。。

1時間くらいいろいろ記事を読み漁り、答えにたどりついたので書き残します。
同じ悩みを持つ人の助けになればいいな…

ステップ1:functions.phpにショートコードを使用するコードを書く

function contact_images_url() {
	return get_stylesheet_directory_uri();
}
wpcf7_add_form_tag( 'indicate_images_url', 'contact_images_url' );

今回子テーマを作成していたので、returnの部分はget_stylesheet_directory_uriを記述しています。
get_theme_file_uriが使えればいいなと思ったのですが、いろいろと断念…)

↓参考にしたのはこちらの記事

しかし、かなり昔の記事だったため、Contact Form 7が非推奨のタグ(wpcf7_add_shortcode)を使用していたので要注意。(画面に怒られちゃった…

今回はwpcf7_add_form_tagを使用しています。

ステップ2:Contact Form 7の管理画面で画像パスを書く

コンタクトフォームの編集画面の画像を出したい場所に下記のコードを書きます。

<img src="[indicate_images_url]/assets/images/sample-image.png" width="" height="" alt="">

これでフォーム内に画像が表示できます。

添付画像のイメージなどを載せたい時に使えますよ〜!

この記事が気に入ったらサポートをしてみませんか?