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

# Social Profile Component

> Defines social media links, contact details, or digital identity fields for QR Code landing pages. Commonly used in categories like Product, Restaurant, and Social Media QR Codes.

## Overview

The **Social Profile Component** allows users to attach multiple social links, handles, or communication channels (e.g., email, phone, or social media profiles) to a landing page.\
It supports flexible configuration — including label text, icon customization, and event tracking — enabling personalized, branded connection options.

Each profile entry defines **what type of field** (URL, handle, ID, etc.) it is, **what network or platform** it belongs to, and **how it appears** on the page.

## Properties

| Property     | Type     | Required | Description                                                                           |
| :----------- | :------- | :------- | :------------------------------------------------------------------------------------ |
| **data**     | `string` | ✅ Yes    | Contains the main input such as a social profile URL, username handle, or contact ID. |
| **field**    | `string` | ✅ Yes    | Defines the type of input. Supported values: `url`, `handle`, `id`, `tel`, `email`.   |
| **key**      | `string` | ✅ Yes    | Unique identifier for the social network (e.g., `facebook`, `instagram`, `whatsapp`). |
| **name**     | `string` | No       | Optional display name for internal reference.                                         |
| **label**    | `string` | No       | Text label shown on the landing page (e.g., “Follow us on Instagram”).                |
| **color**    | `object` | No       | Allows customization of button, label, and border colors.                             |
| **icon**     | `object` | No       | Custom icon reference for the platform. Must include a valid `url`.                   |
| **tracking** | `object` | No       | Reference to the `Event Tracking` component for analytics on profile clicks.          |

## Used in Categories

This component is used in the following categories:

* [Coupon](/guides/category-components/categories/coupon)
* [Dynamic Text](/guides/category-components/categories/dynamicText)
* [Event](/guides/category-components/categories/event)
* [Product](/guides/category-components/categories/product)
* [Real Estate](/guides/category-components/categories/realEstate)
* [Restaurant](/guides/category-components/categories/restaurant)
* [Social Media](/guides/category-components/categories/sMedia)

## Schema

<CodeGroup>
  ```json Schema theme={null}
  {
    "$schema": "http://json-schema.org/draft-07/schema#",
    "title": "Social Profile component",
    "description": "Validate social profile component schema",
    "required": [],
    "additionalProperties": false,
    "type": "array",
    "items": {
      "type": "object",
      "required": [
        "data",
        "field",
        "key"
      ],
      "additionalProperties": false,
      "properties": {
        "data": {
          "type": "string",
          "description": "Data contains either profile url, handle id, etc.",
          "minLength": 2
        },
        "field": {
          "type": "string",
          "enum": [
            "url",
            "handle",
            "id",
            "tel",
            "email"
          ],
          "description": "Type of field value."
        },
        "key": {
          "type": "string",
          "description": "Social media name used to distinguish each social network",
          "minLength": 2
        },
        "name": {
          "type": "string"
        },
        "label": {
          "type": "string",
          "description": "Label to display on the landing page",
          "minLength": 2
        },
        "color": {
          "type": "object",
          "additionalProperties": false,
          "required": [],
          "properties": {
            "button": {
              "type": "string"
            },
            "label": {
              "type": "string"
            },
            "border": {
              "type": "string"
            }
          }
        },
        "icon": {
          "type": "object",
          "additionalProperties": false,
          "required": [
            "url"
          ],
          "properties": {
            "url": {
              "type": "string",
              "minLength": 2
            }
          }
        },
        "tracking": {
          "$ref": "event_tracking.json"
        }
      }
    }
  }
  ```
</CodeGroup>

## Notes

* The `key` field distinguishes between different social platforms and helps render platform-specific icons.
* The `tracking` property integrates with event analytics for measuring user engagement.
* Supports both **social networks** (e.g., Instagram, Facebook) and **direct contact methods** (phone, email).
* Can be displayed as icon-only, text-only, or combined button styles depending on category design.
