Question 1930 in Wordpress Question posted in
The official Wordpress documentation can be found here.

WooCommerce – How to Make Description and Review Boxes Unselectable for Unregistered Users – WordPress

I want to make WooCommerce description and review boxes unselectable for unregistered users. unfortunately there is zero information out there on how to do this.

Any help would be greatly appreciated 🙏

Tags:

2

Answers


  1. 0

    For that you have to add blur css and set "user-select: none", "pointer-events: none".

        $(document).ready(function(){
      $("#toggleBtn").click(function(){
            $('#btn_id').toggleClass('disabled');
        
            if($('#btn_id').hasClass('disabled')){
                $(this).text('Enable Button');
            }else{
                $(this).text('Disable Button');
            }
      });
    });
            .btn{
            width: 150px;
            height: 150px;
            display: flex;
            align-items: center;
            justify-content: center;
            border:1px solid #000;
            border-radius: 4px;
        }
        .disabled{
            -webkit-user-select: none;
            -ms-user-select: none;
            user-select: none;
            filter: blur(2px);
            pointer-events: none;
        }
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
</head>
<div class="btn">
    <button class="disabled" id="btn_id">Submit</button>
</div>
<button id="toggleBtn">Enable Button</button>
    Login or Signup to reply.
  2. 0

    Simple. This can be achieved on CSS or by making core changes to the theme you’re using. CSS method is simpler.

    If your intention is to make the texts or buttons blurry for unregistered/guest users, you need to add 2 CSS rules.

    1. For all users –
      .woocommerce div.product .woocommerce-tabs .panel { filter: blur(5px); }

    2. For logged in users alone –
      If a user is logged in as an admin or customer, WordPress adds a class to the body "logged-in" – See pic below. Using that class
      .logged-in .woocommerce div.product .woocommerce-tabs .panel{ filter: unset; }

    Logged-in Class in WordPress

    Explanation –

    Adding the first rule will blur elements for all users but the second rule will override the first rule IF a customer is logged in to the website.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search