Maatwerk-thema, automatisch bouwen
Hoe krijg ik automatisch vertalingen (in een maatwerk-thema) met Cloud Run?
![Maatwerk-thema, automatisch bouwen](https://storage.googleapis.com/gcs.janx.nl/2024/01/169c59bc54479e1b.jpeg)
Om de site op Ghost in de Nederlandse taal te draaien heb je een niet-standaard thema nodig. Het lastige is dan dat alléén de standaard-thema’s (Casper en Source) worden ingeladen vanuit het basis-image van de Ghost-container. Ververst de container, is je thema verdwenen. In m'n eerdere bericht stelde ik daarom de vraag al:
Hoe krijg ik nou toch een eigen thema mee, ín het containertje dat ik gebruik in Cloud Run? En wie hier de vraag stelt, mag ‘m beantwoorden. 😀
Dockerfile uitbreiden
Ik ben toch nog steeds wel een Docker-kluns. Jij? Oké, voor mij in kleine stapjes dan. We hebben dus een image beschreven in het bestandje genaamd Dockerfile
. Daarin gaan we eerst de meest actuele, basis-Ghost-versie inladen. En daar de Google Cloud Storage-adapter bijzetten, zoals we eerder deden:
FROM ghost:5-alpine
# Add GCS Adapter, from https://github.com/danmasta/ghost-gcs-adapter
RUN mkdir -p /tmp/gcs "$GHOST_INSTALL/current/core/server/adapters/storage/gcs"; \
wget -O - -q "$(npm view @danmasta/ghost-gcs-adapter dist.tarball)" | tar xz -C /tmp/gcs ; \
npm install --prefix /tmp/gcs/package --omit=dev --omit=optional --no-progress ; \
mv -v /tmp/gcs/package/* "$GHOST_INSTALL/current/core/server/adapters/storage/gcs"
# Use the Ghost CLI to set the neccessary config values.
RUN set -ex; \
su-exec node ghost config storage.active gcs; \
su-exec node ghost config storage.gcs.hashAlgorithm "sha512";
De eerder besproken uitbreiding op het standaard Docker image
Voor de vertalingen gebruiken we het thema Casper-i18n. (Die i18n staat voor internationalization, met 18 letters tussen de i en de n. Just in case you didn't know. ¡Ahora lo sabes! La connaissance est le pouvoir, n’est-ce pas?) Ik voegde de Nederlandse vertaling toe, die vlot werd opgenomen.
# Add the Casper i18n Theme from https://github.com/GenZmeY/casper-i18n/
RUN mkdir -p /tmp/custom ; \
wget -O - -q "https://github.com/GenZmeY/casper-i18n//archive/refs/heads/master.tar.gz" | tar xz -C /tmp/custom ; \
mv -v /tmp/custom/* "$GHOST_INSTALL/content.orig/themes/casper-i18n" ;
Thema-source inladen, op de juiste plek (en het juiste moment)
We downloaden de juiste versie van GitHub en pakken ’m uit, binnen het containertje-in-opbouw. Direct onder de eerdere Docker-regels: le voilà, de hele custom container.
Nieuw image bouwen en uitrollen, alweer
Deze nieuwe versie moeten we natuurlijk nog even opbouwen. En dan de Cloud Run service een nieuwe revisie geven met de nieuwe versie van dit image. ... Nee joh, alweer? Wat een gedoe! Misschien moesten we het maar eens met Cloud Build doen. Serverless CI/CD, baby!
Trigger-happy Cloud Build
Cloud Build kan met bepaalde triggers automatisch een nieuwe revisie laten bouwen én uitrollen, bijvoorbeeld wanneer:
- mijn eigen custom Dockerfile wordt vernieuwd
- de Casper-l18n master een nieuwe release krijgt
- van de Ghost officiële Dockerfile een nieuwe versie wordt aangeleverd
De eerste is heel makkelijk, als je al Ghost CMS in Cloud Run hebt draaien: Klik op "Set up continuous deployment", kies een repo (bijvoorbeeld de mijne) en Dockerfile als type. De nieuwe trigger én de build worden daarna vanzelf klaargezet.
![](https://storage.googleapis.com/gcs.janx.nl/2024/01/27ef4390e677f815.gif)
De eerstvolgende keer dat de code in de gekozen repository wordt vernieuwd, rolt er dus automatisch een hele nieuwe versie uit naar je website. Of je trapt 'm handmatig af, vanuit de Cloud Shell:
gcloud builds triggers run Build-from-custom-docker-update --branch=master
Niet vergeten: Thema en taal selecteren
Het thema moet nog ingesteld worden. Eenmalig, want gelukkig wordt in de database onthouden wat het geselecteerde thema is. Dus als de container ververst, wordt het vanzelf weer geselecteerd. Als het goed is vind je nu het (via de maatwerk-container voorgeladen) thema inmiddels onder /ghost/#/settings/design/change-theme
... Installed
.
In dit voorbeeld kun je nu ook de site-taal op nl
instellen, als je dat nog niet gedaan had. Het hier gekozen thema kijkt namelijk naar de site-brede instelling voor de aangeboden vertaling.