How to add Terms & Conditions checkbox to eLumine’s registration form?

You need to follow the below steps to add a terms & conditions checkbox to eLumine’s registration form.

1. Create a setting to set the Terms & Conditions page.
2. Add the checkbox to the registration form.
3. Add JS code to disable the Registration button if Terms & Conditions are not accepted.
4. Add server-side validation.

Create a setting for the Terms & Conditions page.

add_action('admin_init', 'addTermsandConditionsPage');

function addTermsandConditionsPage()
{
    /* Register Settings */
    register_setting(
        'reading', // Options group
        'elumine_terms_and_conditions_page', // Option name/database
        array( // sanitize callback function
            'type' => 'integer',
            'description' => __('Select the Terms & Conditions page here', 'elumine-child'),
        )
    );

    /* Add Settings field */
    add_settings_field(
        'elumine_terms_and_conditions_page',
        __('Select Terms & Conditions Page', 'elumine-child'),
        'renderTnCFormField',
        'reading',
        'elumine_login_section',
        array('label_for' => 'elumine_terms_and_conditions_page')
    );
}

function renderTnCFormField()
{
    $pages = get_pages();
    $current_page = get_option('elumine_terms_and_conditions_page'); ?>
    <select name="elumine_terms_and_conditions_page">
    <option value=""><?php echo esc_attr(__('Select terms & conditions page', 'elumine-child')); ?></option>
    <?php
    foreach ($pages as $page) {
        $option = '<option value="' . $page->ID . '"' . selected($current_page, $page->ID, true) . '>';
        $option .= $page->post_title;
        $option .= '</option>';
        echo $option;
    } ?>
    </select>
    <?php
}

The setting created above can be accessed from Dashboard > Settings > Reading Settings.

Add the checkbox to the registration form

add_action( 'elumine_after_registartion_form', 'show_terms_and_conditions_checkbox' );

if (!function_exists('show_terms_and_conditions_checkbox')) {
    function show_terms_and_conditions_checkbox() {
        ?>
        <div class="terms_and_conditions" style="margin-bottom: 20px;">
            <input type="checkbox" name="accept_terms_conditions" id="accept_terms_conditions">
            <label for="accept_terms_conditions" style="margin-left: 10px;">
                <?php
                $link = get_option('elumine_terms_and_conditions_page', false);
                if (!$link) {
                  $link = '#';
                } else {
                  $link = get_permalink($link);
                }
                /* translators: 1: Anchor tag for terms and conditions begin 2: Anchor tag closing for terms and conditions.*/
                echo sprintf(__('I\'ve read and accept the %1$sterms & conditions%2$s', 'elumine-child'), '<a href="'. $link . '" target="_blank">','</a>' );
                ?>
            </label>
        </div>
        <?php
       wp_enqueue_script( 'terms_and_conditions_js', get_stylesheet_directory_uri() . '/custom.js', array('jquery') );
    }
}

Add JS code to disable the Registration button if Terms & Conditions are not accepted.

Create a file called custom.js in the child theme root directory i.e., elumine-child directory and add the following code in the file.

jQuery(document).ready(function(){
	if (!jQuery('#accept_terms_conditions').is(':checked')) {
		jQuery('[name="elumine_submit"]').attr('disabled', true);
	}
	jQuery('#accept_terms_conditions').on('click', function(){
	if (jQuery(this).is(':checked')) {
		jQuery('[name="elumine_submit"]').removeAttr('disabled');
	} else {
		jQuery('[name="elumine_submit"]').attr('disabled', true);
	}
	})
});

Add server-side validation

add_filter( 'elumine_before_process', 'registration_form_errors', 10, 2 );

if (!function_exists('registration_form_errors')) {
    function registration_form_errors( $errors, $fields ) {
        if ($fields['accept_terms_conditions']) {
            return $errors;
        }
        $errors['terms_and_conditions_not_accepted'] = __('Terms & Conditions not accepted', 'elumine-child');
        return $errors;
    }
}