થીમ કોડ એડિટ કરવો

કોડ એડિટર વડે તમારા ઑનલાઇન સ્ટોરમાં વિગતવાર ફેરફારો કરવા માટે તમે તમારો થીમ કોડ એડિટ કરી શકો છો. થીમ બનાવતી મોટાભાગની ફાઇલોમાં 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 ઍડમિનમાંથી, ઑનલાઇન સ્ટોર પર જાઓ.
> કોડમાં ફેરફાર કરો પર ક્લિક કરો.
તમે જે હાલની ફાઇલનો રિવ્યૂ કરવા અથવા રિસ્ટોર કરવા માગતા હો તેને ખોલો.
વૈકલ્પિક: જો તમે કોઈપણ વર્તમાન ફેરફારો રાખવા માગતા હો, તો રિસ્ટોર કરતા પહેલાં ફાઇલની વર્તમાન સામગ્રી કોઈ સુરક્ષિત જગ્યાએ કૉપિ કરો.
ટાઇમલાઇન વ્યૂમાં, તફાવતોની સરખામણી કરવા માટે ટાઇમલાઇનમાં કોઈ એન્ટ્રી પર ક્લિક કરો.
ફાઇલની સંપૂર્ણ સામગ્રીને પસંદ કરેલા અગાઉના વર્ઝનથી બદલવા માટે, ટાઇમલાઇન એન્ટ્રી પર રાઇટ-ક્લિક કરો અને પછી સામગ્રી રિસ્ટોર કરો પસંદ કરો.
રિસ્ટોર કરો પર ક્લિક કરો.

Theme Check

કોડ એડિટરમાં Theme Check સામેલ છે, આ એક એવું ફીચર છે, જે તમારી લાઇવ થીમમાં ભૂલો શોધવાને બદલે કોડ લખાઈ રહ્યો હોય ત્યારે જ તાત્કાલિક પ્રતિસાદ આપીને ભૂલો અટકાવવામાં મદદ કરે છે.

કોડ એડિટરમાં, Theme Check ફેરફાર કરેલા કોડમાં નીચેની ભૂલો ઓળખી શકે છે:

પાર્સર બ્લૉકિંગ સ્ક્રિપ્ટ્સ, જે સ્ટોરફ્રન્ટને ધીમું કરી શકે છે
અનુવાદની ફાઇલો વચ્ચેની અસંગતતાઓ, જેમ કે લોકેલ ફાઇલમાં અનુવાદની ખૂટતી કી અથવા મેળ ન ખાતા હોય તેવા અનુવાદ
ખૂટતાં ટેમ્પ્લેટ

ભૂલો કોડની નીચે લાલ રેખા દ્વારા દર્શાવવામાં આવે છે. ભૂલ જોવા માટે, તમારા માઉસને હાઇલાઇટ કરેલી રેખા પર લઈ જાઓ.

કોડ એડિટરમાં શોધવું અને બદલવું

તમે નીચેની કોઈપણ રીતે કોડ એડિટરમાં શોધી શકો છો:

કોઈ ચોક્કસ ફાઇલનો કોડ શોધો.
થીમમાં તમામ ફાઇલોનો કોડ શોધો.

તમે કોઈ ચોક્કસ ફાઇલમાં કોડ બદલી શકો છો અથવા બધી થીમ ફાઇલોમાંના બહુવિધ ઇન્સ્ટન્સ બદલી શકો છો. તમે ફાઇલ ખોલવા માટે ફાઇલને નામ દ્વારા પણ શોધી શકો છો.

ફાઇલમાં શોધવું

તમે કોઈ ચોક્કસ ફાઇલમાં કોડ શોધી શકો છો અને કોડ બદલી શકો છો. કોડના દરેક ઇન્સ્ટન્સનો રિવ્યૂ કરવા માટે ઍરો કીનો ઉપયોગ કરો.

કોડ શોધ્યા પછી, તમે ફાઇલમાં કોડ બદલી શકો છો.

પગલાં:

