थीम कोड एडिट करणे

तुम्ही कोड एडिटरद्वारे तुमच्या ऑनलाइन स्टोअरमध्ये सविस्तर बदल करण्यासाठी तुमचा थीम कोड एडिट करू शकता. थीम तयार करणाऱ्या बहुतेक फाईल्समध्ये Shopify ची टेम्पलेटिंग भाषा, Liquid समाविष्ट असते. थीम फाईल्समध्ये HTML, CSS, JSON आणि JavaScript देखील असते. तुम्हाला HTML आणि CSS माहीत असेल आणि Liquid ची मूलभूत समज असेल तरच थीमसाठी कोड एडिट करा.

तुम्ही तुमची थीम खरेदी केल्यानंतरच तिचा कोड एडिट करू शकता. यामध्ये थीम एडिटरमधील AI कोड जनरेटर वापरणे समाविष्ट आहे. तुम्ही सशुल्क थीमची चाचणी आवृत्ती वापरत असल्यास, तुम्ही कोडमध्ये बदल करण्यापूर्वी तुम्हाला ती खरेदी करणे आवश्यक आहे.

सावधानता

तुमची थीम कस्टमाइझ करण्याची तयारी करण्यासाठी, खालील शिफारस केलेली कामे पूर्ण करा:

बॅकअप कॉपी तयार करण्यासाठी तुमची थीम डुप्लिकेट करा. यामुळे तुमचे बदल टाकून देणे आणि गरज पडल्यास पुन्हा सुरू करणे सोपे होते.
सपोर्टची कोणती पातळी उपलब्ध आहे हे तुम्हाला समजल्याची खात्री करा.
इमेजेस अपलोड करण्यासाठी आवश्यक अटी आणि सर्वोत्तम पद्धतींबद्दल जाणून घ्या.

कोड एडिटर तुमच्या थीमच्या फाईल्सची डिरेक्टरी आणि फाईल्स प्रदर्शित करण्यासाठी तसेच एडिट करण्यासाठी जागा दाखवतो. जेव्हा तुम्ही डिरेक्टरीमधील एखाद्या फाईलवर क्लिक करता, तेव्हा ती कोड एडिटरमध्ये उघडते. तुम्ही एकाच वेळी अनेक फाईल्स उघडू आणि एडिट करू शकता. तुम्ही एकाच वेळी अनेक फाईल्स उघडून त्यांचे पुनरावलोकन देखील करू शकता.

या पेजवर

तुमचा थीम कोड एडिट करा

तुमच्या थीमच्या फाईल्समध्ये बदल करण्यासाठी तुम्ही कोड एडिटर वापरू शकता.

पायऱ्या:

डेस्कटॉप

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.

मोबाईल

Shopify अ‍ॅप मधून, आयकनवर टॅप करा.
विक्री चॅनेल विभागात, ऑनलाइन स्टोअर वर टॅप करा.
थीम्स मॅनेज करा वर टॅप करा.
> कोड एडिट करा वर टॅप करा.

बदल सेव्ह करणे

जेव्हा तुम्ही एखादी फाईल एडिट करता, तेव्हा सेव्ह न केलेले बदल दर्शवण्यासाठी टॅबच्या नावासमोर एक बिंदू (डॉट) दिसतो. तुमचे बदल सेव्ह करण्यासाठी सेव्ह करा बटणावर क्लिक करा. तुमचे बदल सेव्ह करण्यासाठी तुम्ही Mac वर ⌘ + S किंवा Windows वर Ctrl + S देखील टाकू शकता.

सेव्ह करा बटणाशेजारी सेव्ह न केलेली फाईल दर्शवणारा अंशतः कोड एडिटर

थीम कोड फॉरमॅट करणे

कोड इंडेंटेशन दुरुस्त करण्यासाठी, Mac वर ⌘ + Shift + P किंवा Windows वर Ctrl + Shift + P वापरून कमांड पॅलेट उघडा, format टाका आणि त्यानंतर डॉक्युमेंट फॉरमॅट करा निवडा.

पायऱ्या:

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.
तुम्हाला फॉरमॅट करायची असलेली फाईल उघडा.
Mac वर ⌘ + P किंवा Windows वर Ctrl + P एंटर करा.
कमांड पॅलेटमध्ये, format टाका आणि त्यानंतर तुमच्या कीबोर्डवर Enter दाबा.
फाईल सेव्ह करा.

