Uređivanje koda teme

Možete da uredite kôd svoje teme kako biste uneli detaljne promene u svoju internet prodavnicu pomoću uređivača koda. Većina datoteka koje čine temu sadrži Liquid, Shopify-jev jezik šablona. Datoteke teme takođe sadrže HTML, CSS, JSON i JavaScript. Uredite kôd za temu samo ako znate HTML i CSS, i imate osnovno razumevanje Liquid-a.

Kôd svoje teme možete da uređujete samo nakon što je kupite. Ovo obuhvata i upotrebu AI generatora koda u uređivaču tema. Ako koristite verziju plaćene teme za probni period, morate da je kupite pre nego što počnete sa izmenama koda.

Uređivač koda prikazuje direktorijum datoteka vaše teme i prostor za njihov prikaz i uređivanje. Kada kliknete na datoteku u direktorijumu, ona se otvara u uređivaču koda. Možete da otvorite i uređujete više datoteka u isto vreme. Takođe možete da otvorite i pregledate više datoteka istovremeno.

Raspored uređivača koda teme

Uređivanje koda teme

Možete da koristite uređivač koda da biste izmenili datoteke svoje teme.

Koraci:

Desktop
  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

Mobilni uređaj
  1. U aplikaciji Shopify dodirnite ikonicu Meni.

  2. U odeljku Kanali prodaje dodirnite Onlajn prodavnica.

  3. Dodirnite Upravljaj temama.

  4. Dodirnite Horizontalni meni > Uredi kôd.

Čuvanje izmena

Kada uređujete datoteku, pored naziva kartice prikazuje se tačka koja označava nesačuvane izmene. Kliknite na dugme Sačuvaj da biste sačuvali izmene. Možete i da pritisnete ⌘ + S na Mac-u ili Ctrl + S na Windows-u da biste sačuvali izmene.

Delimični prikaz uređivača koda koji prikazuje nesačuvanu datoteku pored dugmeta za čuvanje

Formatiranje koda teme

Da biste popravili uvlačenje koda, otvorite paletu komandi (Command Palette) pomoću ⌘ + Shift + P na Mac-u ili Ctrl + Shift + P na Windows-u, unesite format, a zatim izaberite Format document.

Koraci:

  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

  3. Otvorite datoteku koju želite da formatirate.

  4. Pritisnite ⌘ + P na Mac-u ili Ctrl + P na Windows-u.

  5. U paleti komandi unesite format, a zatim pritisnite Enter na tastaturi.

  6. Sačuvajte datoteku.

Paleta komandi sa izabranom opcijom za formatiranje koda

Praćenje izmena u datoteci

Da biste vratili izmenjenu datoteku teme na prethodnu verziju, koristite prikaz Vremenska linija za tu datoteku.

Prikaz Vremenska linija vraća samo jednu po jednu postojeću datoteku. Ne vraća celu temu i ne može da oporavi izbrisane datoteke teme. Istorija vremenske linije je ograničena, pa starije verzije možda neće biti dostupne.

Vraćanje zamenjuje celokupan sadržaj datoteke, uključujući izmene koje možda želite da zadržite. Pre vraćanja datoteke, kopirajte njen trenutni sadržaj na sigurno mesto ako želite da sačuvate neke izmene.

Kontrola verzija u uređivaču tema

Koraci:

  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

  3. Otvorite postojeću datoteku koju želite da pregledate ili vratite.

  4. Opciono: Ako želite da zadržite neke od trenutnih izmena, pre vraćanja kopirajte trenutni sadržaj datoteke na sigurno mesto.

  5. U prikazu Vremenska linija kliknite na neki unos u vremenskoj liniji da biste uporedili razlike.

  6. Da biste zamenili celokupan sadržaj datoteke izabranom prethodnom verzijom, kliknite desnim tasterom miša na unos u vremenskoj liniji, a zatim izaberite Vrati sadržaj.

  7. Kliknite na Vrati.

Theme Check

