Takaisin alkuun ‑painikkeen lisääminen pitkille sivuille

Jos sinulla on sivuja, jotka ovat pitkiä ja vaativat paljon vierittämistä, voit lisätä teemaasi Takaisin alkuun ‑painikkeen.

Esimerkki Takaisin alkuun ‑painikkeesta

Takaisin alkuun vievän back-to-the-top‑koodinpätkän luominen

Koodinpätkän sisällyttäminen

  1. Avaa Asettelut-kansiossa theme.liquid-tiedosto.
  2. Vieritä tiedoston alareunaan. Liitä tämä koodi heti </body>-lopputunnisteen yläpuolelle:
{% render 'back-to-the-top' %}

Koodisi pitäisi näyttää tältä:

Koodinpätkän sisällyttäminen Takaisin alkuun ‑painikkeeseen

  1. Klikkaa Tallenna.

Takaisin alkuun ‑painikkeen määritys (valinnainen)

Jos haluat mukauttaa Takaisin alkuun ‑painiketta, klikkaa tästä ja katso koodinpätkäsi ensimmäisiä rivejä.

  • Jos haluat muuttaa painikkeen sijaintia suhteessa selaimen alaosaan, muokkaa position_from_bottom-arvoa:
{% assign position_from_bottom = '4em' %}
  • Jos haluat muuttaa sitä, kuinka pitkälle alas asiakkaan on vieritettävä näkymää, ennen kuin painike tulee näkyviin, muokkaa vertical_offset_for_trigger-arvoa:
{% assign vertical_offset_for_trigger = 300 %}

Vinkki: vertical_offset_for_trigger-arvo on määritettävä ilman yksiköitä, ja sen on oltava pikseliarvo.

Demokauppa

Vieraile demokaupassa nähdäksesi esimerkin tästä mukautuksesta.

Valmiina aloittamaan Shopifyssa?

Kokeile ilmaiseksi