कोड फॉरमॅटिंग पर्याय निवडलेले कमांड पॅलेट

फाईल बदलांचा मागोवा घेणे

सुधारित थीम फाईल मागील आवृत्तीवर रिस्टोअर करण्यासाठी, त्या फाईलसाठी टाइमलाइन व्ह्यू वापरा.

टाइमलाइन व्ह्यू एका वेळी एक अस्तित्वात असलेली फाईल रिस्टोअर करतो. तो संपूर्ण थीम रिस्टोअर करत नाही आणि हटवलेल्या थीम फाईल्स रिकव्हर करू शकत नाही. टाइमलाइन इतिहास मर्यादित असतो, त्यामुळे जुन्या आवृत्त्या कदाचित उपलब्ध नसतील.

रिस्टोअर केल्याने संपूर्ण फाईल सामग्री बदलली जाते, ज्यामध्ये तुम्हाला ठेवायचे असलेले बदलही असू शकतात. फाईल रिस्टोअर करण्यापूर्वी, तुम्हाला कोणतेही बदल ठेवायचे असल्यास वर्तमान फाईल सामग्री सुरक्षित ठिकाणी कॉपी करा.

पायऱ्या:

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.
तुम्हाला रिव्ह्यू करायची किंवा रिस्टोअर करायची असलेली अस्तित्वात असलेली फाईल उघडा.
ऐच्छिक: तुम्हाला कोणतेही वर्तमान बदल ठेवायचे असल्यास, रिस्टोअर करण्यापूर्वी वर्तमान फाईल सामग्री सुरक्षित ठिकाणी कॉपी करा.
टाइमलाइन व्ह्यूमध्ये, तफावतींची तुलना करण्यासाठी टाइमलाइनमधील एंट्रीवर क्लिक करा.
निवडलेल्या मागील आवृत्तीसह संपूर्ण फाईल सामग्री बदलण्यासाठी, टाइमलाइन एंट्रीवर राईट-क्लिक करा आणि त्यानंतर सामग्री रिस्टोअर करा निवडा.
रिस्टोअर करा वर क्लिक करा.

थीम चेक

कोड एडिटरमध्ये थीम चेकचा समावेश आहे, जे एक वैशिष्ट्य आहे जे तुमच्या लाईव्ह थीममध्ये एरर शोधण्याऐवजी, कोड लिहिला जात असताना तात्काळ अभिप्राय देऊन एरर टाळण्यास मदत करते.

कोड एडिटरमध्ये, थीम चेक एडिट केलेल्या कोडमधील खालील एरर ओळखू शकते:

पार्सर ब्लॉकिंग स्क्रिप्ट्स, ज्या स्टोअरफ्रंटचा वेग कमी करू शकतात
भाषांतर फाईल्समधील विसंगती, जसे की गहाळ भाषांतर की किंवा लोकॅल फाईलमध्ये न जुळणारी भाषांतरे
गहाळ टेम्पलेट्स

कोडच्या खालील लाल रेषेद्वारे एरर दर्शविल्या जातात. एरर पाहण्यासाठी, हायलाईट केलेल्या रेषेवर तुमचा माउस फिरवा.

कोड एडिटरमध्ये शोधणे आणि बदलणे (रिप्लेस करणे)

तुम्ही कोड एडिटरमध्ये खालीलपैकी कोणत्याही प्रकारे शोधू शकता:

एखाद्या विशिष्ट फाईलचा कोड शोधा.
थीममधील सर्व फाईल्सचा कोड शोधा.

तुम्ही एखाद्या विशिष्ट फाईलमधील किंवा सर्व थीम फाईल्समधील एकाधिक ठिकाणी कोड रिप्लेस देखील करू शकता. फाईल उघडण्यासाठी तुम्ही नावाने फाईल शोधू देखील शकता.

फाईलमध्ये शोधणे

तुम्ही विशिष्ट फाईलमध्ये कोड शोधू शकता आणि कोड रिप्लेस करू शकता. कोडच्या प्रत्येक उदाहरणाचे (इन्स्टन्सचे) पुनरावलोकन करण्यासाठी बाण (अॅरो) की वापरा.

तुम्ही कोड शोधल्यानंतर, तुम्ही फाईलमध्ये कोड रिप्लेस करू शकता.

पायऱ्या:

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.
तुम्हाला शोधायची असलेली फाईल उघडा.
Mac वर ⌘ + F किंवा Windows वर Ctrl + F एंटर करा.
शोधा फील्डमध्ये, तुमची सर्च टर्म टाका.
ऐच्छिक: कोड रिप्लेस करण्यासाठी, खालील कृती पूर्ण करा:

