Redirect Users to a Specific Page after Login

How Post-Login Navigation Works

The situation in which a login is requested matters.

Membership currently support 3 login flows with three slightly different behaviors.

Direct User-Initiated Login

You clicked the login button, or you navigated directly to the _/log-in page.

By default a user will be redirected to the home page after login, however this can be overridden using the Redirect fallback setting, which is on the Log-In Form Block on the Log in Page.

Currently, [ Dec-2022 ] these redirection options are limited to five pages - Home, User Account, Log In, Sign Up, or Reset Password.

Automatic Login

You attempted to access a gated page, and are not currently logged-in.

In this situation, Webflow will automatically redirect you to the Log In page, and then on successful login, will re-attempt to direct you to the requested page.

The Webflow team has implemented this well.

Let's suppose you want to link customers directly to an article, but that article is members-only.

Here's the UX flow you want;

• If the user is logged in, they are taken directly to that article.
• If the user is not logged in, they are redirected to the login page. Once they log in, they are redirected to the originally requested page automatically.
• If they do not yet have an account, they are given the option to sign up.

This makes it relatively easy to direct people where you want, without worrying about whether they're logged in, or whether they even have an account. To use this feature, you just hand someone the direct link to your page...

_{https://mysite.com/courses/my-members-only-page}

... and Webflow takes care of the rest.

Post-Signup Login

You have just completed sign-up, and are being logged-in for the first time.

Immediately after the sign-up form is completed, the user is automatically routed through the log-in page to complete authentication.

Customizing the Login Navigation Flow

But what if, immediately after a normal log-in, you want your users to always land on a specific page?

• Taking them to a members-only home page
• Making sure they stay on the current page, after a login

Scripting, for the Win

This is possible with javascript. We can insert a touch of script into that flow to make it work how we want it to.  

Here's how that script works;

• First, check to make certain there is not already an _?usredir query string on the page. If there is, this user is already headed somewhere specific, and we probably don't want to derail that.
• If there is no query string, then let's redirect the user now to the members-only page we want them to end up at.
• Since they're not logged it yet, they'll be redirected back to login but now with the forwarding instruction. Once they've successfully logged in, they'll arrive exactly where we want them.

Check it out!

I've done an implementation of this on this site, and it works smoothly.

Sign Up for a free Members account, and then after you are authenticated, log out, and log back in again using the top navbar's login button.

You'll see that you are taken to the Members-Only Home Page instead.

WANT THE CODE? I'm happy to share, but I'm waiting to finalize this process so the default behavior is more stable.