Articles on: Custom extensions

Password protected pages

This guide will show you how to create a simple password protection for your pages.



Step 1/4



Copy this code:

<style>
   body{
   visibility: hidden;
   }
</style>
<script>
   function do_check(){
       var password = 'test';
       var return_value=prompt("Password:");
       if(return_value == password) {
           document.getElementsByTagName("BODY")[0].style.visibility = "visible";
       }
       else {
           setTimeout(()=>{
               alert('This website is protected with a password. Reload the page and try again.');
           }, 200)
       }
   }
   window.addEventListener("DOMContentLoaded", () => {
       setTimeout(do_check, 500)
   })
</script>


Step 2/4



Create a Custom HTML component on the page that you want to protect with a password.



Step 3/4



Paste the code inside.



Step 4/4



Replace this line with your own one (make sure to keep the quotes). This will be your password.



Done!



Save changes and open the live version of your website to see the results 🔒

PS: If you want to set a password for all pages, simply paste the code from step 1 into the General settings > </body> custom HTML code

Updated on: 18/06/2024

Was this article helpful?

Share your feedback

Cancel

Thank you!