Reflow Docs

# Auth Button

The Auth Button component allows your customers to create a user account in your store and sign in and out. It takes advantage of Reflow's Store Registrations feature.

The component has two states depending on the customer status:

  • Guest - Shown when the customer is not logged in. This state displays a button for signing in with an existing account or creating a new one.
  • Authenticated - For logged in users, the Auth Button component shows information about their customer profile and allows them to sign out.

# Examples

# How to Embed

To embed this component on your website include the reflow library, and add the following tag somewhere in the <body> of your page:

<div data-reflow-type="auth-button"></div>

# Supported Attributes

You can configure the auth button behavior and the way it's rendered by specifying additional data-reflow-xxx attributes.

Attribute Possible Values Description
data-reflow-type auth-button Must always be set.
data-reflow-show photo, name (optional) Comma separated list of sections to display when the user is logged in. The sections not in the list will be hidden.

Example: data-reflow-show="photo, name"
data-reflow-signin-redirect URL (optional) When this parameter is set the customer will be redirected to the supplied URL after the sign in process is complete.

Example: data-reflow-signin-redirect="https://example.com/profile"
data-reflow-signout-redirect URL (optional) When this parameter is set the customer will be redirected to the supplied URL after signing out.

Example: data-reflow-signout-redirect="https://example.com/home"
data-reflow-user-page-url URL (optional) When this parameter is set, clicking on the auth button in its authenticated state will redirect to the supplied URL

Example: data-reflow-user-page-url="https://example.com/profile"

← User Settings →