# CMS-handleiding voor de SEO-partij — Helvoirt Gevelreiniging Korte, praktische uitleg over het beheren en SEO-optimaliseren van pagina's in het CMS (Emdash). Het CMS is bewust eenvoudig ingericht: je werkt met **Instellingen**, **Pagina's** en **Locatiepagina's**. > Admin-URL: `https:///_emdash/admin` (op de preview: `https://helvoirt-gevelreiniging.mike-197.workers.dev/_emdash/admin`). --- ## 1. Inloggen Het CMS werkt **zonder wachtwoord** met een inloglink per e-mail (magic-link): 1. Ga naar `/_emdash/admin/login`. 2. Klik **"Sign in with email link"**, vul je e-mailadres in. 3. Je krijgt een (Engelstalige) mail "Sign in to …" → klik de knop → je bent ingelogd. > Je e-mailadres moet eerst als gebruiker zijn aangemaakt (dat doet De Websmid eenmalig). > Open registratie bestaat niet. Geef je gewenste e-mailadres(sen) door. --- ## 2. De opbouw van het CMS | Onderdeel | Waarvoor | |---|---| | **Instellingen** | Site-brede gegevens: telefoon, e-mail, adres, **standaard SEO-titel/omschrijving**, **Google Tag Manager**, social links, Google-score. | | **Pagina's** | Gewone, vrij in te delen pagina's (bv. een informatie- of landingspagina). URL = de slug, bv. `/onderhoudstips`. | | **Locatiepagina's** | Lokale SEO-pagina's per plaats. URL = `/`, bv. `/maastricht`. | Bij **Pagina's** en **Locatiepagina's** staat in elk item een blok **SEO-velden** onderaan (titel, omschrijving, canonical, deelafbeelding, noindex). --- ## 3. Een gewone pagina aanmaken 1. Ga naar **Pagina's → Nieuw** (of dupliceer de meegeleverde *"Voorbeeldpagina (sjabloon)"*). 2. Vul in: - **Paginatitel** — de grote kop (H1) op de pagina. - **Slug** — het stukje achter de domeinnaam. `onderhoudstips` → `/onderhoudstips`. - **Intro** (optioneel) — korte inleiding onder de kop. - **Inhoud** — de hoofdtekst. Gebruik koppen (H2/H3), alinea's en lijsten. - **SEO-velden** (zie §5). 3. Zet de status op **Gepubliceerd** en sla op. De pagina is direct live (geen rebuild nodig). > Laat je een pagina op **Concept** staan, dan is hij wel zichtbaar in het CMS maar **niet** op > de site (de bezoeker krijgt een nette 404). --- ## 3b. Een script of embed op een pagina plaatsen (bv. cookieverklaring) Wil je een **extern script** of stukje **HTML/JavaScript** op een pagina draaien, bijvoorbeeld een **cookieverklaring** (Cookiebot, CookieFirst, Complianz, Termly, …), een formulier-embed of een widget? Plak dat **niet** in het **Inhoud**-veld. Dat veld is voor tekst en zet code om in *zichtbare letters* (je ziet dan letterlijk ``) in **Embedcode / scripts**. 3. Sla op. De code wordt **1-op-1 in de pagina-body geladen en uitgevoerd**, onder de gewone inhoud. (Je mag het Inhoud-veld leeg laten of er een korte intro-tekst boven zetten.) > **Let op:** dit veld voert code uit zonder controle. Plak hier **alleen code van een vertrouwde > bron** (je cookie-/consent-leverancier). Een typefout of een verkeerd script kan de pagina breken. > Twijfel je? Stem het even af met De Websmid. > > De **site-brede** cookiebanner (die op álle pagina's moet verschijnen) hoort niet hier, maar in > **Google Tag Manager** (zie §5, GTM-ID in Instellingen). Dit veld is voor pagina-specifieke embeds > zoals juist de cookie**verklaring**. --- ## 4. Een locatiepagina aanmaken (lokale SEO) 1. Ga naar **Locatiepagina's → Nieuw** (of dupliceer de meegeleverde *"Maastricht"*-pagina). 2. Vul in: - **Plaats** — bv. `Echt`. Deze naam gebruiken we in de kop, teksten en de diensten-strip. - **Slug** — bv. `echt` → de pagina komt op `/echt`. - **Paginakop / H1** — laat leeg voor automatisch *"Gevelreiniging in Echt"*, of typ een eigen kop (bv. *"Gevelreiniging en voegwerk in Echt"*). - **Intro** — korte lokale inleiding (staat in de donkere balk bovenaan, naast de CTA). - **Hero-foto bovenaan** (optioneel) — zet je er een foto in, dan komt die rechts in de donkere balk. Leeg = nette donkere balk zonder foto. - **Blok 1 t/m 4** (kop + tekst + optionele foto) — dit is de **opmaak met 4 koppen en alinea's**. Elk blok dat je invult verschijnt als een nette sectie; met een foto erbij komt tekst en beeld **om-en-om** te staan (links/rechts), zonder foto loopt de tekst over de volle breedte. Laat blokken die je niet nodig hebt gewoon leeg — die worden niet getoond. Het tekstveld van een blok is een **rich-text editor**: gebruik de werkbalk voor **opsommingen (bullets), genummerde lijsten, links (interne links naar je dienstpagina's), vet en cursief**. Je hoeft dus geen HTML te typen. Links openen standaard in **hetzelfde tabblad**; wil je een link in een nieuw tabblad openen, vink dan **"Openen in nieuw tabblad"** aan in het link-venster (handig voor links naar andere websites). (Bestaande blokteksten zijn automatisch omgezet: opsommingen, stappen en links zijn behouden — controleer ze even en verfijn naar wens, bv. de titel van een stap vet maken.) - **SEO-velden** (zie §5). > De lokale inhoud (je SEO-tekst) zet je in de **4 blokken** hierboven (kop + alinea + foto). > Het oude losse veld "Lokale inhoud / Extra tekst" is op locatiepagina's verwijderd. 3. Zet op **Gepubliceerd** en sla op. > **Vaste onderdelen die je niet hoeft in te vullen:** de donkere hero met "Gratis offerte" + > 4,9-Google-regel, een "Onze diensten in {plaats}"-strip met links naar de 5 dienstpagina's, > en het offerteformulier onderaan staan er **automatisch** op elke locatiepagina. > **Belangrijk voor SEO:** maak elke locatiepagina **uniek**. Tien keer dezelfde tekst met > alleen een andere plaatsnaam telt als dunne/duplicate content en kan averechts werken. Vul > de 4 blokken met echte, lokale tekst (waarom klanten in die plaats voor jullie kiezen, een > lokaal project, een wijk/straat, reistijd, etc.). --- ## 5. SEO optimaliseren ### Per pagina (in Pagina's en Locatiepagina's) - **SEO · titel** — de titel in Google + de browsertab. Houd ~50–60 tekens aan. Leeg laten = de paginatitel/kop wordt gebruikt. - **SEO · omschrijving** — de tekst onder de titel in Google (snippet). ~150–155 tekens. - **SEO · canonical-URL** — laat **leeg** (dan is de pagina zijn eigen canonical). Alleen invullen bij een bewuste verwijzing naar een andere URL. - **SEO · deelafbeelding (OG-image)** — de afbeelding bij delen op social media. Optioneel (anders wordt de standaard uit Instellingen gebruikt). - **SEO · noindex** — **alleen aanzetten** als de pagina *niet* in Google mag verschijnen. Standaard uit. ### Site-breed (in Instellingen) - **SEO · standaard paginatitel / omschrijving** — de fallback voor de homepage en pagina's zonder eigen SEO-titel. - **Google Tag Manager ID** — vul hier alleen het container-ID in (`GTM-XXXXXX`). De code wordt automatisch geplaatst. Leeg = geen tracking. - **Standaard deelafbeelding (OG-image)** — voor pagina's zonder eigen OG-image. --- ## 5b. Handige bewerk-functies (zoals in WordPress) - **Pagina dupliceren:** in een lijst (Pagina's / Locatiepagina's) staat per rij een **kopieer-icoon** (naast het potlood en de prullenbak). Daarmee maak je een **kopie als concept**, met alle velden en SEO. Ideaal om een nieuwe stadspagina te starten vanaf een bestaande. - **Rijen toevoegen/verwijderen/verslepen:** sommige velden zijn **repeaters** (bv. "Waarden" op Over ons). Daar voeg je met **"Add item"** een rij toe, verwijder je een rij met het prullenbak- icoon, en **versleep** je rijen om de volgorde te wijzigen. Net een mini page-builder. - **Losse lijst-items:** waar iets een eigen onderdeel in de zijbalk is (bv. een collectie), gebruik je **"Add New"** voor een nieuw item en de prullenbak om te verwijderen. - **"(optional)" bij velden:** velden die niet verplicht zijn tonen "optional". Dat is standaard in het CMS en niet uit te zetten; het zegt simpelweg dat je het veld leeg mag laten. ## 6. Do's & don'ts - **Locatiepagina's én gewone Pagina's staan beide op de root** (`/maastricht`, `/onderhoudstips`). Geef ze daarom een **unieke slug**: dezelfde slug bij een Locatie- én een Pagina kan niet (de Locatiepagina wint dan). Gebruik voor plaatsen altijd een **Locatiepagina** (die heeft het juiste lokale sjabloon). - **Hergebruik geen bestaande URL's als slug.** Deze vaste paden gaan vóór een CMS-pagina: `/`, `/diensten` (+ dienstpagina's), `/over-ons`, `/contact`, `/werkgebied`. Een pagina met slug `contact` wordt dus nooit getoond. - **Afbeeldingen** upload je via de mediabibliotheek in het CMS; kies het bestand in het betreffende beeldveld. - **Concept vs Gepubliceerd:** alleen gepubliceerde items staan live. --- ## 6b. De vaste pagina's beheren (Homepage, Over ons, Contact, Diensten) Naast **Pagina's** en **Locatiepagina's** staan ook de bestaande vaste pagina's in het CMS, elk als een eigen onderdeel in de zijbalk: | Onderdeel | Wat je er beheert | |---|---| | **Homepage** | Alle teksten van de homepage: hero, intro, koppen, werkwijze-stappen, reviews, FAQ (repeater-rijen). | | **Homepage · hero-foto's** | De 3 staande werkfoto's in de hero (foto + titel + ondertitel + alt). Volgorde via *Volgorde*. | | **Homepage · bewijs-galerij** | De 6 foto's in "Echt werk, echte resultaten" (foto + bijschrift; vink *Uitgelicht* voor de grote tegel). | | **Over ons (pagina)** | Hero, verhaal, waarden (repeater) + de twee foto's + SEO. | | **Contactpagina** | Kicker, titel, intro + SEO. (Telefoon/e-mail/adres staan in **Instellingen**.) | | **Diensten** | De 5 dienstpagina's. Elk item stuurt **tegelijk** de detailpagina (`/diensten/`), de kaart in het overzicht (`/diensten`), het paneel op de homepage én het menu aan. Velden: menu-titel/tekst/foto, hero, intro + "wat we doen", resultaat-galerij (3 foto's), aanpak-stappen, FAQ en SEO. Daarnaast **Blok 1 en Blok 2** (kop + rich-text + optionele foto, om-en-om getoond) onder de eerste alinea — zelfde rich-text-editor als de locatiepagina-blokken (lijsten, links, vet), leeg = niet getoond; handig voor extra content (bv. landingspagina's). **Volgorde** bepaal je met het veld *Volgorde in het menu (1-5)*. | | **Algemene voorwaarden** | De pagina `/voorwaarden`. Titel + intro + de artikelen als repeater-rijen (artikelkop + tekst; toevoegen/verwijderen/verslepen) + SEO. | > **Beeldvelden met "leeg = standaardfoto":** laat je een fotoveld leeg, dan toont de site de > meegeleverde standaardfoto. Upload je een eigen foto, dan vervangt die de standaard. ## 7. Wat (nu nog) niet via het CMS gaat — eerlijk overzicht **Volledig via het CMS te beheren:** Instellingen (NAW + site-brede SEO + GTM), Pagina's, Locatiepagina's, en alle vaste pagina's: **Homepage, Over ons, Contactpagina, Diensten en Algemene voorwaarden** (incl. het menu, dat de Diensten-volgorde/titels volgt). Nog **in code** (bewust, want het is geen redactionele inhoud): de algemene **opmaak/lay-out** en losse technische teksten. Wil je daar iets aan wijzigen, geef het door aan De Websmid. --- ## 8. Operationeel — vóór livegang (door De Websmid) Deze stappen activeren het bovenstaande; ze staan los van het dagelijkse pagina-beheer en worden door De Websmid uitgevoerd (zie `newsite.md`): 1. **Seed draaien** — het content-model (`seed/seed.json`) inladen via de setup-wizard op `/_emdash/admin/setup` (eenmalig). Daarna verschijnen Instellingen/Pagina's/Locatiepagina's. 2. **CMS-gebruiker(s) aanmaken** voor de SEO-partij (magic-link, §1). 3. **Sitemap** uitbreiden met gepubliceerde Pagina's + Locatiepagina's (§9 in `todo.md`). 4. **Interne links** naar de locatiepagina's leggen (bv. vanuit de werkgebied-sectie/menu) zodat ze goed vindbaar zijn.