अपने Shopify स्टोर पर हीटमैप कैसे इंस्टॉल करें (कोई ऐप ज़रूरी नहीं, बस एक लाइन कोड)

आर्टिकल सारांश

Shopify में हीटमैप जोड़ने के लिए बस theme.liquid में एक लाइन कोड पेस्ट करनी होती है — किसी ऐप को इंस्टॉल करने की ज़रूरत नहीं

एडिट करने से पहले हमेशा अपनी थीम को बैकअप के तौर पर डुप्लिकेट करें। सेव करते ही बदलाव लागू हो जाते हैं — STUDIO के उलट, इसमें अलग से री-पब्लिश करने का स्टेप नहीं है

चेकआउट पेज थीम कोड नहीं चलाते, इसलिए वे ट्रैक नहीं होते। सफलता का मतलब है HeatMapX डैशबोर्ड में गिनती का वाकई बढ़ना — सिर्फ "कोई एरर नहीं आया" इसका मतलब नहीं है

क्या आप सोच रहे हैं कि बिना कोई ऐप इंस्टॉल किए अपने Shopify स्टोर में हीटमैप जोड़ा जा सकता है? हां, जोड़ा जा सकता है। Shopify आपको सीधे अपनी थीम में एक लाइन टैग कोड पेस्ट करने देता है, बिना किसी ऐप की ज़रूरत के। इस गाइड में हम पहले जो बैकअप स्टेप हमेशा करना चाहिए वह, टैग कैसे जोड़ें, यह कैसे कन्फर्म करें कि यह काम कर रहा है, और कुछ ऐसी बातें जिनका ध्यान रखना चाहिए — यह सब बताएंगे।

स्टेप 1: अपनी साइट की (Site Key) लें

सबसे पहले, HeatMapX पर साइन अप करें (फ्री प्लान उपलब्ध है), अपना स्टोर रजिस्टर करें, और अपनी साइट की (site key) प्राप्त करें। इसके लिए क्रेडिट कार्ड की ज़रूरत नहीं है।

साइट की मिलने के बाद, नीचे दिया गया टैग इस्तेमाल करें, बस YOUR_SITE_KEY की जगह आपको दी गई असली की डालें।

<script src="https://heatmapx.com/tracker.js" data-site-key="YOUR_SITE_KEY"></script>

स्टेप्स: theme.liquid में टैग जोड़ें

1. (ज़रूरी) अपनी थीम को बैकअप के तौर पर डुप्लिकेट करें

कोड सीधे एडिट करने से पहले, हमेशा पहले अपनी मौजूदा थीम को डुप्लिकेट करें। अपने Shopify एडमिन में, Online Store → Themes पर जाएं, अपनी पब्लिश की गई थीम ढूंढें, "…" (actions) मेन्यू पर क्लिक करें, और Duplicate चुनें। इससे आपके पास एक सुरक्षित कॉपी रहती है जिस पर वापस जा सकते हैं अगर कुछ गलत हो जाए। यह स्टेप छोड़ने का मतलब है कि गलत एडिट को वापस पलटने का आपके पास कोई तरीका नहीं होगा।

2. कोड एडिटर खोलें

अपने Shopify एडमिन में, Online Store → Themes पर जाएं
अपनी पब्लिश की गई थीम पर, "…" (actions) मेन्यू पर क्लिक करें और Edit code चुनें
बाईं ओर आपकी थीम का फ़ाइल ब्राउज़र खुल जाएगा

3. layout/theme.liquid के अंदर टैग जोड़ें

फ़ाइल लिस्ट में, "Layout" फ़ोल्डर खोलें और theme.liquid पर क्लिक करें
फ़ाइल में </head> सर्च करें और ऊपर दिया गया टैग उसके ठीक पहले पेस्ट करें
फ़ाइल सेव करें

4. सेव करना ही काफी है — री-पब्लिश करने की ज़रूरत नहीं

Shopify में, थीम कोड एडिट करते ही सेव करने के साथ तुरंत लागू हो जाता है। STUDIO के उलट, इसमें अलग से "publish" या "re-publish" करने का स्टेप नहीं है। सेव करते ही, आपके लाइव स्टोर में टैग पहले से लोड हो चुका होता है।

यह कैसे कन्फर्म करें कि यह वाकई काम कर रहा है

टैग जोड़ने के बाद, अपने स्टोर के कुछ पेज खुद ब्राउज़ करें। लेकिन यहां सबसे ज़रूरी बात यह है।

बिना किसी एरर के पेज लोड होना, और ट्रैकिंग का वाकई काम करना — दोनों एक बात नहीं हैं। भले ही आपके ब्राउज़र कंसोल में कुछ भी गलत न दिखे, गलत टाइप की गई साइट की या गलत जगह पेस्ट किया गया टैग इसका मतलब हो सकता है कि कोई डेटा HeatMapX तक पहुंच ही नहीं रहा।

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

किन बातों का ध्यान रखें

चेकआउट पेज ट्रैक नहीं होते

आपने theme.liquid में जो टैग जोड़ा है वह आपके स्टोरफ्रंट पर चलता है — होमपेज, प्रोडक्ट पेज, कलेक्शन पेज, और कार्ट — लेकिन यह चेकआउट पेजों पर नहीं चलता (/checkouts/ के अंतर्गत पेमेंट पेज)। चेकआउट सीधे Shopify द्वारा होस्ट किया जाता है, आपकी थीम से अलग, और theme.liquid का थीम कोड वहां कभी लोड नहीं होता। अगर आपको अपने डैशबोर्ड में चेकआउट पेजों के लिए कोई डेटा न दिखे, तो यह अपेक्षित व्यवहार है, कोई गड़बड़ी नहीं।

थीम बदलने पर टैग फिर से जोड़ना होगा

टैग सिर्फ उस थीम की theme.liquid फ़ाइल में मौजूद होता है जिसे आपने एडिट किया था। अगर आप बाद में किसी दूसरी थीम पर स्विच करते हैं (एक नई थीम पब्लिश करते हैं), तो उसकी theme.liquid में टैग अपने आप नहीं आएगा। जब भी थीम बदलें, नई थीम में टैग जोड़ने के लिए वही स्टेप्स दोहराएं।

अक्सर पूछे जाने वाले सवाल

सवाल. क्या इससे मेरा स्टोर धीमा हो जाएगा? जवाब. टैग असिंक्रोनसली (asynchronously) लोड होता है और हल्का है, इसलिए पेज लोड स्पीड पर इसका असर न के बराबर होता है।

सवाल. मैंने टैग जोड़ दिया है, लेकिन डैशबोर्ड में गिनती नहीं बढ़ रही जवाब. सबसे आम वजह है साइट की का मेल न खाना — किसी दूसरी साइट की की पेस्ट हो जाना, या कॉपी करते समय कोई कैरेक्टर छूट जाना। साथ ही यह भी चेक करें कि जिन पेजों को आप टेस्ट कर रहे हैं वे स्टोरफ्रंट पेज हों (होम, प्रोडक्ट, कलेक्शन) न कि चेकआउट पेज, क्योंकि चेकआउट कभी ट्रैक नहीं होता।

अंत में

Shopify में हीटमैप जोड़ना बस theme.liquid में एक लाइन कोड पेस्ट करने जितना आसान है — किसी ऐप की ज़रूरत नहीं। HeatMapX फ्री में शुरू किया जा सकता है, तो इसे आज़माएं और देखें कि खरीदार वाकई आपके स्टोर का अनुभव कैसे कर रहे हैं।