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

# Customize user experience with tags and attributes

> Use tags in Claimr campaign settings together with widget data-attributes to dynamically show or hide Quests and Groups for different user segments.

In Claimr, **Tags** are labels you assign to content elements like **Quests** or **Groups** within your campaign settings. When combined with specific `data-` attributes in your widget integration script, these tags allow you to dynamically control what content is shown or hidden for individual users or user segments. This powerful feature enables you to tailor the campaign experience, making it more relevant and effective for different audiences.

### Benefits of using tags for customization

* Showing specific **Quests** or **Groups** only to certain users.
* Hiding content based on user characteristics (e.g., location, past behavior).
* Creating personalized user journeys within the same campaign.

## How tag-based customization works

The system relies on a two-part setup: tagging your content in the Claimr admin panel and then passing user-specific tags via the widget script.

1. **Tagging content in Claimr**: First, you assign one or more tags to specific **Quests** or **Groups** in their respective settings within the Claimr admin panel. For instructions on adding tags, see the **Tags setting** section in [Quest settings](/quests/quest-settings) or [Group settings](/groups/group-settings).
2. **Passing tags via widget attributes**: Next, for each user session, you include specific `data-` attributes in your widget integration script that tell Claimr which tags are active for that user. These are **`data-show-tags`** and **`data-hide-tags`**.
3. **Display logic**: The Claimr widget then uses this information to decide what to show or hide:
   * If a user is passed a tag via **`data-show-tags`**, any entity (currently Quests and Groups) with a matching tag will be displayed to them, even if it might otherwise be hidden by default or other rules.
   * If a user is passed a tag via **`data-hide-tags`**, any entity (Quests and Groups) with a matching tag will be hidden from them.

<Note>
  **Example scenario:** An X-related group of quests is tagged `x_users` in the admin panel and is hidden by default. For users who have connected their X account, you pass `data-show-tags="x_users"` in the script. This group will then appear for those users.
</Note>

## Configuration in Claimr admin panel

1. **Tagging quests and groups**: Navigate to the settings page of the **Quest** or **Group** you want to tag, locate the **Tags** input field, and enter your desired tag(s), separating multiple tags with a comma. Example: `beta_feature`, `new_user_flow`, `region_EU`. Save the Quest or Group settings.
2. **Defining default visibility**: The "default visibility" of a **Quest** or **Group** is generally determined by whether it's set to "Hidden" in its own settings or by other campaign-level rules. The `data-show-tags` attribute is used to *override* a hidden state for users with matching tags. The `data-hide-tags` attribute is used to *override* a visible state for users with matching tags.

There isn't a separate "default visibility for tags" setting *per se*; tags are used to *modify* the existing visibility based on the user's context provided by the script attributes.

## Script integration configuration

As detailed in our [Widget attributes](/widget/widget-attributes) article, there are 2 key attributes for tag-based customization:

### data-hide-tags

Pass a comma-separated list of tags. Any **Quest** or **Group** in your campaign that has one or more of these tags assigned to it will be hidden from the user for this session.

**Format:** Comma-separated string of tags.

**Example:**

```html theme={"dark"}
<script
  id="claimr-script"
  data-organization="YOUR_ORG_ID"
  data-campaign="YOUR_CAMPAIGN_ID"
  data-container="YOUR_CONTAINER_ID"
  data-hide-tags="advanced_feature,geo_restricted_content"
  src="https://widgets.claimr.io/claimr.min.js">
</script>
```

### data-show-tags

Pass a comma-separated list of tags. Any **Quest** or **Group** that has one or more of these tags assigned to it will be shown to the user, even if it might be hidden by default or due to other rules.

**Format:** Comma-separated string of tags.

**Example:**

```html theme={"dark"}
<script
  id="claimr-script"
  data-organization="YOUR_ORG_ID"
  data-campaign="YOUR_CAMPAIGN_ID"
  data-container="YOUR_CONTAINER_ID"
  data-show-tags="beta_testers_group,early_access_quest"
  src="https://widgets.claimr.io/claimr.min.js">
</script>
```

<Note>
  You can use both `data-hide-tags` and `data-show-tags` simultaneously if needed, but ensure your logic is clear to avoid conflicting rules.
</Note>

## Practical use cases

* **Geo-targeting content**: Tag content with region-specific tags (e.g., `europe_only`, `usa_promo`). In your website/app logic, detect the user's region and pass the appropriate tag via `data-show-tags` (e.g., `data-show-tags="europe_only"`) or hide content for other regions using `data-hide-tags`.
* **A/B testing different content blocks**: Create two versions of a Quest Group (e.g., Group A tagged `test_version_A`, Group B tagged `test_version_B`). Serve the widget script with `data-show-tags="test_version_A"` to 50% of users and `data-show-tags="test_version_B"` to the other 50% to test different content flows.
* **Hiding features unavailable to certain users**: If a feature (e.g., "staking\_quest") is only available to users who meet certain criteria (e.g., KYC verified), tag that quest `staking_enabled`. Only pass `data-show-tags="staking_enabled"` for users who have met those criteria.

By strategically combining tags assigned in the Claimr admin panel with the `data-show-tags` and `data-hide-tags` attributes in your widget script, you can create highly dynamic and personalized campaign experiences for your users.