Spring til indhold
NanoHost

WordPress-drift

Divi Builder

Lær alt om Divi Builder til WordPress. En komplet guide til funktioner, opbygning, fordele, ulemper og optimering af din hjemmeside.

Af Kasper Stück 5 min. læsetid

Divi Builder er en af de mest udbredte “drag-and-drop” page builders til WordPress. Den giver dig mulighed for at opbygge og designe hjemmesider visuelt direkte i browseren, helt uden at du behøver at skrive kode. For mange små og mellemstore virksomheder (SMB’er) udgør Divi et stærkt værktøj til at få kontrol over hjemmesidens design og indhold.

I denne guide gennemgår vi, hvordan Divi fungerer, hvad de primære fordele og faldgruber er, og hvad du skal være opmærksom på for at undgå en langsom hjemmeside.

Hvad er Divi Builder?

Kort fortalt er Divi et plugin (eller et samlet tema) udviklet af Elegant Themes, der erstatter den standard WordPress-editor med en visuel editor. Hvor man traditionelt byggede sider i et tekstfelt og klikkede “Forhåndsvisning” for at se resultatet, tillader Divi dig at bygge direkte på sidens “front-end”. Det betyder, at du ser det endelige design i realtid, præcis som den besøgende vil se det.

Divi henvender sig både til webbureauer og virksomhedsejere. Som hjemmeside designer kan man hurtigt opsætte layouts, men for den almindelige website-ejer betyder det også, at hverdagens ændringer (som at skifte et billede eller rette en tekst) bliver markant nemmere at gå til.

Sådan er Divi bygget op

For at bruge Divi effektivt er det vigtigt at forstå systemets grundlæggende hierarki. Alt indhold i Divi er bygget op omkring tre primære byggeklodser:

  1. Sektioner (Sections): De største byggeklodser, som fungerer som beholdere for dit indhold. Sektioner bruges typisk til at opdele en side i store, vandrette blokke (f.eks. en header-sektion, en om-os-sektion og en kontakt-sektion). De markeres ofte med en blå farve i editoren.
  2. Rækker (Rows): Inden i en sektion placerer du rækker. Rækker definerer kolonnestrukturen. Du kan vælge alt fra en enkelt fuld-bredde kolonne til komplekse layous med fire eller fem kolonner. Rækker er grønne i editoren.
  3. Moduler (Modules): Inden i kolonnerne placeres selve indholdet via moduler. Det kan være tekst, billeder, knapper, kontaktformularer, prislister eller gallerier. Der findes over 40 forskellige standardmoduler. Moduler har grå markeringer.

Denne systematiske opbygning gør det let at strukturere indhold logisk.

Fordele og ulemper ved Divi

Ingen platform er perfekt, og Divi har både stærke sider og områder, hvor der kræves særlig opmærksomhed – især når det gælder ydelse.

Fordele

  • Brugervenlighed: Du kan pege, klikke og skrive direkte på siden.
  • Theme Builder: Divi lader dig ikke kun bygge enkeltsider, men også globale skabeloner for sidehoveder (headers), sidefødder (footers) og blogindlæg.
  • Stort bibliotek: Divi indeholder hundredvis af præfabrikerede layouts, hvilket er en fordel, hvis du mangler inspiration.
  • Fleksibilitet: Stort set alle elementer kan tilpasses i forhold til afstande, farver, skygger og animationer.

Ulemper

  • Indlæringskurve: Selv om det er “no-code”, kan det store udvalg af muligheder og indstillinger virke overvældende for nybegyndere.
  • Performance: Divi genererer meget kode (også kaldet DOM-størrelse), hvilket kan sløve din hjemmeside ned, hvis ikke du optimerer den korrekt.
  • Lock-in effekt: Hvis du bygger hele din side i Divi og en dag beslutter dig for at skifte til et andet tema eller page builder (som Gutenberg), efterlades dit indhold omgivet af såkaldte “shortcodes”, som skal renses manuelt.

Vigtigt: Gode backups er afgørende, når du arbejder intensivt med page builders. En forkert ændring i et globalt element kan ændre layoutet på hele din hjemmeside. Sørg for altid at have en pålidelig backup af din WordPress-installation.

Divi og e-handel (WooCommerce)

