Shopify के लिए मैप विजेट

थीम सेक्शन Shopify ऐप से बेहतर क्यों है

ज़्यादातर “मैप ऐप” आपसे इंस्टॉल, आपके स्टोर डेटा तक अनुमतियाँ और महीने का शुल्क माँगते हैं — जबकि आख़िर में मिलता है एक iframe। यह उसका ईमानदार विकल्प है: एक अकेली Liquid फ़ाइल जो आपकी अपनी थीम में रहती है। यह स्टोर की कोई अनुमति नहीं माँगती, आपके पेजों में कोई स्क्रिप्ट नहीं जोड़ती, कहीं कुछ भेजती नहीं, और मुफ़्त है। आपके विज़िटर सिर्फ़ दो बाहरी अनुरोध करते हैं — whatismylocation.ai से आने वाला सैंडबॉक्स्ड मैप iframe और उसकी OpenStreetMap टाइलें। कोई Google कुकी नहीं, कोई कंसेंट-बैनर का झंझट नहीं, और अगर कभी सेवा तक पहुँच न बने तो iframe चुपचाप ख़ाली रह जाता है, आपका पेज नहीं टूटता। सेक्शन फ़ाइल हटा दीजिए और हर निशान मिट जाता है।

whatismylocation-shopify-sections.zip डाउनलोड करें — दोनों सेक्शन और एक README, कुल कुछ किलोबाइट। फिर नीचे दिए इंस्टॉल चरण देखें।

लगभग दो मिनट में इंस्टॉल

दो हिस्से: फ़ाइल एक बार पेस्ट करें, फिर उसे किसी भी बिल्ट-इन सेक्शन की तरह इस्तेमाल करें।

फ़ाइल पेस्ट करें: Shopify एडमिन ▸ Online Store ▸ Themes ▸ ⋯ ▸ Edit code। बाईं साइडबार में Sections के नीचे Add a new section पर क्लिक करें, नाम रखें whatismylocation-map, प्लेसहोल्डर सामग्री हटाएँ, और whatismylocation-map.liquid की पूरी सामग्री पेस्ट करें — नीचे मौजूद {% schema %} ब्लॉक ही आपका सेटिंग्स पैनल बनाता है, इसलिए उसका साथ आना ज़रूरी है। सेव करें।

इस्तेमाल करें: थीम एडिटर खोलें (Customize), अपने संपर्क पेज (या किसी भी पेज) पर जाएँ, Add section दबाएँ और WhatIsMyLocation Map चुनें। सेटिंग्स पैनल बाईं ओर दिखता है; जब तक आप कोऑर्डिनेट्स नहीं डालते, सेक्शन एक सरल प्लेसहोल्डर दिखाता है जो बता देता है कि उसे किस चीज़ की ज़रूरत है।

कोऑर्डिनेट्स मैप-एम्बेड बिल्डर से लें — अपना पता टाइप करें, फिर कॉपी करने से पहले पिन को अपने प्रवेश द्वार पर खींचें। सेक्शन आपके अंतिम कोऑर्डिनेट्स ही भेजता है, इसलिए पिन बाद में कभी खिसक नहीं सकता।

ब्रांच ही ब्लॉक हैं

कई जगहों वाले स्टोर के लिए सबसे बढ़िया हिस्सा यही है: थीम एडिटर में हर ब्रांच एक ब्लॉक है — Add branch दबाएँ, अक्षांश, देशांतर, एक लेबल और पता भरें, और ड्रैग करके क्रम बदलें (10 तक)। नक्शा हर ब्रांच को अपने आप फ़िट कर लेता है, पिन सूची से मेल खाते नंबरों में दिखते हैं, और विज़िटर को मिलता है लोकेशन पैनल — डेस्कटॉप पर नक्शे के बगल में अकॉर्डियन, फ़ोन पर स्वाइप होने वाली कार्ड-पट्टी, हर ब्रांच के लिए दिशा-निर्देश और वैकल्पिक “Open in Google Maps / Apple Maps” आइकन के साथ। पैनल का लेआउट (auto, साइड, नीचे, कोई नहीं) और स्विच एनिमेशन (स्मूद, फ़ेड, जीवंत, कोई नहीं — reduce-motion सेटिंग वाले विज़िटर को हमेशा तुरंत बदलने वाला रूप मिलता है) उसी पैनल में ड्रॉपडाउन के रूप में हैं।

हर सेटिंग, एक नज़र में

उसी zip में whatismylocation-widget.liquid भी है — find-my-location विजेट एक दूसरे सेक्शन के रूप में (थीम, कॉम्पैक्ट/फ़ुल मोड, ऊँचाई), डिलीवरी पेजों और स्टोर फ़ाइंडर के लिए।

समस्या-निवारण

Add section में सेक्शन दिखता ही नहीं। फ़ाइल Sections में होनी चाहिए (Snippets या Assets में नहीं) और पेस्ट में पूरी फ़ाइल आनी चाहिए — अगर {% schema %} ब्लॉक कट गया, तो Shopify सेक्शन को अस्वीकार कर देता है या छिपा देता है। पूरी फ़ाइल दोबारा पेस्ट करें और सेव करें।

सेव करते समय “Invalid schema” त्रुटि। यह अधूरे पेस्ट का संकेत है — अक्सर नीचे तक चयन करते समय एक पंक्ति छूट जाने से बंद होने वाला ब्रेस गायब रह जाता है। पूरी फ़ाइल फिर से पेस्ट करें; Liquid की जानकारी न हो तो schema को हाथ से न बदलें।

नक्शा धूसर दिख रहा है। मैप टाइलें tile.openstreetmap.org से आती हैं; कोई सख़्त ऐड-ब्लॉकर या कंपनी का नेटवर्क उन्हें रोक सकता है। मोबाइल डेटा पर फ़ोन से जाँचें — आपके ग्राहकों को यह लगभग निश्चित रूप से ठीक दिखता है।

पिन मेरे दरवाज़े पर नहीं है। बिल्डर में कोऑर्डिनेट्स दोबारा बनाएँ, पिन को अपने प्रवेश द्वार पर खींचें, और नए मान सेक्शन सेटिंग्स में पेस्ट करें।

बदलाव लाइव स्टोर पर नहीं दिखते। आपने ड्राफ़्ट या अप्रकाशित थीम में बदलाव किया है — बदलाव प्रकाशित थीम में करें (या जिसे संपादित किया है उसे प्रकाशित करें)। विजेट में कैश करने लायक कुछ है ही नहीं।