• Resolved tulip578

    (@tulip578)


    I am using the [woocommerce_checkout] shortcode for the Checkout Page, since the payment method is only compatible with this format.

    Although the page works fine overall, there seems to be a render error on the “Create a New Account” and “Terms and Conditions” boxes, which do not show as marked upon click. They do, however, change state since once you click on the “Terms and Conditions” box you can then proceed to checkout correctly.

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Hey there, @tulip578! Thanks for contacting us. I’m happy to help you.

    I checked your website and I was able to see the issue you mentioned.

    However, I was not able to replicate it on my website. Can you please run a conflict test to check if something external is causing this error?

    Can you please run a conflict test to see if something external is interfering with this?

    To test, you’ll first want to change the theme on your site to Storefront, then check to see if the issue is still present. If that resolves the issue, you’ll want to get in touch with your theme’s developer and see if they have an update or fix for you.

    If changing the theme doesn’t help, you’ll want to deactivate all plugins except for WooCommerce and take a look. If that fixes the problem, re-enable the other plugins one by one (gradually), checking after each, to see where the issue is coming from.

    — Be sure you have a good backup in place of your full site and database. You can ask your host for backup functionality or you can consider using a service like Jetpack. If something goes wrong, you will be able to restore it.

    — Also, you can consider using a plugin like Health Check & Troubleshooting. This is a plugin developed by the WordPress community and it is helpful to disable plugins without affecting your current site visitors.

    — It is important to consider as well a staging functionality in case you would not like to touch your production site (you can ask your host if they offer this service), or you can use WP Staging for quickly spinning up a new test site.

    You can find more about this in this guide.

    Please let us know about your findings.

    Looking forward to your reply.

    Have a wonderful day!

    SilkyPress

    (@diana_burduja)

    Hello @tulip578,

    the Threadwears theme replaces the three checkboxes on the checkout page with a stylized version, which needs a couple lines of JavaScript to make it work.

    The “Shipping to another address?” checkbox has the necessary JavaScript code, but the other two checkboxes were left out.

    The issue can be fixed by adding the following JS code to your website:

    
    let checkDivAccount = document.querySelector('.woocommerce-account-fields .checkbox span');
    if (checkDivAccount !== null) {
    	checkDivAccount.onclick = function (e) {
    		this.classList.toggle('checked');
    	}
    }
    
    let checkDivTerms = document.querySelector('.woocommerce-terms-and-conditions-checkbox-text');
    if (checkDivTerms !== null) {
    	checkDivTerms.onclick = function (e) {
    		this.classList.toggle('checked');
    	}
    }

    Use a plugin similar to Simple Custom CSS & JS to add the JS code.

    You can also try contacting the support team of the Threadwears theme about the two checkboxes and point them to this answer.

    • This reply was modified 1 year ago by SilkyPress.
    Plugin Support omarfpg a11n

    (@omarfpg)

    Hi @diana_burduja, thanks for sharing this. I just did a quick test on my browser for that JS, and it worked: https://prnt.sc/TlsVs2nxQqiG.

    This confirms this is a theme issue, and it should be indeed redirected to the theme developers.

    Thanks!

    Thread Starter tulip578

    (@tulip578)

    Hi all, thank you for your help! I will respond individually:

    @carolm29, indeed, by changing the theme to another one, the issue was resolved. Therefore, the issue is due to the Threadwears theme. This was very helpful!

    @diana_burduja, thank you very much for the proposed fix. The first function fixes the create account check; however, the second one, the one below, does not have any effect. I have tried adapting to get the same effect as in the first function, but I am out of ideas and unsure how this can be debugged. Therefore, I would really appreciate it if you could give me another hand with this.

    let checkDivTerms = document.querySelector('.woocommerce-terms-and-conditions-checkbox-text');
    if (checkDivTerms !== null) {
    	checkDivTerms.onclick = function (e) {
    		this.classList.toggle('checked');
    	}
    }

    @omarfpg Indeed, this is a theme issue! I raised it on the theme in the following link https://catchthemes.com/support-forum/forum/full-site-editing/threadwears/, but it is currently awaiting for moderation.

    Plugin Support Shameem R. a11n

    (@shameemreza)

    Hi @tulip578,

    That’s great to hear! I’m glad to know we have been helpful in diagnosing the issue with your checkout page! ??

    However, since you’re still facing problems with the “Terms and Conditions” checkbox, it might be best to continue the conversation with the theme developers. I am sure they will have no problem supporting you there.

    Should you have further inquiries, kindly create a new topic here.

    Thanks!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Terms and Conditions Box Not Checked on Click’ is closed to new replies.