शोध मोडलमध्ये, आयकनवर क्लिक करा.
रिप्लेस करा फील्डमध्ये, रिप्लेसमेंट कोड टाका. रिप्लेसमेंट कोडचे कॅपिटलायझेशन अस्तित्वात असलेल्या इन्स्टन्सशी जुळवण्यासाठी तुम्ही केस जतन करा वर क्लिक करू शकता.
एका वेळी एक इन्स्टन्स रिप्लेस करण्यासाठी रिप्लेस करा आयकनवर क्लिक करा, किंवा एकाच वेळी सर्व इन्स्टन्सेस रिप्लेस करण्यासाठी सर्व रिप्लेस करा आयकनवर क्लिक करा.

सर्व फाईल्समध्ये शोधणे

सर्व थीम फाईल्समध्ये शोधण्यासाठी डाव्या साईडबारमधील शोध बटणावर क्लिक करा. परिणाम तुमची सर्च टर्म कुठे कुठे आली आहे ते प्रत्येक इन्स्टन्स आणि ती कोणत्या फाईलमध्ये दिसते ते दर्शवतात.

पायऱ्या:

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.
शोध पॅनेल उघडण्यासाठी आयकनवर क्लिक करा.
शोधा फील्डमध्ये, तुमची सर्च टर्म टाका.
ऐच्छिक: कोड रिप्लेस करण्यासाठी, खालील कृती पूर्ण करा:

शोध मोडलमध्ये, आयकनवर क्लिक करा.
रिप्लेस करा फील्डमध्ये, रिप्लेसमेंट कोड टाका.
एका वेळी एक इन्स्टन्स किंवा एकाच वेळी सर्व इन्स्टन्सेस रिप्लेस करा.

प्रगत शोध पर्याय

तुमचे शोध परिणाम मर्यादित करण्यासाठी, खालीलपैकी एक किंवा अधिक शोध पर्याय वापरा:

Match case केसशी अचूक जुळणारे शोध शब्द दाखवते. उदाहरणार्थ, तुम्ही product एंटर केल्यास, शोधामध्ये “product” किंवा “Product” चे कोणतेही उल्लेख हायलाइट केले जातात. तुम्ही Match case निवडल्यास, शोधामध्ये फक्त product चे उल्लेख हायलाइट केले जातात.
Match Whole Word तंतोतंत शब्दाशी जुळणारे शोध शब्द दाखवते आणि अंशतः जुळणारे शब्द वगळते. उदाहरणार्थ, तुम्ही cart एंटर केल्यास, शोधामध्ये “cart” चे उल्लेख हायलाइट केले जातात पण “carton” चे नाहीत.
Use Regular Expression रेग्युलर एक्स्प्रेशनशी (regex) जुळणारे शोध निकाल दाखवते. regex ही कॅरेक्टर्सची अशी एक स्ट्रिंग असते, जी मजकुरातील जुळणारा पॅटर्न निर्दिष्ट करते.

Search पॅनेलमध्ये, शोध निकालांमध्ये समाविष्ट करण्यासाठी किंवा वगळण्यासाठी तुम्ही फाईल्स आणि फोल्डर्सदेखील निवडू शकता.

प्रगत मेनू उघडण्यासाठी वर क्लिक करा. तुम्ही files to include किंवा files to exclude फील्ड्समध्ये कोणत्याही फाईल किंवा फोल्डरचा पाथ एंटर करू शकता. एकापेक्षा जास्त फाईल किंवा फोल्डर जोडण्यासाठी, त्यांना स्पेस आणि स्वल्पविरामाने वेगळे करा. उदाहरणार्थ, sections फोल्डरमधील फाईल्स शोधण्यासाठी, files to include फील्डमध्ये ./sections एंटर करा.

तुम्ही फाईल डिरेक्टरी व्ह्यूमधून विशिष्ट फोल्डरमध्येदेखील शोधू शकता. फोल्डरवर राईट-क्लिक करा आणि नंतर ड्रॉपडाउन मेनूमधून Find in folder... निवडा.

थीम फाईल्स व्यवस्थापित करणे

