静的htmlでContact Form 7を使用する

公開日: : 最終更新日:2020/09/01 wordpress

ワードプレスのロゴ

ショートコード設置まで

.htaccessの内容変更や、htmlソースの最上部(doctype宣言よりも上)に

<?php require('./xxxx/wp-load.php'); ?>
Markup

を記述する等、htmlでphpが動くようにしておきます。

wp_headとwp_footerを下記のように記述します。

<head><?php wp_head(); ?></head>
Markup
<body><?php wp_footer(); ?>
</body>
Markup

任意の場所にContact Form 7のショートコードを読み込みます。

<?php echo do_shortcode( '[Contact Form 7のショートコード]' ); ?>

参考(丸コピすんません

 

現在選択中のテーマから継承されたcssなど余計なモノ消す

CSS

参考 noteの記事

 

functions.phpに書かなくても、静的html側に書けば良い。

functions.phpでやっちゃうと、そのテーマ使うときにスタイルが崩れちゃうから。。

 

macのSafariでカレンダーが表示されないバグ修正

functions.phpに以下のコードを追記する。

上記は、もしかしたら

iPhoneXで日付のフォームが表示されない

事象も解決されるかも。

 

「メールアドレス」と「確認用メールアドレス」が合ってるかのチェック

テーマのfunctions.phpに以下を記述。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
add_filter( 'wpcf7_validate_email', 'wpcf7_validate_email_filter_extend', 11, 2 );
add_filter( 'wpcf7_validate_email*', 'wpcf7_validate_email_filter_extend', 11, 2 );
function wpcf7_validate_email_filter_extend( $result, $tag ) {
    $type = $tag['type'];
    $name = $tag['name'];
    $_POST[$name] = trim( strtr( (string) $_POST[$name], "n", " " ) );
    if ( 'email' == $type || 'email*' == $type ) {
        if (preg_match('/(.*)_confirm$/', $name, $matches)){ //確認用メルアド入力フォーム名を ○○○_confirm としています。
            $target_name = $matches[1];
            if ($_POST[$name] != $_POST[$target_name]) {
                if (method_exists($result, 'invalidate')) {
                    $result->invalidate( $tag,"確認用のメールアドレスが一致していません");
                } else {
                    $result['valid'] = false;
                    $result['reason'][$name] = '確認用のメールアドレスが一致していません';
                }
            }
        }
    }
    return $result;
}

 

で、Contact Form 7側の登録ページで

1
2
3
4
5
6
7
8
<tr>
<th>メールアドレス <span class="required">必須</span></th>
<td>[email* your-email]</td>
</tr>
<tr>
<th>メールアドレス確認 <span class="required">必須</span></th>
<td>[email* your-email_confirm placeholder "確認のためもう一度入力してください"]</td>
</tr>

参考(ありがとうございました!

Googleアドセンスレスポンシブ

関連記事

ワードプレスのロゴ

WordPress if ( ! defined( ‘ABSPATH’ ) ) exit;は、wp-config.phpまでのPATH

wp-config.phpの下部に記述されてる。 /** Absolute path to t

記事を読む

ワードプレスのロゴ

WordPressでコピーサイトを作った際に、コピー元のサイトにリダイレクトされる原因

WordPress アドレス (URL) や、 サイトアドレス (URL) がコピー元のサイトの

記事を読む

ワードプレスのロゴ

WooCommerceの「お客様」データ削除手順

「お客様」メニュー WooCommerceの昔のバージョンだと無いメニューだったんだけど、

記事を読む

ワードプレスのロゴ

WordPress 固定ページでfunction(関数)使うにはショートコードを使う

ショートコードって? 固定ページなどで みたいに書くと、設定した関数等を呼び出してくれる

記事を読む

codepen

CodePen で jQuery設定

html、css、Javascriptのコードを書いたら画面半分に動作結果を表示してくれて、しか

記事を読む

ワードプレスのロゴ

XSERVER WordPress簡単移行 の後にやったほうがいい3つのこと

1.パーマリンクの更新 事象1 XSERVERのWordPress簡単移行使って、他のWor

記事を読む

ワードプレスのロゴ

WordPress Search and Replace Database で 出力されるメッセージ

  WordPressの引っ越し時にドメイン部分を変更する場合、データベースの中のド

記事を読む

ワードプレスのロゴ

WooCommerceでログイン後にダッシュボードじゃないページにリダイレクト(遷移)するやり方

やり方が載ってるサイトのリンク すんげー困ってたけど、 こちらの海外のサイトに書いてることし

記事を読む

ワードプレスのロゴ

wordpress で wp_dequeue_scriptやwp_dequeue_styleしてテーマのcssやjsを読み込まない

テーマが読み込んでるcssやjsを調査 functions.phpに以下を追記する。htmlの

記事を読む

ワードプレスのロゴ

WordPress ファイルはサブディレクトリ、公開URLはTOP「/」にするやり方

概要 たとえば、以下の様な状態のこと。 wordpress(以下wp)のファイルを配置

記事を読む

Googleアドセンスレスポンシブ

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

PAGE TOP ↑