Uređivač koda uključuje Theme Check, funkciju koja pomaže u sprečavanju grešaka tako što pruža trenutne povratne informacije tokom pisanja koda, umesto da greške otkrijete tek u aktivnoj temi.

U uređivaču koda, Theme Check može da identifikuje sledeće greške u izmenjenom kodu:

  • Skripte koje blokiraju raščlanjivač (parser), što može da uspori izlog
  • Nedoslednosti između datoteka prevoda, kao što su ključevi za prevod koji nedostaju ili prevodi koji se ne podudaraju u datoteci lokalizacije
  • Šabloni koji nedostaju

Greške su označene crvenom linijom ispod koda. Da biste videli grešku, pređite mišem preko istaknute linije.

Pretraga i zamena u uređivaču koda

Pretragu unutar uređivača koda možete obaviti na jedan od sledećih načina:

  • Pretražite kôd određene datoteke.
  • Pretražite kôd svih datoteka u temi.

Takođe možete da zamenite kôd u određenoj datoteci ili u više instanci u svim datotekama teme. Možete i da potražite datoteku po nazivu da biste otvorili datoteku.

Pretraga unutar datoteke

Možete da pretražite kôd u određenoj datoteci i zamenite ga. Koristite tastere sa strelicama da biste pregledali svaku instancu koda.

Korisnički interfejs za pretragu unutar datoteke u uređivaču koda

Nakon što pretražite kôd, možete da ga zamenite u datoteci.

Koraci:

  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

  3. Otvorite datoteku koju želite da pretražite.

  4. Pritisnite ⌘ + F na Mac-u ili Ctrl + F na Windows-u.

  5. U polje Pretraga unesite pojam za pretragu.

  6. Opciono: Da biste zamenili kôd, dovršite sledeće radnje:

  • U modalnom prozoru za pretragu kliknite na ikonicu Desna strelica.
  • U polje Zameni unesite kôd za zamenu. Možete da kliknete na Zadrži velika/mala slova da bi se veliko, odnosno malo slovo zamenskog koda podudaralo sa postojećom instancom.
  • Kliknite na ikonicu Zameni da biste menjali po jednu instancu, ili kliknite na ikonicu Zameni sve da biste zamenili sve instance odjednom.

Pretraga u svim datotekama

Kliknite na dugme za pretragu na levoj bočnoj traci da biste pretražili sve datoteke teme. Rezultati prikazuju svaku instancu vašeg pojma za pretragu i datoteku u kojoj se pojavljuje.

Bočni panel za pretragu u uređivaču koda

Koraci:

  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

  3. Kliknite na ikonicu Pretraga da biste otvorili panel za pretragu.

  4. U polje Pretraga unesite pojam za pretragu.

  5. Opciono: Da biste zamenili kôd, dovršite sledeće radnje:

  • U modalnom prozoru za pretragu kliknite na ikonicu Desna strelica.
  • U polje Zameni unesite kôd za zamenu.
  • Zamenite po jednu instancu, ili sve instance odjednom.

Napredne opcije pretrage

Da biste suzili rezultate pretrage, koristite jednu ili više sledećih opcija za pretragu:

  • Podudaranje velikih i malih slova vraća termine pretrage koji se podudaraju sa veličinom slova. Na primer, ako unesete proizvod, pretraga ističe sve instance reči „proizvod“ ili „Proizvod“. Ako izaberete Podudaranje velikih i malih slova, pretraga ističe samo instance reči proizvod.
  • Podudaranje cele reči vraća termine pretrage koji se tačno podudaraju sa rečju i isključuje delimična podudaranja. Na primer, ako unesete rad, pretraga ističe instance reči „rad“, ali ne i „radnik“.
  • Koristi regularni izraz vraća rezultate pretrage koji se podudaraju sa regularnim izrazom (regex). Regex je string znakova koji određuje obrazac podudaranja u tekstu.

Na panelu Pretraga možete takođe izabrati datoteke i fascikle koje želite da uključite ili isključite iz rezultata pretrage.

