Is it possible to make password protected pages with different set password?

Store Design
1

Hi there,

I pair curated playlists with my products and I was wanting to create multiple pages that only customers who have the password to can enter and get the links to their specific playlists. I was wondering if this is possible to set up a password catch and depending on what password is put in (would be set by me on my end), it will take them to a specific page where the link to their playlist will be. Mostly so they can’t just get access to all the playlists when they only need one. Is this possible to do?? I have Dawn theme on my site right now also. Thanks in advance to anyone who has insight on this! :slightly_smiling_face:

2

Hi @Etdesigns888 ,

This is Amelia from PageFly - a Landing Page Builder App,

You can try to use this way to make the customization for your password pages

Here’s a step-by-step guide to help you set this up:

Step 1: Create the Password-Protected Pages1. Create the Pages:

  • Go to Online Store > Pages in your Shopify admin.

  • Create a new page for each playlist you want to protect. For example, create pages like “Playlist 1”, “Playlist 2”, etc.

  • Add the playlist links to these pages.

Step 2: Create a Password Entry Page1. Create a New Page:

  • Go to Online Store > Pages.

  • Create a new page called “Password Entry”.

  1. Add the Password Form:

    • In the content editor, add an HTML form for password entry. For example:

Step 3: Add JavaScript for Password Handling1. Create a New JavaScript File:

  • In the Assets folder, click Add a new asset and create a new JavaScript file (e.g., password-redirect.js).
  1. Add the Following JavaScript Code:
document.addEventListener('DOMContentLoaded', function() { var form = document.getElementById('password-form'); form.addEventListener('submit', function(event) { event.preventDefault(); var password = document.getElementById('password').value; // Define your passwords and corresponding pages var passwordPages = { 'password1': '/pages/playlist-1', 'password2': '/pages/playlist-2', 'password3': '/pages/playlist-3' }; if (passwordPages[password]) { window.location.href = passwordPages[password]; } else { alert('Invalid password. Please try again.'); } }); });

Step 4: Include the JavaScript File in Your Theme1. Include the JavaScript File:

  • In the Layout folder, open theme.liquid.

  • Add the following line before the closing tag

I hope that my solution works for you.

Best regards,

Amelia | PageFly