时间戳

首页 > 解决方案 > 在 WooCommerce 注册表单中添加第二个复选框

wordpress - 在 WooCommerce 注册表单中添加第二个复选框

问题描述

如何在 WooCommerce 用户的注册表单中添加第二个复选框？

在 WooCommerce 的“我的帐户”页面上，您可以选择登录或注册（这就是我需要帮助的地方）。

我已经建立了一个复选框来接受隐私政策（就在用户、电子邮件和密码框的下方）。

这是我通过这篇文章实现的钩子

add_action( 'woocommerce_register_form', function () {
  
  woocommerce_form_field( 'politica_privacidad_registro', array(
      'type'          => 'checkbox',
      'class'         => array('form-row rgpd'),
      'label_class'   => array('woocommerce-form__label woocommerce-form__label-for-checkbox checkbox'),
      'input_class'   => array('woocommerce-form__input woocommerce-form__input-checkbox input-checkbox'),
      'required'      => true,
      'label'         => 'He leído y acepto la política de privacidad',
      )); 
}, 10);

add_filter( 'woocommerce_registration_errors', function ( $errores, $usuario, $email ) {
    if ( ! (int) isset( $_POST['politica_privacidad_registro'] ) ) {
        $errores->add( 'politica_privacidad_registro_error', 'Tienes que aceptar nuestra política de privacidad' );
    }
return $errores;
}, 10, 3);

但我需要另一个复选框，以便他们接受网络上的另一个必要要求（年龄验证）。当然，用于注册的强制性年龄验证复选框将伴随着一个小短语。

我曾尝试在 中使用一些钩子functions.php，但碰巧如果您接受隐私复选框，即使您不接受第二个强制性复选框，您也可以注册。

这是最适合我这篇文章所需的代码

// To add the form
function add_age_verification() {
    ?>

    <p class="form-row form-row-first">
    <label for="reg_age_verification" class="woocommerce-form__label woocommerce-form__label-for-checkbox"><?php _e( 'age verification', 'woocommerce' ); ?> <span class="required">*</span></label>
    <input type="checkbox" class="woocommerce-form__input woocommerce-form__input-checkbox" name="age_verification" id="reg_age_verification" value="<?php if ( ! empty( $_POST['age_verification'] ) ) esc_attr_e( $_POST['age_verification'] ); ?>" />
    </p>

    <div class="clear"></div>

    <?php
}
  // to validate the form
function validate_age_verification( $errors, $username, $email ) {
    if ( isset( $_POST['age_verification'] ) && empty( $_POST['age_verification'] ) ) {
        $errors->add( 'age_verification_error', __( '<strong>Error</strong>: First name is required!', 'woocommerce' ) );
    }
    return $errors;
}

 // to save the form into user meta age_verification
function age_verification_save( $customer_id ) {
    if ( isset( $_POST['age_verification'] ) ) {
        update_user_meta( $customer_id, 'age_verification', sanitize_text_field( $_POST['age_verification'] ) );
   }
}

add_action( 'woocommerce_register_form', 'add_age_verification' );
add_filter( 'woocommerce_registration_errors', 'validate_age_verification', 10, 3 );
add_action( 'woocommerce_created_customer', 'age_verification_save' );

除了钩子的不兼容之外，我已执行的测试的第二个复选框也出现在一行中的短语和下面的复选框。它必须全部放在一条线上。

我怎样才能做到这一点并让两个钩子都工作而不产生不兼容性？

标签： wordpresswoocommercecheckboxregistrationhook-woocommerce

解决方案

您的代码包含一些小错误

  • woocommerce_created_customer隐私政策中缺失
  • reg_age_verification&age_verification可以互换使用
  • 关于字段的显示，这可以通过添加/修改 CSS 选择器来完成：form-row-first, form-row-last& form-row-wide。此外，这是 CSS 调整的问题，具体取决于您使用的主题

所以你得到：

// Add fields to register page
function action_woocommerce_register_form() {
    // First checkbox
    woocommerce_form_field( 'politica_privacidad_registro', array(
        'type'          => 'checkbox',
        'class'         => array( 'woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide' ),
        'label_class'   => array( 'woocommerce-form__label woocommerce-form__label-for-checkbox checkbox' ),
        'input_class'   => array( 'woocommerce-form__input woocommerce-form__input-checkbox input-checkbox' ),
        'required'      => true,
        'label'         => __( 'He leído y acepto la política de privacidad', 'woocommerce' ),
    ));
    
    // Second checkbox
    woocommerce_form_field( 'age_verification', array(
        'type'          => 'checkbox',
        'class'         => array( 'woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide' ),
        'label_class'   => array( 'woocommerce-form__label woocommerce-form__label-for-checkbox checkbox' ),
        'input_class'   => array( 'woocommerce-form__input woocommerce-form__input-checkbox input-checkbox' ),
        'required'      => true,
        'label'         => __( 'Age verification', 'woocommerce'),
    ));
}
add_action( 'woocommerce_register_form', 'action_woocommerce_register_form' );

// Validation
function filter_woocommerce_registration_errors( $errors, $username, $email ) {
    // Privacy NOT isset
    if ( ! (int) isset( $_POST['politica_privacidad_registro'] ) ) {
        $errors->add( 'politica_privacidad_registro_error', __( 'Tienes que aceptar nuestra política de privacidad.', 'woocommerce' ) );
    }
    
    // Age NOT isset
    if ( ! (int) isset( $_POST['age_verification'] ) ) {
        $errors->add( 'age_verification_error', __( 'Age is required.', 'woocommerce' ) );
    }
    
    return $errors;
}
add_filter( 'woocommerce_registration_errors', 'filter_woocommerce_registration_errors', 10, 3 );  

// Save fields
function action_woocommerce_created_customer( $customer_id, $new_customer_data, $password_generated ) {
    // Privacy isset
    if ( isset( $_POST['politica_privacidad_registro'] ) ) {
        update_user_meta( $customer_id, 'politica_privacidad_registro', sanitize_text_field( $_POST['politica_privacidad_registro'] ) );
    }
    
    // Age isset
    if ( isset( $_POST['age_verification'] ) ) {
        update_user_meta( $customer_id, 'age_verification', sanitize_text_field( $_POST['age_verification'] ) );
    }
}
add_action( 'woocommerce_created_customer', 'action_woocommerce_created_customer', 10 , 3 );

推荐阅读