Je thema bewerken
Je kunt je thema bewerken om de content, opmaak, typografie en kleuren van je webshop aan te passen. Elk thema heeft secties en instellingen waarmee je de look-and-feel van je winkel kunt wijzigen zonder dat je code hoeft te bewerken.
Op deze pagina
Voordat je het thema aanpast
Voltooi de volgende aanbevolen taken om je voor te bereiden op het aanpassen van je thema:
- Dupliceer je thema om een back-up te maken. Dit maakt het eenvoudig om je wijzigingen te annuleren en opnieuw te beginnen als dat nodig is.
- Zorg ervoor dat je weet welk ondersteuningsniveau beschikbaar is.
- Leer alles over de vereisten en best practices voor het uploaden van afbeeldingen.
Themabewerker
De themabewerker geeft een boomweergave weer van alle content voor de template die je momenteel in de zijbalk bekijkt. Vouw een sectieknooppunt uit met behulp van het pictogram ▸ om de blokken te bekijken, of klap het in met behulp van het inklappictogram ▾ om de blokken te verbergen. Je kunt op elk gedeelte of blok klikken om de instellingen te bekijken.
Toegang tot de themabewerker
- Ga in het Shopify-beheercentrum naar webshop > Thema's.
- Klik op Aanpassen naast het thema dat je wilt bewerken.
- Klik op Secties.
Preview Inspector
De Preview Inspector is een nieuwe functie van de themabewerker. Je kunt rechtstreeks vanuit het voorbeeldvenster naar secties en blokken navigeren en de bijbehorende instellingen sneller en intuïtiever vinden. Met de Preview Inspector kun je secties en blokken opnieuw ordenen, verbergen of verwijderen, direct vanuit het voorbeeldvenster.
De Preview Inspector is beschikbaar voor alle gratis Shopify-thema's en is standaard geactiveerd. Je kunt de Preview Inspector tijdens het bewerken activeren of deactiveren.
Wanneer de Preview Inspector is geactiveerd, kun je op elk beschreven element klikken om de bijbehorende instelling te openen. Wanneer de Preview Inspector is geactiveerd op een mobiel apparaat, kun je op elk element klikken om de bijbehorende instelling te selecteren. Je kunt het onderste blad openen om via deze geselecteerde instelling bewerkingen uit te voeren.
De Preview Inspector geeft twee verschillende randen weer rond de secties en blokken waar je in het voorbeeldvenster op klikt:
- Doorgetrokken blauwe lijn: de actieve sectie. De bijbehorende instelling op de zijbalk is grijs gemarkeerd.
- Blauwe stippellijn: een gekoppeld blok voor de sectie. Als je op het artikel in het voorbeeldvenster klikt, worden de instellingen voor het blok of de sectie geopend.
Als je in het voorbeeldvenster op een deel van je website klikt, worden de bijbehorende instellingen in de zijbalk geladen. Op een mobiel apparaat kun je door twee keer te tikken door de site navigeren zoals een klant dat zou doen.
Secties en blokken toevoegen aan de Preview Inspector
Tijdens het gebruikvan de Preview Inspector kun je secties en blokken rechtstreeks vanuit het voorbeeldvenster aan je thema toevoegen. Op mobiel kun je secties toevoegen, dupliceren, verbergen, verplaatsen en verwijderen met de bewerkmodus in het onderste blad.
| Hulpmiddelen | Beschrijving |
|---|---|
| Sectie toevoegen | De knop Sectie toevoegen staat aan de boven- en onderkant van de geselecteerde sectie. Klik op de knop Sectie toevoegen om een nieuwe sectie boven of onder de geselecteerde sectie in te voegen. |
| Blok toevoegen | De knop Blok toevoegen wordt weergegeven wanneer je de muisaanwijzer over een bestaand blok beweegt. Klik op het +-pictogram om een blok toe te voegen. Er wordt een pop-upmenu weergegeven met de thema- en app-blokken die je aan de geselecteerde sectie kunt toevoegen. Klik op het blok dat je wilt toevoegen. Het instellingenvenster voor het nieuwe blok wordt geladen in de rechter zijbalk. |
Preview Inspector-tools
Je kunt secties en blokken van de themabewerker verplaatsen, verbergen, dupliceren of verwijderen met de Preview Inspector.
| Hulpmiddelen | Beschrijving |
|---|---|
| Verplaatsen naar volgende/vorige positie | Je kunt een sectie of blok verplaatsen naar de volgende positie of de vorige positie met behulp van de pijlpictogrammen in de Preview Inspector. Als de geselecteerde sectie boven aan de pagina staat, wordt de knop verplaatsen naar vorige positie grijs weergegeven. En als je sectie onder aan de pagina staat, kun je de knop verplaatsen naar volgende positie niet gebruiken. |
| Sectie of blok dupliceren | Klik op het kopieerpictogram om een sectie of blok en de content ervan te dupliceren. |
| Sectie of blok verbergen | Klik op het oogpictogram om een sectie of blok zichtbaar te maken. Wanneer een sectie of blok verborgen is, kun je deze niet vanuit de Preview Inspector zichtbaar maken. Je kunt op de knop Ongedaan maken op de startbalk klikken of het instellingenpaneel sluiten om terug te gaan naar de startpagina van de themabewerker. Verborgen secties of blokken worden in de zijbalk vermeld met een doorgekruist oogpictogram. Klik op dit pictogram om de sectie of het blok zichtbaar te maken. |
| Sectie of blok verwijderen | Klik op het prullenbakpictogram om de geselecteerde sectie of het blok in de Preview Inspector te verwijderen. |
Zijbalkmodi
De themabewerker biedt twee modi om gebruik te maken van alle ruimte op je scherm.
De dubbele zijbalkmodus is bedoeld voor bredere browservensters en grotere schermen, en de enkele zijbalkmodus is voor smallere browservensters en kleinere schermen. De zijbalkmodus bepaalt waar het deelvenster in de editor wordt weergegeven.
Dubbele zijbalkmodus
Als je beeldscherm groter is dan 1600 pixels breed en je internet-venster volledig is uitgevouwen, of als je internet-venster is uitgevouwen tot minimaal 1600 pixels breed, kun je twee zijbalken zien. De linker zijbalk bevat het navigatiepaneel en de rechter zijbalk bevat het instellingspaneel.
Modus enkele zijbalk
Smallere browsers hebben slechts één zijbalk om ruimte te creëren voor het voorbeeld van het thema. Wanneer je op een sectie of blok klikt om het te bewerken, wordt het instellingspaneel boven in je navigatiepaneel in de zijbalk geopend.
Sectiegroepen
Secties worden in elke paginatemplate gegroepeerd in de volgende gebieden:
- Koptekst: Dit is je koptekst, de aankondigingsbalk en eventuele apps of aangepaste Liquid.
- Template: Dit omvat secties die samen het grootste deel van je pagina vormen. De templatesecties kunnen bijvoorbeeld blogposts, een collage, collectielijsten of aangepaste Liquid bevatten.
- Voettekst: Dit is je voettekst, aanmelding voor het ontvangen van e-mail en eventuele apps of aangepaste Liquid.
De kop- en voettekst komen op alle pagina's van je webshop. Als je bijvoorbeeld een aangepast Liquid-blok aan de koptekst toevoegt, wordt die aangepaste Liquid weergegeven op al je productpagina's, de homepage en eventuele andere pagina's. Je kunt de secties naar behoefte opnieuw ordenen.
Secties en blokken
In de lijst met secties en blokken worden standaard alle blokken voor de secties op een pagina weergegeven.
Secties die deel uitmaken van de kop- of voettekst zijn standaard ingeklapt, maar je kunt ze zien als je op het uitvouwpictogram ▸ naast de sectienaam klikt.
Secties en blokken verplaatsen
Je kunt een sectie of een blok op een pagina verplaatsen met behulp van het ⋮⋮-pictogram om de sectie of het blok naar een andere beschikbare locatie te verslepen.
Als je een sectie of blok naar een locatie probeert te verplaatsen waar dat niet is toegestaan, wordt de sectie of het blok op de oorspronkelijke plaats teruggezet.
Secties verwijderen
Je kunt vanuit het instellingenscherm voor elk artikel een sectie of blok uit een template verwijderen. De knop Sectie verwijderen wordt onderaan de instellingen van de sectie weergegeven.
Stappen:
- Klik op of blokkeer in de zijbalk van de themabewerker de sectie die je wilt verwijderen.
- Klik op Sectie verwijderen of Blok verwijderen.
- Klik op Opslaan. Klik bij het bewerken van een gepubliceerd thema op Publiceren om je wijzigingen op te slaan en ze live te maken in je winkel.
Blokken verbergen
Je kunt elk gedeelte of blok verbergen met behulp van het oogpictogram.
Templates
Je hebt toegang tot alle templates van je thema via de paginaselectie in de bovenste balk van de themabewerker.
Als je een thema van Online Store 2.0 gebruikt, kun je ook rechtstreeks vanuit de paginaselectie een nieuw template aanmaken door op de optie Nieuw template te klikken.
Templates weergeven met specifieke bronnen
Wanneer je een template bekijkt, kun je zien hoe deze eruitziet met alle compatibele bronnen uit je winkel. Als je bijvoorbeeld een producttemplate bekijkt, kun je deze met elk product in je winkel testen.
Stappen:
- Selecteer in de paginaselectie voor de themabewerker het template waar je een voorbeeld van wilt bekijken.
- Klik in het navigatiepaneel in het gedeelte Voorbeeld op Wijzigen.
- Selecteer in het menu Selecteren de bron waar je een voorbeeld van wilt bekijken.
Acties ongedaan maken en opnieuw uitvoeren
De knoppen Ongedaan maken en Opnieuw uitvoeren bevinden zich rechtsboven in de themabewerker.
Aangepaste gegevens inline bewerken
Wanneer je met aangepaste gegevens werkt om metaobjectpagina's te bouwen, kun je metavelden en metaobjecten rechtstreeks inline bewerken zonder naar het beheercentrum te navigeren om wijzigingen aan te brengen. Dit werkt voor metavelden voor afbeeldingen, video's, kleuren, producten, pagina's, collecties en tekst.
Stappen:
- Selecteer een compatibele instelling in het thema die verwijst naar het metaobject.
- Selecteer en bewerk de metaveldwaarde in het metaobject-item in het deelvenster met de instellingen.
- Sla je werk op. De landingspagina wordt automatisch ververst met de bijgewerkte informatie.
Documentatie bekijken, ondersteuning krijgen en je themaversie controleren
De links naar de documentatie van je thema en ondersteuningsinformatie zijn te vinden in het menu Meer ⋯ in de menubalk. In dit menu kun je ook de themaversie en gegevens van de maker controleren.
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.