# एम्बेड और साझाकरण


# एम्बेड और साझाकरण

एक बार आपके [इवेंट प्रकार](./event-types) सेट हो जाने पर, बुक होना पूरी तरह इस बात पर निर्भर है कि आप अपना पेज लोगों के सामने कैसे लाते हैं। आप एक सादा लिंक कहीं भी साझा कर सकते हैं, या अपने बुकिंग पेज को सीधे अपनी ही वेबसाइट के अंदर एम्बेड कर सकते हैं।

## एक लिंक साझा करें

प्रत्येक इवेंट प्रकार का अपना लिंक होता है, जो आपके हैंडल और इवेंट स्लग से बनता है — उदाहरण के लिए `calendar.imatic.ai/book/priya/intro-call`।

1. इवेंट प्रकार खोलें (या इसे अपनी सूची में ढूँढें)।
2. **Copy link** का उपयोग करें।
3. इसे किसी ईमेल, अपने ईमेल हस्ताक्षर, सोशल बायो, चैट संदेश में चिपकाएँ — कहीं भी।

वह लिंक उस इवेंट प्रकार के लिए आपका [सार्वजनिक बुकिंग पेज](./booking-page) खोलता है।

:::tip[प्रति मीटिंग एक लिंक]

किसी सामान्य पेज के बजाय, जिस मीटिंग को आप चाहते हैं उसका विशिष्ट इवेंट-प्रकार लिंक साझा करें। "Intro call" लिंक भेजने का अर्थ है कि आमंत्रित लोग सीधे सही मीटिंग पर पहुँचते हैं।

:::

## अपना बुकिंग पेज एम्बेड करें

चाहते हैं कि लोग आपकी साइट छोड़े बिना बुक करें? अपने बुकिंग पेज को **इनलाइन** एम्बेड करें, ताकि यह आपके पेज के एक हिस्से के रूप में दिखाई दे।

imatic Calendar एक छोटी एम्बेड स्क्रिप्ट, **`embed.js`**, प्रदान करता है। इसे `data-user` और `data-event-type` के साथ अपने हैंडल और इवेंट प्रकार पर इंगित करें, और इसे अपनी साइट के HTML में वहाँ जोड़ें जहाँ आप बुकिंग पेज दिखाना चाहते हैं:

```html
<script
  src="https://calendar.imatic.ai/embed.js"
  data-user="<your-handle>"
  data-event-type="<event-slug>"
  data-target="#book-here"
></script>
```

`data-user` और `data-event-type` आवश्यक हैं। वैकल्पिक `data-target` उस एलिमेंट के लिए एक CSS सेलेक्टर है जिसमें इनलाइन फ़्रेम माउंट होता है; इसे छोड़ दें तो फ़्रेम ठीक वहीं रेंडर होता है जहाँ स्क्रिप्ट टैग बैठता है। स्क्रिप्ट आपके बुकिंग पेज को एक इनलाइन फ़्रेम के रूप में रेंडर करती है, और यह रेस्पॉन्सिव है — यह उस जगह की चौड़ाई में फ़िट हो जाती है जहाँ भी आप इसे रखते हैं। आपके विज़िटर एक तिथि चुनते हैं, एक स्लॉट चुनते हैं, और आपकी वेबसाइट छोड़े बिना बुक कर लेते हैं।

:::note[अपना सटीक स्निपेट कहाँ से प्राप्त करें]

अपने हैंडल और इवेंट प्रकार के लिए पहले से भरा स्निपेट कॉपी करने के लिए अपने डैशबोर्ड में एम्बेड विकल्प का उपयोग करें, फिर इसे अपनी साइट के उस पेज में चिपकाएँ जहाँ आप बुकिंग विजेट दिखाना चाहते हैं।

:::

## एम्बेड करने के अधिक तरीके

इनलाइन आपका एकमात्र विकल्प नहीं है। वही `embed.js` स्क्रिप्ट कुछ मोड का समर्थन करती है — वह चुनें जो आपके पेज के अनुकूल हो:

- **इनलाइन** — बुकिंग पेज आपके पेज पर एक कंटेनर में बैठता है (ऊपर)।
- **पॉपअप / मोडल** — एक बटन आपके पेज के ऊपर एक ओवरले में आपका बुकिंग पेज खोलता है, इसलिए जब तक कोई बुक करना न चाहे तब तक यह जगह नहीं लेता।
- **फ़्लोटिंग बैज** — हर पेज के कोने में एक स्थिर "Book a time" पिल, जैसे बैज विजेट जो आपने अन्य साइटों पर देखे हैं।
- **किसी भी एलिमेंट पर क्लिक करें** — अपने पास पहले से मौजूद किसी लिंक या बटन में `data-imatic-cal-link="handle/event-type"` जोड़ें, और उस पर क्लिक करने से आपका बुकिंग पेज खुल जाता है। किसी अतिरिक्त बटन की ज़रूरत नहीं।

सभी मोड एक **`theme`** (लाइट या डार्क) और एक **`primaryColor`** स्वीकार करते हैं ताकि विजेट आपके ब्रांड से मेल खाए, और जैसे-जैसे विज़िटर प्रवाह से गुज़रता है, इनलाइन फ़्रेम अपनी सामग्री में फ़िट होने के लिए **स्वतः आकार बदलता** है।

:::note[सटीक स्निपेट कॉपी करें]

जिस मोड को आप चाहते हैं उसके लिए तैयार-बना स्निपेट कॉपी करने के लिए अपने डैशबोर्ड में एम्बेड/साझा विकल्प का उपयोग करें — यह आपके हैंडल, इवेंट प्रकार, और विकल्पों के साथ पहले से भरा आता है।

:::

## अगले कदम

- [आपका सार्वजनिक बुकिंग पेज](./booking-page) — विज़िटर एम्बेड में क्या देखते हैं।
- [इवेंट प्रकार](./event-types) — प्रत्येक एम्बेड के पीछे का लिंक और सेटिंग्स।
- [रूटिंग फ़ॉर्म](./routing-forms) — विज़िटर के बुकिंग पेज पर पहुँचने से पहले उन्हें योग्य बनाएँ।
- [डेवलपर्स](./developers) — API के साथ पूरी तरह कस्टम बुकिंग अनुभव बनाएँ।