Wordpress CMS

Komplet Guide til Design af WordPress-sider

Last Updated on: 21. juni 2026

Komplet Guide til Design af WordPress-sider

WordPress er verdens mest populære CMS (Content Management System), og det er ikke uden grund: det er fleksibelt, brugervenligt og kan tilpasses både begyndere og professionelle designere. Uanset om du laver en simpel blog, en portefølje, en webshop eller en virksomhedsside, giver WordPress dig alle værktøjer til at skabe et professionelt design.

Denne guide hjælper dig gennem hele processen – fra idé til design og færdig hjemmeside.


🧭 1. Planlægning – Før du designer

Inden du går i gang med at klikke og trække elementer rundt, er det vigtigt at planlægge:

🔹 Formål og mål

Hvad skal siden gøre? Er det:

  • At sælge produkter?

  • Skabe kontakt?

  • Vise dit arbejde frem?

  • Dele indhold?

🔹 Målgruppe

Hvem designer du til? Din målgruppe bestemmer både stil, struktur og indhold.

🔹 Struktur og indhold

Lav en sitemap over dine sider:

  • Forside

  • Om os

  • Services / Produkter

  • Blog / Nyheder

  • Kontakt

Skriv udkast til dine vigtigste tekster og saml dine billeder.


🎨 2. Vælg det rigtige tema

Et tema styrer det visuelle layout og grundlæggende funktioner.

🔹 Gratis vs. premium temaer

  • Gratis: Findes i WordPress’ egen temaoversigt. Fx: Astra, Neve, OceanWP

  • Premium: Har ofte mere funktionalitet, support og designmuligheder. Fx: Divi, Kadence, Kallyas, Hello + Elementor

🔹 Hvad skal du kigge efter?

  • Responsivt design (mobilvenligt)

  • Hastighed og optimering

  • Kompatibilitet med page builders

  • SEO-venligt

  • Hyppige opdateringer

👉 Installer via Udseende > Temaer


🧱 3. Brug af Page Builders – design uden kode

De fleste moderne WordPress-sider bygges i dag med page builders – træk-og-slip værktøjer, der gør design nemt og visuelt.

Populære page builders:

  • Elementor (meget udbredt og brugervenlig)

  • Divi Builder (integreret i Divi-temaet)

  • Beaver Builder (let og hurtig)

  • Gutenberg (WordPress’ egen blok-editor – god til lette sider)

  • WP-Bakery (tidligere js_composer)

👉 Med en page builder kan du nemt opbygge sektioner, kolonner, animationer og visuelle effekter – uden kode.


🏗 4. Designprincipper for WordPress-sider

🔹 Hold det enkelt

Overfyldte sider virker forvirrende. Brug hvidt rum og god afstand.

🔹 Brug en ensartet farvepalette

Vælg 2-3 hovedfarver, og brug dem konsekvent. Brug fx Coolors.co til at finde gode kombinationer.

🔹 Typografi betyder alt

Brug maks. to skrifttyper. Sørg for høj læsbarhed – også på mobil.

🔹 Billeder og grafik

Brug billeder i høj kvalitet og optimer dem med f.eks. TinyPNG eller Imagify.

🔹 Mobiloptimering

Tjek dit design på mobil og tablet – 60-80 % af besøgende bruger mobilen.


⚙️ 5. Vigtige plugins til design og funktion

Plugin Funktion
Elementor Træk-og-slip page builder
WPForms Kontaktformularer
Smush / Imagify Billedoptimering
Yoast SEO SEO og metadata
Rank Math Alternativ SEO-plugin
Kadence Blocks Gutenberg-udvidelser til avancerede layouts
SiteGround Optimizer / LiteSpeed Cache Hurtigere indlæsningstid

🧪 6. Test og tilpasning

Inden du går live:

  • Tjek siden i flere browsere (Chrome, Firefox, Safari)

  • Brug Google Mobile-Friendly Test: test på mobil

  • Brug GTmetrix til hastighedstest: gtmetrix.com

  • Test kontaktformularer og links


🚀 7. Gør din side klar til lancering

🔹 SSL-certifikat

Sørg for at din side bruger HTTPS (ofte gratis hos webhotellet)

🔹 Sitemap og Google Analytics

Installer Google Site Kit eller Rank Math for SEO og Analytics.

🔹 Backup og sikkerhed

Brug plugins som UpdraftPlus og Wordfence for sikkerhed og backup.


✅ 8. Gode tips fra profferne

  • Start med en skabelon, og tilpas – det sparer tid

  • Design til brugeren – ikke dig selv

  • Undgå for meget animation – det kan virke billigt og forstyrre

  • Hold navigationen enkel – maks. 5-7 menupunkter

  • Indlæs kun det nødvendige – jo færre plugins, desto hurtigere side


🧾 Konklusion: Dit WordPress-design er dit digitale visitkort

WordPress er et kraftfuldt værktøj, men det er designet der gør forskellen. En flot, funktionel og mobiloptimeret hjemmeside kan skabe tillid, engagement og konverteringer.

Husk: Et godt design kræver ikke nødvendigvis dyre temaer eller kodning – men klar planlægning, brugervenlige værktøjer og et øje for detaljen.


🔗 Nyttige links og ressourcer

Temaer & page builders:

Designværktøjer:

Ressourcer og guides:

John Grandt

About the Author: Self claimed Grafisk Designer John Grandt Velkommen til mit domæne. Dette domæne www.grandts.com er for en stor dels vedkommende baseret på at fremvise udvalgte Portfolio Works, giv mig feedback jeg ville blive glad for at høre fra dig.

Recent Posts

Hun er ekspert i sociale medier

🚫 Farvel til sociale medier – og goddag til alternativer Astrid Haug, en af Danmarks…

2 måneder ago

De største og bedste fordele

De største og bedste fordele ved Kallyas Theme – et kraftfuldt WordPress tema til moderne…

3 måneder ago

Work in Progress

Work in Progress Intet er så sjovt for mig som at lave nyt, statisk er…

3 måneder ago

De 5 største faresignaler på dårlig ledelse

🚩 De 5 største faresignaler på dårlig ledelse – og hvad du kan gøre ved…

3 måneder ago

Hvad koster en hjemmeside?

💻 Hvad koster en hjemmeside? – En komplet guide til priser og muligheder Når du…

4 måneder ago

Truly Freedom

Truly Freedom – 15 Tegn på at du Lever som et Frit Menneske Af John…

5 måneder ago