静的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の自動バージョンアップは マイナーバージョン(3桁目)のみ行われる

  x.y.zの場合、自動アップデートされるのはzのバージョンだけという認識で合

記事を読む

ワードプレスのロゴ

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

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

記事を読む

ワードプレスのロゴ

WordPressのプラグイン翻訳(日本語化)

日本語化されてないpluginとか。意外と翻訳されてたりする(完璧じゃないにしろ) リンク

記事を読む

ワードプレスのロゴ

WordPressでイメージファイルが読み込めないのはBasic認証がかかってるからかも。あとhttpsし忘れ(コレ大事)

事象 WordPressで作成したサイトを、見る環境によって表示されたりされなかったりする。

記事を読む

ワードプレスのロゴ

サイトヘルスで「バックグランド更新が想定通りに動作していません」と表示される原因のひとつ

  結論 僕の場合は、Basic認証をかけている為でした。  

記事を読む

ワードプレスのロゴ

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

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

記事を読む

ワードプレスのロゴ

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

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

記事を読む

no image

WordPress を IIS環境へ引っ越しする手順 – コンテンツインポート編

WordPress を IIS環境へ引っ越しする手順 – 環境構築編 と、 Word

記事を読む

no image

WordPressに大量にたまったスパムコメントをプラグインなしで消す

MySQLのコマンドで実施 DELETE FROM wp_comments WHERE c

記事を読む

ワードプレスのロゴ

WP Mail SMTP で XSERVERのメール使うときの設定

  Auto TLS をオフにするのを忘れがち。 上図はオフにした図。デフォル

記事を読む

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

Message

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

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

PAGE TOP ↑