Hvis du driver en webshop, er det værd at bemærke, at Divi har en dyb integration med WooCommerce. Du er ikke bundet til standarddesignet for produktsider eller betalingsflow; med Divis Theme Builder kan du bygge skræddersyede produktsider.

Divi tilbyder specifikke WooCommerce-moduler (f.eks. til “Læg i kurv”-knapper, produktbilleder, relaterede produkter osv.), hvilket giver stor frihed. Men husk, at komplekse webshops kræver vedligeholdelse og løbende sikkerhedsopdateringer. For professionelle shops kan en WooCommerce serviceaftale være en fornuftig investering for at sikre stabilitet og drift.

Ydelse og hastighedsoptimering

En af de mest kritiske faktorer ved brug af page builders som Divi er hastigheden. Tung kode kan påvirke både din placering i Google og brugernes oplevelse.

Elegant Themes har løbende introduceret opdateringer for at forbedre hastigheden, f.eks. ved at implementere “Dynamic CSS” og “Critical CSS”, som sikrer, at kun den nødvendige kode indlæses på en given side. Som website-ejer skal du dog stadig tage aktivt del i optimeringen:

  1. Brug et hurtigt webhotel: Divi kræver ressourcer. Sørg for at din hosting er optimeret til WordPress. Et dedikeret WordPress webhotel med god server-caching er et must.
  2. Optimer billeder: Upload ikke store billeder direkte fra dit kamera. Skaler og komprimer dem først.
  3. Brug et caching plugin: Løsninger som WP Rocket eller LiteSpeed Cache gør en enorm forskel på et Divi-website.
  4. Begræns animationer: Selvom det er fristende at lade elementer svæve ind fra alle sider, belaster det browseren unødigt og fjerner fokus.

Alternativer til Divi

Markedet for sidebyggere er stort. Hvis du overvejer Divi, bør du også kende de primære alternativer for at træffe et velinformeret valg:

  • Elementor: Elementor er Divis største konkurrent og fungerer ud fra et lignende princip, men med et lidt andet interface (et sidepanel til indstillinger frem for Divis “flydende” menuer).
  • Gutenberg (Blokeditor): WordPress’ egen indbyggede blokeditor bliver stærkere for hver opdatering. Den er væsentligt hurtigere og genererer renere kode end Divi, men mangler endnu den samme grad af fuldstændig frihed og lette drag-and-drop funktioner til komplekse layouts.
  • Oxygen Builder / Bricks: Værktøjer rettet mere mod udviklere. De har en meget stejlere indlæringskurve, men leverer markant renere kode og hurtigere indlæsningstider.

Konklusion

Divi Builder er et utrolig kraftfuldt værktøj til at designe visuelt betagende hjemmesider uden at skulle programmere. Fleksibiliteten og de mange indbyggede skabeloner gør det muligt hurtigt at lancere et professionelt website.

For mindre virksomheder kan det være en perfekt genvej til et godt design, så længe man er opmærksom på at optimere for hastighed og vælger et solidt webhotel.


Ofte stillede spørgsmål

Hvad er Divi Builder?

Divi Builder er en visuel “drag-and-drop” page builder til WordPress, der gør det muligt at bygge og designe hjemmesider direkte på forsiden (front-end) uden at skrive kode.

Sløver Divi min hjemmeside?

Som udgangspunkt indlæser page builders mere kode end standard WordPress-temaer. Divi har dog indført mange performance-forbedringer. Med et godt webhotel og ordentlig caching kan et Divi-website sagtens gøres hurtigt.

Kan jeg bruge Divi til min webshop?

Ja, Divi er fuldt integreret med WooCommerce. Via Divi Theme Builder kan du bygge fuldstændig unikke produktsider og kategorisider.

Hvad sker der, hvis jeg deaktiverer Divi senere?

Da Divi er afhængig af shortcodes til at bygge strukturen, vil din hjemmesides indhold blive fyldt med rå kode (shortcodes), hvis du deaktiverer pluginnet. Et skift væk fra Divi vil derfor som regel kræve, at siderne genopbygges i det nye system.

WordPress-drift

CookieYes Wordpress plugin

Få fuld kontrol over cookie-samtykke og GDPR-compliance med CookieYes WordPress plugin. Læs vores guide til opsætning, funktioner, Google Consent Mode og priser.

Læs mere