તમારા Shopify ઍડમિનમાંથી, ઑનલાઇન સ્ટોર પર જાઓ.
> કોડમાં ફેરફાર કરો પર ક્લિક કરો.
તમે જેમાં શોધવા માગો છો તે ફાઇલ ખોલો.
Mac પર ⌘ + F અથવા Windows પર Ctrl + F દાખલ કરો.
શોધો ફીલ્ડમાં, તમારો શોધ શબ્દ દાખલ કરો.
વૈકલ્પિક: કોડ બદલવા માટે, નીચેની ક્રિયાઓ પૂર્ણ કરો:

શોધ મોડલમાં, આઇકન પર ક્લિક કરો.
બદલો ફીલ્ડમાં, નવો કોડ દાખલ કરો. નવા કોડના કેપિટલાઇઝેશનને વર્તમાન ઇન્સ્ટન્સ સાથે મેળવવા માટે તમે કેસ જાળવી રાખો પર ક્લિક કરી શકો છો.
એક સમયે એક ઇન્સ્ટન્સ બદલવા માટે બદલો આઇકન પર ક્લિક કરો અથવા એક જ સમયે બધા ઇન્સ્ટન્સ બદલવા માટે બધા બદલો આઇકન પર ક્લિક કરો.

બધી ફાઇલોમાં શોધવું

બધી થીમ ફાઇલોમાં શોધવા માટે ડાબી સાઇડબારમાં શોધ બટન પર ક્લિક કરો. પરિણામોમાં તમારા શોધ શબ્દનો દરેક ઇન્સ્ટન્સ અને તે કઈ ફાઇલમાં દેખાય છે તે બતાવવામાં આવે છે.

પગલાં:

તમારા Shopify ઍડમિનમાંથી, ઑનલાઇન સ્ટોર પર જાઓ.
> કોડમાં ફેરફાર કરો પર ક્લિક કરો.
શોધ પૅનલ ખોલવા માટે આઇકન પર ક્લિક કરો.
શોધો ફીલ્ડમાં, તમારો શોધ શબ્દ દાખલ કરો.
વૈકલ્પિક: કોડ બદલવા માટે, નીચેની ક્રિયાઓ પૂર્ણ કરો:

શોધ મોડલમાં, આઇકન પર ક્લિક કરો.
બદલો ફીલ્ડમાં, નવો કોડ દાખલ કરો.
એક સમયે એક ઇન્સ્ટન્સ અથવા એક જ સમયે બધા ઇન્સ્ટન્સ બદલો.

શોધના ઍડવાન્સ્ડ વિકલ્પો

તમારા શોધ પરિણામોને વધુ ચોક્કસ બનાવવા માટે, નીચેનામાંથી એક અથવા વધુ શોધ વિકલ્પોનો ઉપયોગ કરો:

કેસ સાથે મેળ કરો એવા શોધ શબ્દો રિટર્ન કરે છે જે કેસ સાથે મેળ ખાતા હોય. ઉદાહરણ તરીકે, જો તમે product દાખલ કરો છો, તો શોધ "product" અથવા "Product" ના કોઈપણ ઉદાહરણોને હાઇલાઇટ કરે છે. જો તમે કેસ સાથે મેળ કરો પસંદ કરો છો, તો શોધ માત્ર product ના ઉદાહરણોને જ હાઇલાઇટ કરે છે.
આખા શબ્દ સાથે મેળ કરો એવા શોધ શબ્દો રિટર્ન કરે છે જે ચોક્કસ શબ્દ સાથે મેળ ખાતા હોય અને આંશિક મેળ ખાતા શબ્દોને બાકાત રાખે છે. ઉદાહરણ તરીકે, જો તમે cart દાખલ કરો છો, તો શોધ "cart" ના ઉદાહરણોને હાઇલાઇટ કરે છે પરંતુ "carton" ને નહિ.
રેગ્યુલર એક્સપ્રેશનનો ઉપયોગ કરો એવા શોધ પરિણામો રિટર્ન કરે છે જે રેગ્યુલર એક્સપ્રેશન (regex) સાથે મેળ ખાતા હોય. regex એ અક્ષરોની એક સ્ટ્રિંગ છે જે ટેક્સ્ટમાં મેળ ખાતી પૅટર્ન સ્પષ્ટ કરે છે.

