WooCoomerce: открывать всплывающее окно при установке флажка условий

Question

Я начал здесь немного отчаяться. Итак, у меня есть флажок в области условий моей кассы woocommerce, чтобы я согласился с тем, что вы прочитали наши T & C. Однако мы предлагаем услуги, которые АБСОЛЮТНО требуют от людей ознакомления с нашими условиями, поскольку они включают информацию об опасности для здоровья. Очевидно, с юридической точки зрения у нас будет все в порядке, если мы предложим условия и заставим людей согласиться с тем, что они их прочитают. Он не должен быть модным или стилизованным, но поскольку он находится в woocommerce, я ОЧЕНЬ не уверен, где что разместить.

Простой тип <input type="checkbox" id="xxx"> и javascript были моим первым предположением, но я не знаю, где что разместить в этом случае, поскольку Woocommerce кажется довольно закрытой экосистемой, поэтому я также не нашел, где поместите мой JS (слишком много разных phps?) ни где поставить галочку. Я был так потерян.

Может у вас есть другой подход или вы знаете, куда что положить.

Спасибо!

Answer 1

Приведенный ниже код добавит дополнительный настраиваемый флажок T & C на странице оформления заказа перед кнопкой «разместить заказ»:

// Additional terms and conditions check box in checkout page
add_action( 'woocommerce_checkout_after_terms_and_conditions', 'add_terms_and_conditions_checkbox', 20 );
function add_terms_and_conditions_checkbox() {

    woocommerce_form_field( 'terms_two', array(
        'type'          => 'checkbox',
        'class'         => array( 'terms terms-two' ),
        'input_class'   => array('woocommerce-form__input-checkbox'),
        'label_class'   => array('woocommerce-form__label-for-checkbox'),
        'label'         => '<span>' . sprintf( 
            __( "I have read and accept %s…", $domain ),
            '<a class="terms_link" id="terms_link">'.__( "the terms and conditions", $domain ).'</a>'
        ) . '</span>',
        'required'      => true,
    ), '');
}

Или вы также можете переопределить, через вашу тему, файл шаблона checkout/terms.php, который отображает флажок условий и положений WooCommerce на странице оформления заказа, чтобы сделать его так, как вы хотите.

Ниже функцию, вы можете включить соответствующий сценарий javascript / jQuery на страницу оформления заказа для события открытия всплывающего окна:

// Auto Show hide checkout shipping fields based on chosen shipping methods
add_action( 'wp_footer', 'custom_checkout_field_script' );
function custom_checkout_field_script() {
    // Only on checkout page
    if( is_checkout() && ! is_wc_endpoint_url() ):

    // Jquery code start
    ?>
    <script>
        jQuery(function($){
            // Here come your jQuery code
        });
    </script>
    <?php
    endif;
}

Код входит в functions. php файл вашей активной дочерней темы (или активной тема).

Связано: Флажок дополнительной проверки оформления заказа в Европе GDPR в Woocommerce