Zo update je Shopify-thema zonder je aangepaste code te verliezen

Elke Shopify-ondernemer die wel eens aanpassingen in het thema heeft gemaakt, kent het probleem: je investeert tijd in persoonlijke tweaks, maar zodra er een nieuwe thema-update verschijnt, verdwijnen al jouw wijzigingen. Gelukkig is er goed nieuws! Shopify heeft recent belangrijke verbeteringen geïntroduceerd waardoor thema-updates soepeler verlopen, zelfs met aangepaste code.

Waarom verdwijnen aangepaste themawijzigingen?

Traditioneel gezien worden Shopify-thema’s automatisch bijgewerkt zolang er geen directe wijzigingen zijn gedaan in de originele themabestanden zoals .liquid, .css of .js. Zodra Shopify detecteert dat je een van deze bestanden hebt aangepast, stopt de automatische update en krijg je de melding dat jouw wijzigingen niet worden meegenomen. Hierdoor moet je handmatig jouw aangepaste code naar de nieuwe versie overzetten.

Wat is er nieuw bij Shopify?

Met de laatste update heeft Shopify dit proces verbeterd. Wanneer een nieuw thema beschikbaar is, krijg je een ongepubliceerde versie als kopie aangeboden. Shopify kopieert automatisch thema-instellingen, sectie-indelingen en app-configuraties naar deze nieuwe versie. Hierdoor hoef je alleen nog maar eventuele aangepaste code te controleren en handmatig over te zetten. Dit maakt het updateproces veel eenvoudiger.

Best practices voor update-vriendelijke code

Met onderstaande tips houd je jouw thema-aanpassingen veilig en gemakkelijk te beheren:

1. Gebruik aparte bestanden voor aanpassingen
   Maak een apart bestand aan zoals custom.css of custom.js in de map assets/. Dit zorgt ervoor dat jouw aanpassingen niet worden overschreven bij een thema-update.
2. Gebruik versiebeheer (Git of Shopify CLI)
   Professionele ontwikkelaars gebruiken versiebeheertools zoals Git of Shopify CLI om wijzigingen te beheren en eenvoudig bij te houden. Hiermee kun je gemakkelijk zien wat er veranderd is en je wijzigingen veilig samenvoegen met nieuwe updates.
3. Maak regelmatig thema-backups
   Maak regelmatig een duplicaat van je thema voordat je aanpassingen doet. Mocht er iets misgaan, dan kun je gemakkelijk terug naar een stabiele versie.
4. Gebruik diff-tools
   Door het gebruik van een diff-tool zoals Diffchecker of Visual Studio Code kun je snel zien welke code gewijzigd is tussen oude en nieuwe thema-versies. Hierdoor hoef je alleen gerichte updates door te voeren.
5. Scheiding van je eigen scripts en stijlen
   Voeg je aangepaste JavaScript- en CSS-bestanden toe aan je thema door ze apart te houden en te linken in het bestand theme.liquid. Hierdoor blijven jouw aanpassingen geïsoleerd van standaard thema-updates.

Stap-voor-stap je Shopify-thema bijwerken

Volg deze eenvoudige stappen om veilig je Shopify-thema bij te werken:

1. Dupliceer je huidige thema in Shopify Admin (Online Store > Themes > Actions > Duplicate).
2. Zet je aangepaste code in aparte bestanden binnen de assets map.
3. Gebruik versiebeheer (zoals Git) om wijzigingen vast te leggen.
4. Accepteer de nieuwe thema-update en preview deze eerst.
5. Gebruik een diff-tool om eventuele noodzakelijke migraties snel te identificeren.
6. Publiceer het nieuwe thema zodra je zeker weet dat alles goed werkt.

Klaar voor de toekomst

Door deze tips en best practices toe te passen, zorg je ervoor dat je altijd snel kunt profiteren van nieuwe Shopify-thema-updates zonder dat jouw unieke aanpassingen verloren gaan. Heb je hulp nodig bij het opzetten van een toekomstbestendige workflow voor je Shopify-thema? Neem gerust contact op, ik help je graag!

‍