तुम्ही तुमच्या थीम कोडमधील फाईल्स व्यवस्थापित करू शकता. तुम्ही फाईल्स हटवू शकता, नवीन फाईल्स जोडू शकता, फाईल्सना नवीन नाव देऊ शकता आणि मागील आवृत्ती उपलब्ध असेल तेव्हा बदललेल्या विद्यमान कोड फाईल्स त्यांच्या Timeline व्ह्यूमधून रिस्टोअर करू शकता. assets फोल्डरमधील इमेजेस, CSS, JavaScript आणि फॉन्ट्स यांसारख्या ॲसेट फाईल्सचा कोणताही टाइमलाइन इतिहास नसतो.

थीम फाईल उघडणे

थीम फाईल उघडण्यासाठी, फोल्डरवर क्लिक करा आणि नंतर एक्सप्लोररमधून फाईलच्या नावावर क्लिक करा. तुम्ही फाईल्स त्यांच्या नावाने किंवा एक्स्टेंशनने शोधून ती फाईल उघडूदेखील शकता.

पायऱ्या:

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.
Mac वर ⌘ + P किंवा Windows वर Ctrl + P एंटर करा.
सर्च बारमध्ये फाईलचे नाव एंटर करून फाईल निवडा किंवा Recently opened सूचीमधून फाईल निवडा.

नवीन थीम फाईल जोडणे

फाईल जोडण्यासाठी, एखादे फोल्डर निवडा, New file आयकनवर क्लिक करा आणि नंतर फाईलचे नाव आणि फाईल एक्स्टेंशन एंटर करा.

फाईलच्या नावांमध्ये A-Z, 0-9 हे कॅरेक्टर्स असू शकतात आणि त्यामध्ये स्पेस असू शकत नाही. शब्द डॅश किंवा अंडरस्कोरने वेगळे करा. फाईल एक्स्टेंशन पिरेड . आणि एक्स्टेंशनच्या प्रकाराने निश्चित केले जाते. उदाहरणार्थ, .liquid किंवा .css.

पायऱ्या:

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.
ज्या फोल्डरमध्ये तुम्हाला नवीन फाईल जोडायची आहे, त्यावर क्लिक करा.
फोल्डरच्या नावावर राईट-क्लिक करा आणि ड्रॉप-डाउन मेनूमधून New file... निवडा.
फाईलसाठी नवीन नाव एंटर करा.
तुमच्या कीबोर्डवरील Enter दाबा.

नवीन ॲसेट अपलोड करणे

तुम्ही कोड एडिटरच्या assets फोल्डरमध्ये आयकन किंवा इमेज फाईलसारखी एखादी नवीन ॲसेट अपलोड करू शकता.

पायऱ्या:

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.
assets फोल्डरवर राईट-क्लिक करा.
Upload... वर क्लिक करा.
तुम्हाला जी फाईल अपलोड करायची आहे, ती निवडा.
Open वर क्लिक करा.

थीम फाईलचे नाव बदलणे

फाईलचे नाव बदलण्यासाठी तुम्ही त्यावर राईट-क्लिक करू शकता. फाईल एक्स्टेंशन संपादित किंवा हटवले जाणार नाही याची खात्री करा. फाईल एक्स्टेंशन पिरेड . आणि एक्स्टेंशनच्या प्रकाराने निश्चित केले जाते. उदाहरणार्थ, .liquid किंवा .css. फाईलच्या नावांमध्ये A-Z, 0-9 हे कॅरेक्टर्स असू शकतात आणि त्यामध्ये स्पेस असू शकत नाही. शब्द डॅश किंवा अंडरस्कोरने वेगळे करा. फाईलचे नाव अवैध असल्यास, नवीन फाईलचे नाव सेव्ह केले जाणार नाही.

पायऱ्या:

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.
फाईलवर राईट-क्लिक करा आणि ड्रॉप-डाउन मेनूमधून Rename... निवडा.
फाईलसाठी नवीन नाव एंटर करा.
तुमच्या कीबोर्डवरील Enter दाबा.

थीम फाईल हटवणे

तुम्ही तुमच्या थीिममधील कोणत्याही फाईल्स हटवू शकता. हटवलेल्या थीम फाईल्स परत मिळवता येत नाहीत.

पायऱ्या:

तुमच्या Shopify ॲडमिन मधून, ऑनलाइन स्टोअर वर जा.
> कोड एडिट करा वर क्लिक करा.
फाईलवर राईट-क्लिक करा आणि ड्रॉप-डाउन मेनूमधून Delete permanently निवडा.
Delete वर क्लिक करा.