Kliknite na Horizontalni meni da biste otvorili napredni meni. Možete uneti bilo koju putanju datoteke ili fascikle u polja datoteke za uključivanje ili datoteke za isključivanje. Da biste dodali više od jedne datoteke ili fascikle, odvojite ih razmakom i zarezom. Na primer, za pretragu datoteka u fascikli sections, unesite ./sections u polje datoteke za uključivanje.

Takođe možete vršiti pretragu u okviru određene fascikle iz prikaza direktorijuma datoteka. Kliknite desnim tasterom miša na fasciklu, a zatim u padajućem meniju izaberite Pronađi u fascikli....

Upravljanje datotekama teme

Možete da upravljate datotekama u kodu teme. Možete da izbrišete datoteke, dodate nove datoteke, preimenujete datoteke i vratite izmenjene postojeće datoteke sa kodom iz njihovog prikaza Vremenska linija kada je dostupna prethodna verzija. Datoteke elemenata preuzimanja, poput slika, CSS, JavaScript datoteka i fontova u fascikli assets, nemaju istoriju vremenske linije.

Otvaranje datoteke teme

Da biste otvorili datoteku teme, kliknite na fasciklu, a zatim kliknite na naziv datoteke u pretraživaču. Takođe možete da potražite datoteke po imenu ili ekstenziji, a zatim da otvorite datoteku.

Koraci:

  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

  3. Pritisnite ⌘ + P na Mac-u ili Ctrl + P na Windows-u.

  4. Unesite ime datoteke u traku za pretragu i izaberite datoteku ili izaberite datoteku sa liste Nedavno otvoreno.

Dodavanje nove datoteke teme

Da biste dodali datoteku, izaberite fasciklu, kliknite na ikonicu Nova datoteka, a zatim unesite naziv datoteke i ekstenziju datoteke.

Imena datoteka mogu sadržati znakove A–Z, 0–9 i ne mogu sadržati razmake. Razdvojte reči crticama ili donjim crtama. Ekstenzija datoteke definisana je tačkom . i vrstom ekstenzije. Na primer, .liquid ili .css.

Koraci:

  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

  3. Kliknite na fasciklu u koju želite da dodate novu datoteku.

  4. Kliknite desnim tasterom miša na ime fascikle i izaberite Nova datoteka... u padajućem meniju.

  5. Unesite novo ime datoteke.

  6. Pritisnite Enter na tastaturi.

Otpremanje novog elementa preuzimanja

Možete da otpremite novi element preuzimanja, poput ikonice ili datoteke slike, u fasciklu assets uređivača koda.

Koraci:

  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

  3. Kliknite desnim tasterom miša na fasciklu assets.

  4. Kliknite na Otpremi....

  5. Izaberite datoteku koju želite da otpremite.

  6. Kliknite na Otvori.

Preimenovanje datoteke teme

Možete da kliknete desnim tasterom miša na datoteku da biste je preimenovali. Vodite računa da ne izmenite niti uklonite ekstenziju datoteke. Ekstenzija datoteke definisana je tačkom . i vrstom ekstenzije. Na primer, .liquid ili .css. Imena datoteka mogu sadržati znakove A–Z, 0–9 i ne mogu sadržati razmake. Razdvojte reči crticama ili donjim crtama. Ako ime datoteke nije važeće, novo ime datoteke se neće sačuvati.

Koraci:

  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

  3. Kliknite desnim tasterom miša na datoteku i izaberite Preimenuj... u padajućem meniju.

  4. Unesite novo ime datoteke.

  5. Pritisnite Enter na tastaturi.

Brisanje datoteke teme

Možete da izbrišete sve datoteke u svojoj temi. Izbrisane datoteke teme ne mogu se oporaviti.

Koraci:

  1. Iz svog Shopify admina, idite na Onlajn prodavnica.

  2. Kliknite na Horizontalni meni > Uredi kôd.

  3. Kliknite desnim tasterom miša na datoteku i izaberite Trajno izbriši u padajućem meniju.

  4. Kliknite na Izbriši.