How to Disable Copying Text Using Only CSS?

Hello Everyone! Welcome to our Alpha Arp website. In this article, I will show you how to disable the copy function using CSS. This means the article explains how to enable copy protection on your website.

How to Disable Copying Text in a Blogspot Site?

Important Warning!
Please take a backup of your Blogger template. Alpha ARP is not responsible for any data loss you may incur.

1. Log in to your Blogger Dashboard
2. Open the "Theme" section
3. Click the down arrow next to the Customize button
4. Click on the Edit HTML option. You will now be redirected to the theme editing page
5. Find }}></b:skin> and paste the CSS code above it
   Alternatively, create a <style></style> tag above the </head> tag and paste the CSS code inside the <style> tags

/* Disable Copy by Alpha Arp */ body,*{-webkit-user-select:none!important;-moz-user-select:none!important;-ms-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important}pre,code{-webkit-user-select:text!important;-moz-user-select:text!important;-ms-user-select:text!important;user-select:text!important;-webkit-touch-callout:text!important}

Disable Copying Using Javascript (Optional)

/*<![CDATA[*/
 document.addEventListener('contextmenu', event => event.preventDefault());
  document.addEventListener('keydown', function(e) {
    if ((e.ctrlKey && e.key === 'c') || (e.metaKey && e.key === 'c')) {
      e.preventDefault();
    }
  });
/*]]>*/

Important Notes

• This method only prevents normal users. Advanced users can bypass this script using developer tools or extensions.
• Test this code's behavior on your website.