શોધ પેનલમાં, તમે શોધ પરિણામોમાં શામેલ કરવા અથવા બાકાત રાખવા માટે ફાઇલો અને ફોલ્ડર્સ પણ પસંદ કરી શકો છો.

અદ્યતન મેનૂ ખોલવા માટે પર ક્લિક કરો. તમે શામેલ કરવાની ફાઇલો અથવા બાકાત રાખવાની ફાઇલો ફીલ્ડમાં કોઈ પણ ફાઇલ અથવા ફોલ્ડરનો પાથ દાખલ કરી શકો છો. એક કરતાં વધુ ફાઇલ અથવા ફોલ્ડર ઉમેરવા માટે, તેમને સ્પેસ અને અલ્પવિરામથી અલગ કરો. ઉદાહરણ તરીકે, sections ફોલ્ડરમાં ફાઇલો શોધવા માટે, શામેલ કરવાની ફાઇલો ફીલ્ડમાં ./sections દાખલ કરો.

તમે ફાઇલ ડિરેક્ટરી વ્યૂમાંથી કોઈ ચોક્કસ ફોલ્ડરમાં પણ શોધી શકો છો. ફોલ્ડર પર રાઇટ-ક્લિક કરો, અને પછી ડ્રોપડાઉન મેનૂમાંથી ફોલ્ડરમાં શોધો... પસંદ કરો.

થીમ ફાઇલો મેનેજ કરવી

તમે તમારા થીમ કોડમાં ફાઇલોને મેનેજ કરી શકો છો. જ્યારે પાછલું વર્ઝન ઉપલબ્ધ હોય, ત્યારે તમે તેમના ટાઇમલાઇન વ્યૂમાંથી ફાઇલોને ડિલીટ કરી શકો છો, નવી ફાઇલો ઉમેરી શકો છો, ફાઇલોનું નામ બદલી શકો છો અને તેમાં ફેરફાર કરેલ અસ્તિત્વમાંની કોડ ફાઇલોને રિસ્ટોર કરી શકો છો. assets ફોલ્ડરમાં રહેલી ઍસેટ ફાઇલો, જેવી કે છબીઓ, CSS, JavaScript અને ફૉન્ટ, ટાઇમલાઇન ઇતિહાસ ધરાવતી નથી.

થીમ ફાઇલ ખોલવી

થીમ ફાઇલ ખોલવા માટે, ફોલ્ડર પર ક્લિક કરો, અને પછી એક્સપ્લોરરમાંથી ફાઇલના નામ પર ક્લિક કરો. તમે નામ અથવા એક્સ્ટેંશન દ્વારા ફાઇલોને પણ શોધી શકો છો, અને પછી ફાઇલ ખોલી શકો છો.

પગલાં:

તમારા Shopify ઍડમિનમાંથી, ઑનલાઇન સ્ટોર પર જાઓ.
> કોડમાં ફેરફાર કરો પર ક્લિક કરો.
Mac પર ⌘ + P અથવા Windows પર Ctrl + P દાખલ કરો.
સર્ચ બારમાં ફાઇલનું નામ દાખલ કરો અને ફાઇલ પસંદ કરો અથવા તાજેતરમાં ખોલેલી સૂચિમાંથી ફાઇલ પસંદ કરો.

નવી થીમ ફાઇલ ઉમેરવી

ફાઇલ ઉમેરવા માટે, ફોલ્ડર પસંદ કરો, નવી ફાઇલ આઇકન પર ક્લિક કરો, અને પછી ફાઇલનું નામ અને ફાઇલ એક્સ્ટેંશન દાખલ કરો.

ફાઇલ નામોમાં A-Z, 0-9 અક્ષરોનો સમાવેશ થઈ શકે છે અને તેમાં અક્ષરો વચ્ચે જગ્યા (સ્પેસ) શામેલ કરી શકાતી નથી. ડૅશ અથવા અંડરસ્કોર દ્વારા શબ્દોને અલગ કરો. ફાઇલ એક્સ્ટેંશન એક પૂર્ણવિરામ . અને એક્સ્ટેંશનના પ્રકાર દ્વારા વ્યાખ્યાયિત કરવામાં આવે છે. ઉદાહરણ તરીકે, .liquid અથવા .css.

