> ## Documentation Index
> Fetch the complete documentation index at: https://docs.suprsend.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Embedded Preference Centre

> Embed a hosted notification preference center into your website and link it from email and other templates so users can manage subscriptions.

The Notification Preference Centre is a embedded page inside your application where users can specify the types of notifications they wish to receive and on which channels.

With SuprSend's preference management center, you [add preference categories on the SuprSend dashboard](/docs/managing-notification-categories) and get a fully functional preference page to integrate into your application. Users can manage their notification settings directly within your app.

The preference page stays synchronized with any changes made to preference categories on SuprSend — once integrated, you don't need to modify your code to accommodate future updates. User preferences are automatically validated at each workflow run, so notifications align with the user's latest preference settings.

Giving users control over their notification experience reduces the risk of them turning off all notifications from your platform.

## Integrating preference page into your application

With SuprSend, user can set preferences at 3 levels- communication channel, preference category and selected channels inside a category. We provide a headless solution with hooks to read and update data at all 3 levels. We'll also give an example code to add our pre-defined UI. You can do any level of UI customization to match with your brand design.

SDKs are available in below languages. We'll be adding support in other languages soon:

<CardGroup cols={3}>
  <Card title="Javascript" icon="js" iconType="solid" href="docs/preferences-javascript">
    (Web)
  </Card>

  <Card title="React" icon="react" iconType="solid" href="docs/preferences-react-headless" />

  <Card title="Angular" icon="angular" iconType="solid" href="docs/preferences-angular" />
</CardGroup>

## Adding preference page link in notifications

<Steps>
  <Step title="Add preference page link in tenant settings page">
    Add Embeddable Preference Page link in tenant settings on SuprSend dashboard. This will automatically create a variable with key `$embedded_preference_url`. You can add this variable in your templates to add preference page link in your notifications.

    <Frame>
      <img src="https://mintcdn.com/suprsend/y77gmHjmaTSnbCzd/images/docs/c4f02b7-image.png?fit=max&auto=format&n=y77gmHjmaTSnbCzd&q=85&s=d6062c05055e5c66c0cbaad181a443ac" width="1534" height="696" data-path="images/docs/c4f02b7-image.png" />
    </Frame>
  </Step>

  <Step title="Add preference page link in your templates">
    Add this variable `{{$embedded_preference_url}}` in your templates to redirect users to the preference page in your application when users clicks on that link.

    <Frame>
      <img src="https://mintlify.s3-us-west-1.amazonaws.com/suprsend/images/docs/0dc752d-image.png" />
    </Frame>
  </Step>
</Steps>

***
