> For the complete documentation index, see [llms.txt](https://docs.poweredbybackstage.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.poweredbybackstage.com/modules/access-code.md).

# Access Code

![](https://cdn.document360.io/51d5f5f5-89d8-4165-89b4-3d8ba1f39542/Images/Documentation/image%2828%29.png)

## Overview

The **Access Code module** provides a way for a Guest to authenticate with an access code.

## Access Code Properties

**How to treat magic links** (required)\
*Dropdown*\
Defines the behavior when guests enter the site using a magic link containing their access code. Options include:

* `none`
* `auto-fill`
* `auto-submit`

{% hint style="info" %}
For auto-submit to work, the "Show Terms and Conditions" checkbox must be unchecked.
{% endhint %}

**Title**\
*String*\
Sets the title string displayed at the top of the Access Code module.

**Subtitle**\
*String* \
Sets the subtitle text displayed under the title of the Access Code module.

**Access Code Length**\
*Number*\
Sets the access code length requirement on the site. This should reflect the access code length generated when uploading Guests.

**Error Message for Wrong Access Code**\
*String*\
Sets the error message that is displayed when an invalid access code is entered.

**Show Terms and Conditions Checkbox?**\
*Checkbox, default `enabled`*\
If enabled, shows the Terms and Conditions box which users must check off in order to log in.

### Nodes

### Broadcasters

**AccessCode:on-failure**\
Indicates an unsuccessful verification has occurred. This usually renders an error in the **Access Code Module**

#### **Parameters**

* reason - Reason for the error in Access Code 
* showId - Unique ID for the show that the error is for. 

**AccessCode:on-success**\
Indicates a successful verification has occurred. This usually renders an success in the **Access Code Module**

#### **Parameters**

* attendeeId - Unique ID for the attendee.
* attendeeName - Name for the attendee.
* attendeeEmail - Email for the attendee.
* showId - Unique ID for the show.

**AccessCode:verify**\
Requests the given access code be verified for the show. This usually will return the access code used in the **Access Code Module.**

#### **Parameters**

* *accessCode* - Access code used for the verify instruction
* showId - Unique ID for the show.

### **Listeners**

**AccessCode:success**\
Access code was successfully verified

**Parameters:**

* attendee - Attendee object with id
* name
* email
* chatToken - Array of tokens

**AccessCode:failure**\
Access code could not be verified

**Parameters:**

* reason

**AccessCode:animationState**

The name of an animation state for the Access Code.

**Parameters:**

* stateName

## Submit Button Properties

**Button Label**\
*String*\
Sets the label of the button.

[**Button ARIA Label**](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)\
*String*\
If defined, sets the ARIA label of the button to provide the element with an [accessible name](https://w3c.github.io/aria/#dfn-accessible-name).

**Button Color**\
*String - Valid color string (`white`) or hex code (`#FFFFF`)*\
Sets the color of the button background.

[**Text Color**](https://developer.mozilla.org/en-US/docs/Web/CSS/color)\
*String - Valid color string (`white`) or hex code (`#FFFFF`)*\
Overrides the default color of the text.

[**Width**](https://developer.mozilla.org/en-US/docs/Web/CSS/width)\
*String*\
Overrides the default width of the button. This property accepts lengths followed by a relative unit (`em`, `ex`, or `px`) or percentages. Example: `500px` or `5em`

### Code Input Properties

**Input Label**\
*String*\
Sets the name of the code input field.

**Input Placeholder**\
*String*\
If defined, sets the input placeholder. This is usually used as helper text for access code entry.

**Size**\
*Dropdown*\
Font size of the access code input. Options include:

* none
* `auto-fill`
* `auto-submit`

**Style attribute**\
*String, css style property(ies)*\
Can be used to apply CSS to customize the access code input.

### Checkbox Label

**Label Content** (required)\
*Rich text*\
Sets the label of the checkbox. The default label is contains an agreement to the Terms and Conditions. This supports rich text for the checkbox label.

### Resent Button Props

**Button Label**\
*String*\
Sets the label specific to the link for resending codes.

[**Button ARIA Label**](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)\
*String*\
If defined, sets the ARIA label of the resend code button to provide the element with an [accessible name](https://w3c.github.io/aria/#dfn-accessible-name).

**Text Color**\
*String - Valid color string (`white`) or hex code (`#FFFFF`)*\
Overrides the default color of the text.

**Show Resent Link?**\
*Checkbox, default `disabled`*\
If enabled, shows the resend link if its available.

**SendGrid Template Id**\
*String - valid SendGrid template id*\
Template to use when guests request their access code

**SendGrid From Name**\
*String*\
Name of site/event to use when the guests receieve a resend code email, defaults to the site name if not provided.

**SendGrid From Email Address**\
*String, a valid formatted email address*\
Email address of site/event to use when the guests receieve a resend code email, defaults `hello@lcdigital.io` if not provided. Use caution when setting this value if the from email address does not have a reputation as a valid email sender the resend code emails are *very* likely to end up in spam folders.