પગલાં:

તમારા Shopify ઍડમિનમાંથી, ઑનલાઇન સ્ટોર પર જાઓ.
> કોડમાં ફેરફાર કરો પર ક્લિક કરો.
તમે જેમાં નવી ફાઇલ ઉમેરવા માંગતા હોવ તે ફોલ્ડર પર ક્લિક કરો.
ફોલ્ડરના નામ પર રાઇટ-ક્લિક કરો અને ડ્રોપ-ડાઉન મેનૂમાંથી નવી ફાઇલ... પસંદ કરો.
ફાઇલ માટે નવું નામ દાખલ કરો.
તમારા કીબોર્ડ પર Enter દબાવો.

નવી ઍસેટ અપલોડ કરવી

તમે કોડ એડિટરના assets ફોલ્ડરમાં આઇકન અથવા ઇમેજ ફાઇલ જેવી નવી ઍસેટ અપલોડ કરી શકો છો.

પગલાં:

તમારા Shopify ઍડમિનમાંથી, ઑનલાઇન સ્ટોર પર જાઓ.
> કોડમાં ફેરફાર કરો પર ક્લિક કરો.
assets ફોલ્ડર પર રાઇટ-ક્લિક કરો.
અપલોડ કરો... પર ક્લિક કરો.
તમે અપલોડ કરવા માંગતા હોવ તે ફાઇલ પસંદ કરો.
ખોલો પર ક્લિક કરો.

થીમ ફાઇલનું નામ બદલવું

ફાઇલનું નામ બદલવા માટે તમે ફાઇલ પર રાઇટ-ક્લિક કરી શકો છો. ખાતરી કરો કે તમે ફાઇલ એક્સ્ટેંશનને એડિટ કે હટાવો નહીં. ફાઇલ એક્સ્ટેંશન એક પૂર્ણવિરામ . અને એક્સ્ટેંશનના પ્રકાર દ્વારા વ્યાખ્યાયિત કરવામાં આવે છે. ઉદાહરણ તરીકે, .liquid અથવા .css. ફાઇલ નામોમાં A-Z, 0-9 અક્ષરોનો સમાવેશ થઈ શકે છે અને તેમાં અક્ષરો વચ્ચે જગ્યા (સ્પેસ) શામેલ કરી શકાતી નથી. ડૅશ અથવા અંડરસ્કોર દ્વારા શબ્દોને અલગ કરો. જો ફાઇલનું નામ માન્ય ન હોય, તો ફાઇલનું નવું નામ સાચવવામાં આવશે નહીં.

પગલાં:

તમારા Shopify ઍડમિનમાંથી, ઑનલાઇન સ્ટોર પર જાઓ.
> કોડમાં ફેરફાર કરો પર ક્લિક કરો.
ફાઇલ પર રાઇટ-ક્લિક કરો અને ડ્રોપ-ડાઉન મેનૂમાંથી નામ બદલો... પસંદ કરો.
ફાઇલ માટે નવું નામ દાખલ કરો.
તમારા કીબોર્ડ પર Enter દબાવો.

થીમ ફાઇલ ડિલીટ કરવી

તમે તમારી થીમમાંની કોઈપણ ફાઇલો ડિલીટ કરી શકો છો. ડિલીટ કરેલી થીમ ફાઇલોને રિકવર કરી શકાતી નથી.

પગલાં:

તમારા Shopify ઍડમિનમાંથી, ઑનલાઇન સ્ટોર પર જાઓ.
> કોડમાં ફેરફાર કરો પર ક્લિક કરો.
ફાઇલ પર રાઇટ-ક્લિક કરો અને ડ્રોપ-ડાઉન મેનૂમાંથી કાયમી ધોરણે ડિલીટ કરો પસંદ કરો.
ડિલીટ કરો પર ક્લિક કરો.