> For the complete documentation index, see [llms.txt](https://docs.wavecast.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.wavecast.io/publishing/shortcodes/buttons.md).

# Buttons

We have four different button shortcodes:

1. [Register Button](#register-button)
2. [Signup Button](#signup-button)
3. [Signup with LinkedIn Button](#signup-with-linkedin-button)
4. [Button](#button)

***

### Register Button

The \[register\_button] shortcode is designed to make event registration accessible across various pages associated with an event. This shortcode can be used to display a registration button that dynami

#### How to use

Place the `[register_button]` shortcode on any event-related page where you want users to have access to the registration option. This includes:

* **Event main page**
* **Event sub-pages**
* **Sub-events**
* **Individual sessions**

{% hint style="info" %}
If your register button is placed incorrectly, a helpful message should appear explaining the issue.
{% endhint %}

#### Behaviour Across Event Hierarchy

The `[register_button]` shortcode rolls registration up to the highest level of the event hierarchy if required. This behavior is similar to the main "Register" button in the header.

For example, if a session is part of a **super-event** that requires registration, placing the `[register_button]` on the session page will display the **super-event registration** instead of the session registration, if you are not registered for the super-event.

**Example Hierarchy:**

* Super Event (requires registration)
  * Sub-event
    * Session

If `[register_button]` is placed on the **Session** page, it will display the registration form for the **Session** if you're already registered for the **Super Event**.

#### Additional Notes

#### Dynamic, Adaptive Behavior

The `[register_button]` shortcode is designed to be fully responsive, adjusting both its link and behavior based on the page context and user state—similar to the adaptive registration button in the site header.

* **Context-Aware Linking**: The button dynamically links to the appropriate registration page based on where it’s placed within the event hierarchy.
* **User-Sensitive Actions**: The button also adapts based on the user's login and registration status:
  * **Logged Out Users**: If the user is not logged in, clicking the button will trigger a sign-in prompt to ensure a seamless registration experience.
  * **Already Registered Users**: If the user is already registered for the event, the button will not display, avoiding unnecessary prompts.

This responsive behavior ensures that the `[register_button]` remains relevant and useful, providing only the actions the user needs at each stage of the registration process.

#### Styling 

The `[register_button]` can be styled through CSS if customizations are needed to match your theme.\
\
If you wish to change the alignment or width of your button, please utilise the advanced settings of the block in which it is located. 

***

### Signup Button

The **Sign-up Button** and the **Sign-up CTA Button** is used for guiding users to sign-up pages. It supports linking to external pages or the platform's sign-up page.

#### Parameters

<table><thead><tr><th width="144">Attribute</th><th>Description</th><th>Default Value</th><th>Example Value</th></tr></thead><tbody><tr><td>text</td><td>The text displayed on the button.</td><td>Sign up</td><td>Register Now</td></tr><tr><td>bg_color</td><td>The background color of the button.</td><td>(None)</td><td>#FF5733</td></tr><tr><td>link</td><td>The URL the button links to. Defaults to the platform's sign-up page with a redirect parameter.</td><td>signUpUrl() . '?on_auth_redirect_to=' . currentPageUrl()</td><td>https://example.com/register</td></tr><tr><td>target</td><td>Specifies where to open the link. If set, opens the link in a new tab (_blank).</td><td>_blank if link is provided; otherwise ''</td><td>_self</td></tr></tbody></table>

{% hint style="info" %}
The \[signup\_cta] also accepts the parameter image, so you can paste in the URL of an image you would like to display in the CTA.
{% endhint %}

**Behavior:**

* If the `link` is not provided, the button will redirect users to the platform's sign-up page with a redirect back to the current page upon completion.
* Supports customizable text and background color.

**Example Shortcode:**

```
[signup_button 
    text="Join Now" 
    bg_color="#4285F4" 
    link="https://example.com/signup" 
    target="_blank"]
    
[signup_cta
    text="Join Now" 
    bg_color="#4285F4" 
    link="https://example.com/signup" 
    target="_blank"]
```

***

### Signup with LinkedIn Button

#### Before starting this, please read our documentation on [LinkedIn Sign Up Setup](/integrations/linkedin-sign-up-setup.md).

#### Parameters

| Attribute | Description                       | Default Value       | Example Value |
| --------- | --------------------------------- | ------------------- | ------------- |
| text      | The text displayed on the button. | Sign upUSE Linkedin | Learn More    |

**Example Shortcode:**

```
[signup_with_linkedin_button
    text="Sign in with LinkedIn"]
```

***

### Button

The `[button]` shortcode is a flexible element designed for creating customizable buttons that can link to specific URLs.

#### Parameters<br>

| Attribute | Description                                                           | Default Value          | Example Value                  |
| --------- | --------------------------------------------------------------------- | ---------------------- | ------------------------------ |
| text      | The text displayed on the button.                                     | Sign up                | Learn More                     |
| bg\_color | The background color of the button.                                   | (None)                 | #007BFF                        |
| link      | The URL the button links to. Defaults to a local action when not set. | # (Local registration) | <https://example.com/register> |
| target    | Specifies where to open the link.                                     | '' (Current tab)       | \_blank                        |

**Example Shortcode:**

```
[button 
    text="Learn More" 
    bg_color="#FF5733" 
    link="https://example.com/learn" 
    target="_blank"]
```