メール通知で電話番号をリンクにする方法

はじめに

フォームで収集した電話番号をメール通知内のリンクにしたいですか?デフォルトでは、メール通知で送られてきた電話番号はクリックして電話をかけることができませんが、小さなPHPスニペットで簡単に変更することができます。 このチュートリアルでは、フォームと通知の設定方法を説明します。

フォームの作成

このチュートリアルでは、Name、Email、Phone、Paragraph Textのフォームフィールドを持つフォームを作成します。

フォームの作成にヘルプが必要な場合は、こちらのドキュメントをご覧ください。

電話番号をリンクにするコードの追加

次に、Eメール通知を表示する際に、電話番号フィールドをリンクに変えるコードのスニペットを追加します。

スニペットをサイトに追加する方法については、こちらのチュートリアルをご覧ください。

/**
 * Make phone numbers a link inside email notifications
 *
 * @link https://wpforms.com/developers/how-to-make-phone-numbers-a-link-in-email-notifications/
 */

function wpf_dev_html_field_value( $value, $field, $form_data, $context = '' ) {

    // Limit this customization to telephone fields.
    if ( ! empty( $field[ 'value' ] ) && 'phone' === $field[ 'type' ] ) {

        $phone_number = sanitize_text_field( $field[ 'value' ] );

        // Make the phone number field a link in the notification
        if ( ! empty( $phone_number ) ) {

            return '<a href="tel:' . $phone_number . '" target="_blank">' . $phone_number . '</a>';
        }

    }

    return $value;

}
add_filter( 'wpforms_html_field_value', 'wpf_dev_html_field_value', 10, 4 );

このスニペットを見てみましょう。スニペットの最初の部分では、電話フォームのフィールドだけを探します。これにより、すべてのフィールドでスニペットを実行する必要がなくなります。

スニペットの2番目の部分は、電話フィールドが見つかると、フォームに入力された番号を受け取り、通知内でクリック可能なリンクに変えます。

これでフォームが完了すると、電話番号がEメール通知のリンクとして表示されます。

この特定のフィールドでさらに検証を行いたいですか？電話番号フィールドのバリデーションを追加する方法についてのチュートリアルをご覧ください。

関連

フィルタ参照:wpforms_html_field_value