Themacode bewerken

Je kunt je themacode bewerken om gedetailleerde wijzigingen aan je onlinewinkel aan te brengen. De meeste bestanden die deel uitmaken van een thema bevatten Liquid, de sjabloontaal van Shopify. Themabestanden bevatten ook HTML, CSS, JSON en JavaScript. Bewerk de code voor een thema alleen als je HTML en CSS kent en een basiskennis hebt van Liquid.

Als je de code van je thema bewerkt, dan maak je het misschien ongeschikt voor automatische upgrades. Je moet de code van je thema alleen bewerken als je de veranderingen die je nodig hebt, niet kunt aanbrengen met een HTML- of Liquid-instelling of een Shopify-app.

Voordat je het thema aanpast

Voordat je het thema aanpast, is het een goed idee om de volgende taken uit te voeren:

De themacode bewerken

Je kunt de code voor je thema bewerken.

Stappen

  1. Klik op Acties > Code bewerken.

De code-editor toont een map met themabestanden aan de linkerkant en een ruimte om de bestanden te bekijken en te bewerken aan de rechterkant.

Je kunt de code-editor uitvouwen om het scherm te vullen door op het pictogram voor uitvouwen te klikken:

Het pictogram voor uitvouwen

Je kunt de pagina weer normaal weergeven door op het pictogram voor inklappen te klikken:

Het pictogram voor inklappen

Wanneer je op een bestand in de map aan de linkerkant klikt, wordt dit in de code-editor geopend. Je kunt meerdere bestanden tegelijk openen en bewerken. Alle bestanden die je wijzigt, hebben een stip naast de bestandsnaam:

De map met themabestanden met een paarse stip naast de bestanden die zijn gewijzigd

Dit kan je helpen bij te houden waar je wijzigingen hebt aangebracht.

Ga terug naar een oudere versie van je thema

Als je themabestanden hebt gewijzigd en deze moet terugdraaien, kun je .liquid-bestanden afzonderlijk terugdraaien naar een tijd en datum voordat je de wijzigingen hebt aangebracht.

  1. Klik onder de koptekst Sjablonen in een van de .liquid-bestanden die je onlangs hebt bewerkt.

    liquid-bestand openen

  2. Klik op Oudere versies naast de .liquid-bestandsnaam

    Oudere versies

  3. Klik op het vervolgkeuzemenu om een oudere versie te selecteren. Als je op een datumstempel klikt, wordt de code teruggedraaid naar die opgeslagen versie.

    voorbeeld terugdraaien

  4. Optioneel: klik op Voorbeeld en kijk of de fout is opgelost.

Donkere modus

Wanneer de code-editor is uitgebreid tot volledig scherm, kun je het editor-kleurenschema veranderen van Licht naar Donker en omgekeerd door op de knoppen onderaan de pagina te klikken.

Zie The Power of the Dark Side: Dark User Interfaces op de Shopify Partners Blog voor informatie over de voordelen van het gebruik van de donkere editor.

Tutorials voor het aanpassen van themacode

Met de tutorials voor het aanpassen van themacode leer je hoe je wijzigingen in je onlinewinkel aanbrengt. De tutorials zijn geordend op basis van het type pagina of functie dat wordt gewijzigd.

Tutorials voor het aanpassen van thema's worden gedeeld door de versie van thema-architectuur die ze gebruiken. Ontdek hoe je je versie van je thema-architectuur kunt identificeren.

Hulp bij aanpassingen

Als je hulp nodig hebt bij het wijzigen van je thema, kun je contact opnemen met de ontwikkelaar van je thema voor ondersteuning.

Zie Aanvullende bronnen voor ondersteuning van thema's om te zien welke andere bronnen beschikbaar zijn om je te helpen bij het aanpassen van thema's.

Klaar om te beginnen met verkopen met Shopify?

Probeer het gratis