शॉपिफ़

Question

पर कस्टम सीएसएस और जेएस जोड़ना मैं 'अटलांटिक' थीम का उपयोग करके Shopify पर किसी पृष्ठ के लंबवत टैब प्राप्त करने पर काम कर रहा हूं। चूंकि इस विषय में डिफ़ॉल्ट रूप से लंबवत टैब नहीं हैं, इसलिए मैंने बाहरी जेएस और सीएसएस "jquery-jvert-tabs" का उपयोग किया है।

मेरा सवाल यह है कि, यदि मैं जेएस और सीएसएस फाइलों को संपत्ति के रूप में अपलोड करता हूं, तो मैं उन पृष्ठों को कैसे लिंक करूं जिन पर मैं इनका उपयोग करना चाहता हूं और इसके बाद पृष्ठ पर इनका उपयोग कैसे करना है, अगर मेरे पास है वहां कुछ स्टाइल तत्व भी उपलब्ध हैं?

Answer 1

सीधे शब्दों में संपत्ति फ़ोल्डर में अपने filename.js फ़ाइल अपलोड करें।

{{ 'filename.js' | asset_url | script_tag }} 

वैसे, आप अपने फ़ाइल का नाम बदलने और .liquid विस्तार

filename.js.liquid 

गुड लक जोड़ना चाहिए:

तो अनुभाग अपने theme.liquidसिर में निम्नलिखित ड्रॉप!

Answer 2

यदि मैं सही ढंग से समझता हूं, तो asset_url filter वह है जिसे आप ढूंढ रहे हैं।

एक .liquid फ़ाइल में एक जे एस फ़ाइल को शामिल करने के लिए आप का उपयोग करें:

{{ 'script.js' | asset_url | script_tag }} 

और एक सीएसएस फ़ाइल:

{{ 'style.css' | asset_url | stylesheet_tag }} 

Answer 3

यदि आप वैश्विक नामस्थान को प्रदूषित नहीं करना चाहते हैं तो आप जावास्क्रिप्ट या सीएसएस को कुछ क्षेत्रों में प्रतिबंधित कर सकते हैं।

Shopify उस पृष्ठ के साथ-साथ हैंडल के साथ एक सरल कथन का उपयोग करता है (www.foo.com/abcd/bar - "bar" हैंडल होगा)।

{% if page.handle == "bar" %} 
    {{ 'your_custom_javascript.js' | asset_url | script_tag }} 
    {{ 'your_custom_css.css' | asset_url | stylesheet_tag }} 
{% endif %} 

यदि आप कुछ पृष्ठों में छोटे बदलाव करना चाहते हैं तो यह बेहद उपयोगी है।