Auth0 Home Blog Docs

Using Universal Login or Passwordless on Squarespace

I have a background in coding HTML, CSS, Twig, and following other folk’s tutorials for implementing other types of programming languages :wink: I may be over my head with my desire to incorporate Auth0 on a Squarespace web platform.

Squarespace’s native WYSWIG style interface gives me the ability to add code to site header and footer; as well as page header and inline. Squarespace also has a Developer Platform which looks as though it would give me the ability to edit raw page template code. (I haven’t actually used their Developer Platform, but would be happy to try if it would help.)

Using the Auth0 docs and Lock for Web, I was able to get Universal Login working to capture and login my test user via Google account (I can see the test user in my Auth0 account under “Users & Roles.”) I did this using Squarespace’s native front end interface by injecting code in the Site Footer and Page Body (see below.)

I put the div code in my page body to show the Universal Login Form:

<div id="root" style="width: 320px; margin: 40px auto; padding: 10px; border-style: dashed; border-width: 1px; box-sizing: border-box;">embedded area</div>

I put the Javascript in the Site Footer:

<script>
  var lock = new Auth0Lock('YOUR_CLIENT_ID', 'YOUR_DOMAIN', {
    container: 'root',
    auth: {
      redirectUrl: 'https://YOUR_APP/callback',    // If not specified, defaults to the current page 
      responseType: 'token id_token',
      params: {
        scope: 'openid email'                // Learn about scopes: https://auth0.com/docs/scopes
      }
    }
  });
  lock.show();
</script>

What I haven’t figured out is how to protect the Single Page on the Squarespace site from being accessed before a user logs in. If I go to the direct URL of the Single Page, I can see it. Perhaps I’m missing additional Auth0 code, or probably more likely, I need to inject something on the Single Page to look for a token or authorization.

Any ideas of what I’m missing in my implementation? Or perhaps, there is no way to use Auth0 due to Squarespace’s limitations.

Thanks in advance!
Lori