Lisää mukautettu valikon sijainti

Ohje Kaikki paketit 1 min lukuaika

Käytä tätä, kun teemassasi ei ole valikkoelementtiä siinä kohdassa, jossa haluat valikon näkyvän, tai sen ylätunniste on liian mukautettu muille Sijainti-vaihtoehdoille. Lisäät tyhjän säiliön teeman koodiin ja osoitat siihen asetuksella Näytä valikko tässä CSS-valitsimessa.

Varoitus

Monista teemasi ennen koodin muokkaamista (Verkkokauppa > Teemat > … > Monista). Eikö koodi ole sinulle tuttua? Ota meihin yhteyttä, niin asennamme valikon puolestasi maksutta.

Lisää säiliöt ja osoita sovellus niihin

1. Avaa teeman koodi

   Siirry kohtaan Verkkokauppa > Teemat, napsauta teeman kohdalla … ja valitse Muokkaa koodia.

2. Lisää valikkosäiliöt

   Liitä tyhjä säiliö jokaiseen kohtaan, jossa valikon pitää näkyä, ja napsauta Tallenna. Mikä tahansa tunnus käy. Nämä ovat esimerkkejä:

   <div id="GloboDesktopMenu"></div>
   <div id="GloboMobileMenu"></div>

   • Tietokone: yleensä ylätunnisteen osiotiedostossa (esimerkiksi sections/header.liquid), kohdassa, jossa navigoinnin pitää olla.
   • Mobiili: yleensä teemasi valikkolaatikon tiedostossa tai tiedostossa layout/theme.liquid.

3. Syötä säiliöt sovellukseen

   Avaa valikkoeditorissa Asetukset-välilehti ja valitse Sijainti-kohdasta Näytä valikko tässä CSS-valitsimessa. Kirjoita #GloboDesktopMenu kenttään Päävalikkosi CSS-valitsin ja #GloboMobileMenu kenttään Mobiilivalikkosi CSS-valitsin.

   

   Kirjoita säiliöidesi tunnukset kahteen CSS-valitsinkenttään

4. Tallenna, julkaise ja tarkista

   Napsauta Tallenna ja julkaise valikko. Tarkista kauppasi tietokoneella ja mobiilissa.

Hyvä tietää

• Vain yksi asettelu – lisää yksi säiliö ja jätä toinen kenttä tyhjäksi.
• Nykyinen sisältö korvataan – sovellus täyttää jokaisen säiliön ja korvaa kaiken sen sisällön.
• Teemasi valikko jää paikalleen – piilota tai poista se koodissa tai teeman asetuksissa, jos et halua molempia.
• Teemakohtainen – koodimuutokset koskevat vain muokkaamaasi teemaa. Lisää säiliöt uudelleen, jos vaihdat tai päivität teeman.

Vianmääritys

Mobiilivalikko ei näy

Teemasi saattaa rakentaa valikkolaatikon myöhemmin JavaScriptillä. Siirrä mobiilisäiliö koodiin, joka on aina sivulla, kuten tiedostoon layout/theme.liquid.

Mitään ei näy

Varmista, että sovelluksen upotus on päällä tässä teemassa. Tarkista selaimesi konsolissa, että document.querySelector('#GloboDesktopMenu') löytää säiliösi.

Aiheeseen liittyvät sivut

• Näytä valikko CSS-valitsimessaSijoita valikko teemasi tarkkoihin elementteihin kirjoittamalla niiden CSS-valitsimet.
• Julkaise valikkoJulkaise valikkosi teemaan ja valitse, missä se näkyy kaupassasi.
• Mukautettu CSSLisää omaa CSS:ää ja hienosäädä valikon ulkoasua.

Oliko tästä apua?

Ilmoita ongelmasta