# എംബെഡുകളും പങ്കിടലും


# എംബെഡുകളും പങ്കിടലും

നിങ്ങളുടെ [ഇവന്റ് തരങ്ങൾ](./event-types) സജ്ജമായാൽ, ബുക്ക് ചെയ്യപ്പെടുന്നത് നിങ്ങളുടെ പേജ് ആളുകൾക്ക് മുന്നിൽ എത്തിക്കുന്നതിനെക്കുറിച്ചാണ്. നിങ്ങൾക്ക് എവിടെയും ഒരു സാധാരണ ലിങ്ക് പങ്കിടാം, അല്ലെങ്കിൽ നിങ്ങളുടെ സ്വന്തം വെബ്സൈറ്റിനുള്ളിൽ തന്നെ ബുക്കിംഗ് പേജ് എംബെഡ് ചെയ്യാം.

## ഒരു ലിങ്ക് പങ്കിടുക

ഓരോ ഇവന്റ് തരത്തിനും അതിന്റേതായ ഒരു ലിങ്ക് ഉണ്ട്, നിങ്ങളുടെ ഹാൻഡിലിൽ നിന്നും ഇവന്റ് സ്ലഗ്ഗിൽ നിന്നും നിർമ്മിച്ചത് — ഉദാഹരണത്തിന് `calendar.imatic.ai/book/priya/intro-call`.

1. ഇവന്റ് തരം തുറക്കുക (അല്ലെങ്കിൽ നിങ്ങളുടെ പട്ടികയിൽ കണ്ടെത്തുക).
2. **Copy link** ഉപയോഗിക്കുക.
3. ഇത് ഒരു ഇമെയിലിലോ, നിങ്ങളുടെ ഇമെയിൽ സിഗ്നേച്ചറിലോ, ഒരു സോഷ്യൽ ബയോയിലോ, ഒരു ചാറ്റ് സന്ദേശത്തിലോ ഒട്ടിക്കുക — എവിടെയും.

ആ ലിങ്ക് ആ ഇവന്റ് തരത്തിനായുള്ള നിങ്ങളുടെ [പൊതു ബുക്കിംഗ് പേജ്](./booking-page) തുറക്കുന്നു.

:::tip[ഓരോ മീറ്റിംഗിനും ഒരു ലിങ്ക്]

ഒരു സാമാന്യ പേജിന് പകരം, നിങ്ങൾ ആഗ്രഹിക്കുന്ന മീറ്റിംഗിനായുള്ള നിർദ്ദിഷ്ട ഇവന്റ്-തരം ലിങ്ക് പങ്കിടുക. "Intro call" ലിങ്ക് അയയ്ക്കുന്നത് ക്ഷണിതാക്കൾ നേരെ ശരിയായ മീറ്റിംഗിൽ എത്തുമെന്ന് അർത്ഥമാക്കുന്നു.

:::

## നിങ്ങളുടെ ബുക്കിംഗ് പേജ് എംബെഡ് ചെയ്യുക

ആളുകൾ നിങ്ങളുടെ സൈറ്റ് വിടാതെ ബുക്ക് ചെയ്യണമെന്ന് ആഗ്രഹിക്കുന്നുണ്ടോ? നിങ്ങളുടെ ബുക്കിംഗ് പേജ് **inline** ആയി എംബെഡ് ചെയ്യുക, അതിനാൽ അത് നിങ്ങളുടെ പേജിന്റെ ഭാഗമായി കാണപ്പെടുന്നു.

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` സ്ക്രിപ്റ്റ് കുറച്ച് മോഡുകൾ പിന്തുണയ്ക്കുന്നു — നിങ്ങളുടെ പേജിന് യോജിക്കുന്നത് തിരഞ്ഞെടുക്കുക:

- **Inline** — ബുക്കിംഗ് പേജ് നിങ്ങളുടെ പേജിലെ ഒരു കണ്ടെയ്നറിൽ ഇരിക്കുന്നു (മുകളിൽ).
- **Popup / modal** — ഒരു ബട്ടൺ നിങ്ങളുടെ ബുക്കിംഗ് പേജ് നിങ്ങളുടെ പേജിന് മുകളിലുള്ള ഒരു ഓവർലേയിൽ തുറക്കുന്നു, അതിനാൽ ആരെങ്കിലും ബുക്ക് ചെയ്യാൻ ആഗ്രഹിക്കുന്നതുവരെ അത് സ്ഥലം എടുക്കില്ല.
- **Floating badge** — മറ്റ് സൈറ്റുകളിൽ നിങ്ങൾ കണ്ടിട്ടുള്ള ബാഡ്ജ് വിജറ്റുകൾ പോലെ, ഓരോ പേജിന്റെയും മൂലയിൽ ഒരു സ്ഥിര "Book a time" പിൽ.
- **Click any element** — നിങ്ങൾക്ക് ഇതിനകം ഉള്ള ഒരു ലിങ്കിലോ ബട്ടണിലോ `data-imatic-cal-link="handle/event-type"` ചേർക്കുക, അത് ക്ലിക്ക് ചെയ്യുന്നത് നിങ്ങളുടെ ബുക്കിംഗ് പേജ് തുറക്കുന്നു. അധിക ബട്ടൺ ആവശ്യമില്ല.

എല്ലാ മോഡുകളും വിജറ്റ് നിങ്ങളുടെ ബ്രാൻഡുമായി പൊരുത്തപ്പെടാൻ ഒരു **`theme`** (light അല്ലെങ്കിൽ dark)-ഉം ഒരു **`primaryColor`**-ഉം സ്വീകരിക്കുന്നു, ഒപ്പം സന്ദർശകൻ പ്രവാഹത്തിലൂടെ നീങ്ങുമ്പോൾ അതിന്റെ ഉള്ളടക്കത്തിന് യോജിക്കാൻ ഇൻലൈൻ ഫ്രെയിം **സ്വയം-വലുപ്പം മാറ്റുന്നു**.

:::note[കൃത്യമായ സ്നിപ്പെറ്റ് പകർത്തുക]

നിങ്ങൾ ആഗ്രഹിക്കുന്ന മോഡിനായുള്ള തയ്യാറായ സ്നിപ്പെറ്റ് പകർത്താൻ നിങ്ങളുടെ ഡാഷ്ബോർഡിലെ embed/share ഓപ്ഷൻ ഉപയോഗിക്കുക — അത് നിങ്ങളുടെ ഹാൻഡിൽ, ഇവന്റ് തരം, ഓപ്ഷനുകൾ എന്നിവ മുൻകൂട്ടി പൂരിപ്പിച്ച് വരുന്നു.

:::

## അടുത്ത ഘട്ടങ്ങൾ

- [നിങ്ങളുടെ പൊതു ബുക്കിംഗ് പേജ്](./booking-page) — എംബെഡിൽ സന്ദർശകർ കാണുന്നത്.
- [ഇവന്റ് തരങ്ങൾ](./event-types) — ഓരോ എംബെഡിനും പിന്നിലെ ലിങ്കും ക്രമീകരണങ്ങളും.
- [റൂട്ടിംഗ് ഫോമുകൾ](./routing-forms) — സന്ദർശകർ ഒരു ബുക്കിംഗ് പേജിൽ എത്തുന്നതിന് മുമ്പ് അവരെ യോഗ്യരാക്കുക.
- [ഡെവലപ്പർമാർ](./developers) — API ഉപയോഗിച്ച് പൂർണ്ണമായും ഇഷ്ടാനുസൃതമായ ഒരു ബുക്കിംഗ് അനുഭവം നിർമ്മിക്കുക.