Bricks Builder: Sådan kommer du i gang (dansk guide 2026)

Bricks Builder er den page builder jeg griber til, når et WordPress-site skal være både hurtigt at bygge og hurtigt at indlæse. Hvor klassiske buildere som Elementor og WPBakery ofte efterlader oppustet markup og dårlige Core Web Vitals, genererer Bricks ren HTML og giver dig kontrol helt ned til hvert element. Denne guide tager dig fra installation til de arbejdsvaner, der adskiller et rodet Bricks-site fra et professionelt et.

Hvorfor Bricks frem for de andre buildere?

Tre ting gør reelt forskellen i hverdagen:

• Ren output. Bricks udskriver semantisk HTML uden lag på lag af wrapper-divs. Det er guld værd for både performance og SEO.
• Rigtig CSS-kontrol. Du arbejder med globale classes — ikke kun inline-styling på det enkelte element. Det betyder genbrug i stedet for copy-paste.
• Performance som standard. Ingen tunge frontend-frameworks tvunget ned over hovedet på dig. Et fornuftigt Bricks-site rammer ofte grønne Core Web Vitals uden kamp.

Til gengæld har Bricks en stejlere indlæringskurve end "træk-og-slip og glem alt om CSS"-buildere. Den investering tjener du hjem mange gange på det første rigtige projekt.

Installation og grundopsætning

Bricks er et tema, ikke et plugin. Du installerer det som dit aktive tema og bygger dine skabeloner derfra. Den hurtige opskrift:

1. Køb en licens på bricksbuilder.io og hent zip-filen.
2. Gå til Udseende → Temaer → Tilføj nyt → Upload tema og aktivér Bricks.
3. Tilføj din licensnøgle under Bricks → License.
4. Sæt et child theme op, hvis du skal tilføje egen PHP — så overlever dine ændringer en opdatering.

Når temaet kører, redigerer du sider ved at klikke "Edit with Bricks" i toppen. Builderen åbner i sit eget interface med struktur-panel til venstre, canvas i midten og indstillinger til højre.

Forstå strukturen: Section, Container, Block, Element

Bricks bygger på et enkelt hierarki, og det betaler sig at lære det fra dag ét:

• Section — en vandret sektion af siden (typisk fuld bredde).
• Container — den centrerede indholds-wrapper inde i en section, som holder din maksimale bredde.
• Block / Div — fleksible grupper du bruger til layout, fx en kolonne eller et kort.
• Elements — de konkrete byggesten: overskrift, tekst, billede, knap, osv.

En typisk sektion er altså: Section > Container > Block(s) > Elements. Når du holder dig til det mønster, bliver dine sider forudsigelige at vedligeholde — også for den næste der skal arbejde i dem.

Styling med globale classes — den vigtigste vane

Den største fælde for nye Bricks-brugere er at style alt direkte på elementet. Det føles hurtigt, men efter 20 sider har du 200 unikke styles og ingen rød tråd. Gør i stedet sådan her:

• Giv elementer classes (fx .card, .btn-primary, .section-padding) og styl class'en, ikke elementet.
• Genbrug class'en på tværs af siden. Retter du den ét sted, opdateres alt.
• Brug ID-styling kun til reelle engangstilfælde.

Det er præcis samme tankegang som god CSS uden builder — Bricks giver dig bare et visuelt interface til det.

Skru op for tempoet med ACSS (Automatic.css)

Når du arbejder professionelt i Bricks, er Automatic.css (ACSS) næsten uundværlig. Det er et utility- og variabel-framework, der giver dig:

• Et gennemtænkt spacing- og typografi-system baseret på CSS-variabler og clamp(), så alt skalerer flydende mellem mobil og desktop.
• Færdige utility-classes til margin, padding, farver og grid, så du undgår at genopfinde det samme igen og igen.
• Konsistens på tværs af hele sitet — en kæmpe gevinst, når flere bygger i samme installation.

Kombinationen Bricks + ACSS er for mig standard-stakken til nye kundeprojekter. Den giver hastighed i byggefasen og et site der er til at vedligeholde bagefter.

Genbrugelige komponenter og skabeloner

Bricks lader dig gemme dele som components og templates:

• Templates styrer header, footer, single-post layouts og arkiver via Bricks' template conditions.
• Components (globale, genbrugelige elementer) lader dig bygge fx et CTA-felt ét sted og indsætte det mange steder — med ét sted at rette.

Tænk i komponenter fra start. Det er forskellen på et site der vokser pænt, og et der bliver til teknisk gæld.

Almindelige begynderfejl jeg ser

• Alt styles på elementet i stedet for på classes — uvedligeholdbart efter få sider.
• For mange nestede containers der genskaber den oppustethed, man valgte Bricks for at undgå.
• Ingen global typografi/spacing — sæt det op (gerne med ACSS), før du bygger den første sektion.
• Ingen child theme når man tilføjer PHP — ændringer forsvinder ved opdatering.

Ofte stillede spørgsmål

Er Bricks Builder bedre end Elementor? Til performance og ren kode: ja, klart. Elementor er mere nybegynder-venligt og har et større plugin-økosystem, men betaler ofte prisen i tungere sider. Til professionelle, hurtige sites foretrækker jeg Bricks.

Kræver Bricks at jeg kan kode? Nej — men du får langt mere ud af det, hvis du forstår grundlæggende HTML og CSS. Builderen afspejler de begreber direkte.

Kan jeg bruge Bricks til en webshop? Ja. Bricks understøtter WooCommerce med dedikerede elementer til produkter, kurv og checkout.

Hvad koster Bricks? Bricks sælges som licens (årlig eller lifetime) pr. antal sites. Tjek de aktuelle priser på bricksbuilder.io.

Næste skridt

Når fundamentet sidder, handler resten om at bygge vaner: tænk i classes, sæt din typografi og spacing op først, og genbrug komponenter. Vil du have hurtige sider med det samme, så læs også WordPress kører langsomt? De 12 ting jeg tjekker først.

Og skal du have bygget — eller have en erfaren udvikler til at sætte fundamentet rigtigt op fra start — så kan jeg hjælpe med din Bricks-build.