WordPress-drift
Divi fra Elegant Themes: En Dybdegående Gennemgang
Overvejer du at bygge din næste hjemmeside med Divi fra Elegant Themes? Læs vores dybdegående gennemgang af funktioner, performance, lock-in effekt og priser.
Af Kasper Stück 9 min. læsetid
Når man overvejer at bygge eller ombygge en hjemmeside i WordPress, vil man næsten uundgåeligt støde på navnet Divi fra Elegant Themes. Divi har gennem mange år været en af de absolut mest populære løsninger for brugere, der ønsker at designe visuelt uden at skulle skrive kode. Med millioner af aktive installationer er det et økosystem, der har præget måden, vi tænker design på i WordPress.
Men i et hastigt udviklende WordPress-landskab – hvor den indbyggede blokeditor (Gutenberg) hele tiden forbedres, og fokus på teknisk hastighed er større end nogensinde – er det relevant at stille spørgsmålet: Giver det stadig mening at vælge Divi til dit næste webprojekt?
I denne gennemgang ser vi nærmere på de centrale elementer i Divi. Vi dykker ned i selve brugeroplevelsen, adskiller temaet fra bygge-pluginnet, vurderer de langsigtede konsekvenser vedrørende performance og vedligeholdelse, og udpeger, hvem systemet egentlig passer bedst til i dag.
Hvad er Divi fra Elegant Themes?
Divi er i sin kerne et designværktøj til WordPress, skabt af softwarevirksomheden Elegant Themes. Det blev oprindeligt lanceret for at gøre det muligt for alle – uanset teknisk niveau – at opsætte komplekse og visuelt tiltalende sider. Divi er kendt for sin “front-end visual builder”, som betyder, at du designer din side præcis som den kommer til at se ud for den besøgende, blot med interaktive værktøjer overlejret.
Det er vigtigt at forstå, at Divi-økosystemet ikke blot er ét enkelt produkt, men derimod er delt op i to forskellige tekniske implementeringer:
Forskellen på Divi Theme og Divi Builder Plugin
For at give maksimal fleksibilitet har Elegant Themes opdelt deres flagskib i to versioner:
1. Divi Theme: Dette er et fuldt, selvstændigt WordPress-tema. Vælger du at installere Divi Theme, overtager det hele styringen af din hjemmesides udseende, lige fra sidehoved (header) og sidefod (footer) til selve sideindholdet. Temaet har Divi Builder indbygget i sin kerne. Dette er den foretrukne løsning, hvis du starter et helt nyt projekt fra bunden og ønsker alt samlet under én paraply.
2. Divi Builder Plugin: Dette er et plugin, du kan installere oven på et hvilket som helst andet WordPress-tema. Hvis du for eksempel allerede har et yndlingstema, som dikterer din hjemmesides overordnede struktur, men du mangler fleksibilitet til at bygge specifikke, komplekse landingssider, kan Divi Builder Plugin være en løsning. Du får de samme visuelle drag-and-drop værktøjer, men uden at skifte hele dit underliggende tema.
Hvem henvender Divi sig til?
Divis brede appel skyldes i høj grad, at det er bygget til at tilfredsstille vidt forskellige målgrupper. Den visuelle tilgang betyder, at læringskurven for at komme i gang er relativt overskuelig sammenlignet med mere kodebaserede alternativer.
Begyndere og mindre virksomhedsejere, der selv ønsker at varetage driften og designet af deres hjemmeside, sætter ofte stor pris på Divi. Man kan hurtigt trække moduler ind, justere farver og ændre tekster uden frygt for at “ødelægge” den bagvedliggende kode. Den visuelle feedback er øjeblikkelig, hvilket skaber en tryg designproces.
Samtidig er Divi utrolig populært blandt hjemmeside-designere, freelancere og digitale bureauer. Det skyldes især muligheden for at bygge skabeloner, gemme design-elementer i et globalt bibliotek og lynhurtigt udrulle nye projekter for kunder. Bureauer kan bruge Divi som en skalerbar platform, hvor de nemt kan overlevere en færdig side til en kunde, som selv kan foretage mindre tekstændringer bagefter.
Workflow og den visuelle oplevelse
At arbejde i Divi er en meget taktil oplevelse. Frem for at udfylde formularfelter i WordPress-kontrolpanelet, klikker du blot der, hvor du vil ændre noget. Workflowet er bygget op omkring et meget specifikt hierarki af designelementer, som man skal vænne sig til.
Sektioner, rækker og moduler
Alt indhold i Divi er struktureret i et tre-trins system, som holdes adskilt med farvekoder i brugerfladen:
- Sektioner (Blå): Dette er de største byggeklodser. En sektion spænder typisk over hele skærmens bredde og bruges til at opdele siden i store, logiske områder – for eksempel en mørk “hero”-sektion i toppen og en lys sektion med kundeanmeldelser længere nede.
- Rækker (Grønne): Inden i hver sektion placerer man rækker. En række styrer layoutet og kolonnerne. Det er her, du bestemmer, om indholdet skal stå i én bred kolonne, to lige store kolonner, eller måske tre smalle kolonner ved siden af hinanden.
- Moduler (Grå): Modulerne er selve indholdet, som lægges ind i kolonnerne. Divi kommer med et massivt bibliotek af præbyggede moduler – fra simple tekstblokke, billeder og knapper, til mere avancerede elementer som pris-tabeller, nedtællingsure, kontaktformularer og gallerier.
Når dette system først sidder på rygraden, bliver det at bygge og omstrukturere sider en meget logisk proces.
Skabeloner og globalt design (Theme Builder)
En af de mest markante udviklinger i Divis nyere historie er introduktionen af deres “Theme Builder”. Før i tiden var page builders begrænset til at styre indholdet på de enkelte sider, mens hjemmesidens overordnede elementer (som header, footer og blog-arkiver) var låst fast af selve temaet.
Med Theme Builder funktionen har Elegant Themes gjort det muligt at designe hele hjemmesiden visuelt. Du kan bygge en global sidehoved-skabelon, som automatisk anvendes på alle sider. Du kan designe specifikke skabeloner for, hvordan dine blogindlæg skal se ud, og trække dynamisk indhold ind – som for eksempel indlæggets titel, forfatter og udgivelsesdato. Driver du en webshop, kan du ligeledes designe unikke produktsider og varekataloger for WooCommerce fuldstændig fra bunden.
Dette globale designsystem sparer enormt meget tid, da ændringer foretaget i Theme Builder slår igennem overalt på platformen øjeblikkeligt.
Performance, hastighed og webtilgængelighed
Når man overvejer et omfattende designværktøj som Divi, er det afgørende at kigge på de tekniske kompromiser. Med stor fleksibilitet følger ofte en større mængde kode.
Fokus på performance-optimering
Historisk har Divi – i lighed med mange andre page builders – fået kritik for at generere “bloated” (overflødig) kode, som kan forringe sidens indlæsningshastighed. For at imødekomme en given designforespørgsel, er systemet nødt til at indlæse store mængder CSS og JavaScript.
Elegant Themes har dog løbende introduceret opdateringer med fokus på performance. Funktioner som “Dynamic CSS” og “Dynamic PHP” sørger for, at siden kun indlæser præcis den kode, der faktisk bruges på den specifikke side, frem for at hente hele Divis funktionsbibliotek hver gang. Derudover er der indført optimering af “Critical CSS”, som forbedrer den tid, det tager for brugeren at se det første indhold på skærmen.
Til trods for disse forbedringer er en hjemmeside bygget med Divi sjældent lige så teknisk “let” som et projekt bygget udelukkende med native WordPress blokke. For at sikre hurtige loadtider – hvilket er vigtigt for både brugeroplevelsen og søgemaskineoptimering – anbefales det stærkt at kombinere Divi med et højkvalitets WordPress webhotel samt effektive løsninger til backup og caching.
Webtilgængelighed (Accessibility)
Webtilgængelighed bliver et stadig vigtigere parameter for alle seriøse webløsninger. Selvom Divi gør det let at bygge visuelt spændende sider, genererer værktøjet nogle gange en HTML-struktur, som ikke nødvendigvis er optimeret til skærmlæsere og tastaturnavigation ud af boksen. Som designer i Divi bærer du selv et stort ansvar for manuelt at sikre korrekt overskriftshierarki (H1, H2, H3), tilføje de rette ARIA-labels og opretholde en tilstrækkelig farvekontrast. Divi leverer lærredet, men du skal selv male ansvarligt, især hvis din side skal overholde strenge webtilgængelighedskrav.
Vedligeholdelse og “Lock-in” effekten
En af de mest kritiske overvejelser, du bør gøre dig før du investerer i Divi, omhandler fremtidig vedligeholdelse og den såkaldte “lock-in” effekt.
Hvad betyder lock-in for din hjemmeside?
For at Divi kan gemme dine visuelle designs, benytter det sig i stor stil af shortcodes i WordPress-databasen. Et komplekst layout bliver i baggrunden gemt som en lang række koder (for eksempel [et_pb_section]). Så længe Divi er aktivt på dit websted, oversætter systemet disse koder til det smukke design, du har bygget.
Udfordringen opstår den dag, du beslutter dig for at skifte væk fra Divi – måske for at prøve et nyt tema eller for at skifte til standard blokeditory. Deaktiverer du Divi, forsvinder designet, men databasen efterlades fyldt med de uoversatte shortcodes. Det betyder, at dit indhold fremstår som en rodet masse af kantede parenteser og koder for den besøgende.
At migrere fra Divi kræver derfor ofte, at indholdet renses manuelt eller genopbygges fra bunden i det nye system. At vælge Divi er dermed en langsigtet forpligtelse; det er en platform, man typisk bliver på i mange år frem i tiden.
Priser og licensmodeller
Prisstrukturen hos Elegant Themes har længe tiltrukket mange brugere, da de opererer med premium-licenser, der typisk dækker flere domæner på én gang.
(Husk altid at tjekke Elegant Themes’ officielle hjemmeside for de mest aktuelle priser, abonnementsformer og licensvilkår).
Som udgangspunkt opererer de med premium betalte modeller, som giver dig adgang til temaet, samtlige plugins, opdateringer og support.
Det, der for alvor gør prissætningen attraktiv for mange professionelle, er, at deres licenser ofte giver lov til at benytte Divi på mange af dine egne – eller dine kunders – domæner. For bureauer og freelancere kan det være en fordelagtig model, afhængig af de til enhver tid gældende betingelser.
Tjekliste før du vælger Divi
Inden du træffer den endelige beslutning om at basere dit næste WordPress-projekt på Divi, kan du med fordel gennemgå denne korte tjekliste for at sikre, at produktet matcher dine behov:
- Værdsætter du fuld visuel frihed? Hvis du ønsker et drag-and-drop system, hvor du kan bygge uden kodebegrænsninger, er Divi et yderst potent værktøj.
- Skal du bygge flere sider? Divis licensstruktur har historisk været økonomisk fordelagtig for bureauer og freelancere med flere kunder, da den ofte dækker mange domæner (tjek aktuelle vilkår på deres officielle side).
- Er du forberedt på at forpligte dig? Accepter den indbyggede “lock-in” effekt; et fremtidigt skift væk fra Divi vil kræve en manuel genopbygning af indholdet på grund af brugen af shortcodes.
- Er du klar til at optimere performance? Divi kan absolut gøres hurtigt, men det vil kræve lidt mere teknisk indsats – herunder et solidt webhotel og en god caching-løsning – sammenlignet med et minimalt standard-tema.
Divi fra Elegant Themes er utvivlsomt et modent og ufatteligt funktionsrigt værktøj. Det kræver en kort indlæringskurve at mestre det specifikke workflow, og man skal være bevidst om den tekniske bagside af at have adgang til så mange funktioner. Men forventer du at drive din hjemmeside på samme platform i mange år, tilbyder Divi en designfrihed, som kun meget få andre systemer kan matche.
- #wordpress-drift
- #page-builder
- #divi
- #wordpress-tema