Squarespace

Squarespace कस्टम HTML और JavaScript को सपोर्ट करता है, जिसका मतलब है कि आप बिना किसी प्लगइन के सीधे अपनी साइट में कोई भी Wink वेब कंपोनेंट एम्बेड कर सकते हैं। यह गाइड आपको दिखाता है कि Wink स्क्रिप्ट्स को साइट-वाइड कैसे लोड करें और फिर व्यक्तिगत पेजों पर कंपोनेंट्स कैसे रखें।

Wink स्क्रिप्ट्स को साइट-वाइड लोड करें

स्क्रिप्ट्स को आपकी साइट के ग्लोबल फुटर और हेडर में जोड़ने का मतलब है कि Wink हर पेज पर उपलब्ध होगा बिना बार-बार सेटअप किए।

Squarespace एडिटर में जाएं, फिर Settings → Advanced → Code Injection पर जाएं।
Header फील्ड में स्टाइलशीट जोड़ें:
```
<link rel="stylesheet" href="https://elements.wink.travel/styles.css">
```
Footer फील्ड में स्क्रिप्ट और एप्लिकेशन लोडर जोड़ें (यहाँ YOUR_CLIENT_ID को अपने Wink क्लाइंट ID से बदलें):
```
<script src="https://elements.wink.travel/elements.js" type="module" defer></script>
<wink-app-loader client-id="YOUR_CLIENT_ID"></wink-app-loader>
```
Save पर क्लिक करें।

किसी पेज पर कंपोनेंट जोड़ें

एक बार स्क्रिप्ट्स ग्लोबली लोड हो जाने के बाद, आप किसी भी Wink कंपोनेंट को किसी भी पेज पर Code Block का उपयोग करके डाल सकते हैं।

उस पेज को खोलें जिसे आप एडिट करना चाहते हैं।
Edit पर क्लिक करें और उस जगह एक नया Code ब्लॉक जोड़ें जहाँ आप कंपोनेंट दिखाना चाहते हैं।
कंपोनेंट HTML पेस्ट करें, उदाहरण के लिए एक कंटेंट लोडर:
```
<wink-content-loader
  layout="HOTEL"
  id="YOUR_LAYOUT_ID"
></wink-content-loader>
```
Apply फिर Save पर क्लिक करें।

उपलब्ध कंपोनेंट्स

कंपोनेंट	HTML टैग	उद्देश्य
कंटेंट लोडर	`<wink-content-loader>`	होटल कार्ड, ग्रिड, मैप दिखाना
लुकअप	`<wink-lookup>`	डेस्टिनेशन के लिए सर्च बार
सर्च बटन	`<wink-search-button>`	यात्रा चयनकर्ता खोलना
अकाउंट बटन	`<wink-account-button>`	साइन इन / यूजर मेनू
यात्रा बटन	`<wink-itinerary-button>`	वर्तमान यात्रा दिखाना
यात्रा चयनकर्ता	`<wink-itinerary-picker>`	पूरा यात्रा फॉर्म
शॉपिंग कार्ट	`<wink-shopping-cart-button>`	कार्ट सारांश बटन

प्रत्येक कंपोनेंट के लिए पूर्ण एट्रिब्यूट संदर्भ के लिए Web Components देखें।