Bytt WordPress-tema, och alla snygga knappar, flikar och kolumner som följde med försvann. Låter det bekant? Inbyggda temashortcodes är knutna till dess functions.php, och när du byter tema förlorar du precis allt du byggt upp under månader. En smidig migrering är bara möjlig om du flyttar anpassade element till tillägg i förväg.

Men varför bry sig om shortcodes överhuvudtaget när det finns sidbyggare? Svaret är enklare än det verkar: om webbplatsdesignen fungerar för dig och temat helt täcker dina layoutbehov, är det onödigt att dra in en hel sidbyggare med sina megabyte av CSS och JS bara för ett par knappar och accordions. Shortcodes löser problemet kirurgiskt: infoga en knapp i ett inlägg, lägg till en notis på tjänstesidan, bygg kolumner för en landningssida, och inget extra laddas.

Vi har samlat 13 fungerande verktyg, från lätta shortcode-tillägg till fullfjädrade visuella byggare, så att du kan välja exakt vad du behöver för en specifik uppgift. Varje tillägg är testat: aktivt, uppdaterat, fungerar med nuvarande WordPress 6.4+.

💡 Snabb översikt:

• Ta reda på vilka shortcode-tillägg som faktiskt fungerar 2026 och inte krockar med Gutenberg
• Få shortcodes för knappar, flikar, accordions, notiser, gallerier, kolumner och anpassade HTML/CSS/JS-inlägg
• Jämför visuella sidbyggare, från lätta (Live Composer, SiteOrigin) till professionella (Elementor, Breakdance)
• Välj ett verktyg för din uppgift: kirurgiska shortcodes eller full drag-och-släpp

Shortcode-tillägg: kirurgiska verktyg för jobbet

Shortcodes är bra just för att de inte drar med sig ett ekosystem. Ett tillägg, och en knapp dyker upp i din editor för att infoga flikar, notiser, knappar och kolumner. Ingen overhead, inga konflikter med temat. Här är vad som faktiskt fungerar 2026.

1. Shortcodes Ultimate

Det mest populära gratis shortcode-tillägget i WordPress arkiv, 400 000+ aktiva installationer och 50+ färdiga element. Flikar, accordions, knappar, gallerier, sliders, karuseller, lightboxar, kolumner, ikonblock, Google Maps, adaptiva tabeller, allt infogas via en knapp i den klassiska editorn eller genom ett inbyggt Gutenberg-block.

Tillägget är fullt kompatibelt med blockeditorn: varje shortcode har sitt eget block, så du behöver inte komma ihåg syntax. Inbyggd CSS-editor låter dig åsidosätta stilar för temat, och RTL-stöd räddar dig i flerspråkiga projekt. Grundversionen är gratis, Pro-tillägg ($39/år) lägger till Extra Shortcodes (tidslinje, pristabell, bildkarusell) och tar bort kreditering.

Fördelar: enorm användarbas, aktiv support, Gutenberg-block, CSS-editor. Nackdelar: vissa standardstilar kräver justering för anpassade teman, Pro-funktioner endast via prenumeration.

🔗 Shortcodes Ultimate på WordPress.org

2. Shortcoder

Shortcoder löser en fundamentalt annorlunda uppgift: det tillhandahåller inte färdiga knappar och flikar, utan låter dig skapa dina egna shortcodes med valfri HTML, CSS och JavaScript. Slå in Google AdSense-kod i en shortcode och infoga den var som helst med en tagg. Skriv ett anpassat block med parametrar, skicka dem via shortcode-attribut.

Idealiskt för den som behöver kirurgiskt bädda in tredjepartskod utan att redigera temamallar. Stöder laddning av CSS/JS-filer till mediabiblioteket, länkar till externa CDN-skript och skapande av HTML-utdrag med platshållare som ersätts av attributvärden vid infogning. Gratis, 60 000+ aktiva installationer.

Fördelar: obegränsad anpassning, parametriserade shortcodes, fungerar med externa skript. Nackdelar: kräver grundläggande HTML/CSS/JS-kunskaper, inte för att "bygga en knapp med ett par klick".

🔗 Shortcoder på WordPress.org

3. Meks Flexible Shortcodes

Lättviktigt och trevligt tillägg från Meks-teamet, skapare av populära teman för publicister och bloggar. Bara 12+ shortcodes, men var och en finslipad: notiser med anpassningsbar färg, förloppsindikatorer, knappar i tre storlekar, avskiljare, kolumner och markeringsblock. Ingen inställningsdjungel, klickade på en knapp i visuell editor, valde en shortcode från rullgardinsmenyn, fyllde i 2-3 parametrar och infogade.

Tillägget är specifikt utformat så att stilar minimalt krockar med temat: använder en neutral färgpalett och teckensnittsarv. Gratis, utan Pro-versioner och merförsäljning. 20 000+ aktiva installationer.

Fördelar: enkelhet som gränsar till "installera och glöm", stilar lever i harmoni med temat, noll merförsäljning. Nackdelar: få element, bara grunderna, inga sliders, gallerier, flikar.

🔗 Meks Flexible Shortcodes på WordPress.org

4. Events Shortcodes för The Events Calendar

Ett högspecialiserat tillägg för sajter som kör The Events Calendar (800 000+ installationer). Grundkalendern matar ut evenemang via sina mallar, men vad gör du om du behöver infoga en lista över kommande evenemang i en sidopanel eller på en anpassad sida? Events Shortcodes lägger till kortkoder för att visa evenemang som en lista, minimalistisk lista eller tidslinje.

Pro-versionen ($49/år) lägger till visning per plats, evenemangssliders, kalendergrid och filtrering efter kategorier. Ett måste för konferenssajter, teatrar och utbildningsplattformar.

Fördelar: täpper till en kritisk lucka i The Events Calendar, tre visningslägen. Nackdelar: kräver att The Events Calendar är aktivt, Pro kostar $49/år.

🔗 Events Shortcodes på WordPress.org

Sidbyggare: när shortcodes inte räcker

Shortcodes är bra för kirurgiska redigeringar. Men om du behöver bygga en landningssida från grunden, sätta ihop en anpassad startsida eller bygga om en inläggsmall, då kommer visuella byggare in i bilden. Här är vad som är relevant 2026.

5. Elementor

Den mest populära sidbyggaren i WordPress-ekosystemet, 16+ miljoner aktiva installationer. Drag-och-släpp-gränssnitt med liveförhandsvisning, 100+ widgets i gratisversionen och 300+ i Pro ($59/år för en sajt). Containersystem på Flexbox, anpassade brytpunkter för responsivitet, nästlade flikar och dragspel, dynamiskt innehåll från ACF och anpassade fält.

Elementor har sedan länge gått bortom "sidbyggare": det är en full plattform med temabyggare, popups, WooCommerce-sidor och loop-byggare för arkiv. Pro-licensen inkluderar 100+ färdiga kit för snabb start. För kundsajter och byråarbete, branschstandard.

Fördelar: största communityn, massor av färdiga mallar, djup WooCommerce-integration. Nackdelar: genererar många DOM-element, kan bli långsamt på svag hosting, utträde ur ekosystemet är smärtsamt.

🔗 Elementor på WordPress.org

6. WPBakery Page Builder

Tidigare Visual Composer, en av de äldsta och mest spridda byggarna (ingår i tusentals premiumteman på ThemeForest). Backend-redigerare med drag-och-släpp-moduler och frontend-lightbox för finjustering. Byggd på jQuery UI och Bootstrap, inkluderar 50+ innehållsmoduler och "block", motsvarigheten till shortcodes för Google Maps, sociala ikoner, dragspel, flikar och knappar.

Licens, $59 (engångsbetalning) för en sajt med livstidsuppdateringar. För teman där WPBakery ingår är den gratis. Bland nackdelarna lämnar den många shortcodes i inläggstexten vid avaktivering (klassiskt "låst innehåll"-problem).

Fördelar: enorm temabas med paketering, engångsbetalning, mogen kodbas. Nackdelar: tungt backend-gränssnitt, låst innehåll vid byte av byggare, långsammare än konkurrenterna.

🔗 WPBakery Page Builder

7. Beaver Builder

Valet för byråer och frilansare som värdesätter stabilitet och ren kod. Beaver Builder lämnar inget shortcode-kaos efter sig vid avaktivering, innehållet förblir läsbart i WordPress-redigeraren. Frontend-drag-och-släpp med live-förhandsvisning, 30+ moduler för text, bilder, sliders, formulär, ikonboxar, kartor och pristabeller.

Gratis Lite-version på WordPress.org ger ett grundläggande modulset. Premium från $99/år (obegränsat antal sajter) inkluderar Beaver Themer för att bygga inläggsmallar, arkiv, sidhuvuden och sidfötter, en direkt konkurrent till Elementor Pro inom fullsajtsredigering. 500 000+ totala installationer.

Fördelar: ren utflyttning utan "låst innehåll", obegränsat antal sajter i premium, Beaver Themer. Nackdelar: färre moduler än Elementor, dyrare för en enda sajt.

🔗 Beaver Builder på WordPress.org

8. Divi Builder (Elegant Themes)

Divi är en visuell byggare + tema i ett paket från Elegant Themes. Fungerar både på Divi-temat och på vilket tredjepartstema som helst via Divi Builder Plugin. Visuell redigerare med inline-textredigering (klicka på rubriken och skriv), 200+ färdiga layouter, split-testning, anpassade CSS-filter, gradientmotor och rollsystem.

Licens $89/år för obegränsat antal sajter + tillgång till alla Elegant Themes-teman. Huvudfunktion, Divi Cloud för att lagra layouter och synkronisera mellan projekt. För en frilansare med ett dussin kundsajter, ekonomiskt mycket lönsamt.

Fördelar: obegränsat antal sajter i prenumerationen, 200+ färdiga layouter, inline-redigering. Nackdelar: tung backend med många sparade layouter, utträde ur ekosystemet som Elementor.

🔗 Divi Builder

9. SiteOrigin Page Builder

Ursprunglig gratis sidbyggare, 500 000+ installationer. Till skillnad från Elementor och WPBakery uppfinner SiteOrigin inga egna widgets utan använder standard WordPress-widgets i ett responsivt flerkolumnsnät. Det innebär att alla installerade widgets (från vilka tillägg som helst) omedelbart är tillgängliga för att dras in i layouten.

Redigering, backend, med ändringshistorik (återgå till valfritt steg) och förhandsvisning via klick. Tilläggspaketet SiteOrigin Widgets Bundle lägger till 25+ anpassade widgets (galleri, slider, Google Map, pristabell, kundomdömen). Helt gratis, idealiskt för den som vill stanna i WordPress-ekosystemet utan vendor lock-in.

Fördelar: gratis, använder standardwidgets, ren avaktivering utan shortcode-kaos. Nackdelar: backend-redigerare utan live-förhandsvisning, färre färdiga layouter.

🔗 SiteOrigin Page Builder på WordPress.org

10. Brizy

Brizy, "dark horse" bland byggare: fokus på UX för icke-tekniska användare. Gränssnitt med minimalistisk vänsterpanel och kontextuella kontroller direkt på arbetsytan, dra i bildens hörn och sträck ut, klicka på text och redigera. 40+ element (knappar, formulär, sliders, timers), globala färger och typografi, anpassade brytpunkter.

Gratisversion på WordPress.org med grundläggande element. Pro ($49/år för 1 sajt, $99/år för 100 sajter) lägger till popups, dynamiskt innehåll, marknadsintegrationer och sidhuvud/sidfots-byggare med visningsvillkor. Molnplattformen Brizy Cloud ($16/månad) låter dig bygga landningssidor helt utan WordPress.

Fördelar: enastående UX, snabb prototypframtagning, billig Pro för byråer ($99 för 100 sajter). Nackdelar: färre färdiga mallar än Elementor/Divi, ung community.

🔗 Brizy på WordPress.org

11. Breakdance

Ny spelare på byggarmarknaden (lanserad 2023), men redan med en imponerande grund: 140+ element, villkorad visning, dynamiskt innehåll, popup-byggare, formulär, teman, sidhuvud/sidfots-byggare, megameny och WooCommerce-byggare, allt direkt ur kartongen, inga extra avgifter för moduler.

Gränssnitt, delat läge: arbetsyta med liveförhandsvisning och höger inställningspanel. Inbyggd prestandaanalysator visar hur många DOM-element sidan genererar. $149.99/år för obegränsat antal sajter, en av marknadens bästa pris/funktions-kvoter.

Fördelar: 140+ element utan extra avgifter, inbyggd prestandaanalysator, WooCommerce direkt ur kartongen. Nackdelar: ung produkt, mindre utbildningsmaterial än Elementor.

🔗 Breakdance

12. Live Composer

Gratis byggare med öppen källkod och frontend-redigering. Till skillnad från de flesta konkurrenter som arbetar i backend eller via ett separat gränssnitt låter Live Composer dig redigera sidan precis där besökarna ser den, i frontend.

Modulär panel längst ner på skärmen: dra moduler (text, blogginlägg, gallerier, kundomdömen, kartor, knappar) till arbetsytan och se resultatet direkt. 30 000+ installationer, aktivt uppdaterad. Bra för landningssidor och snabba layouter för kampanjsidor.

Fördelar: gratis öppen källkod, live frontend-redigering, lättviktig. Nackdelar: färre element än kommersiella byggare, ingen temabyggare.

🔗 Live Composer på WordPress.org

13. Themify Builder

Byggare från den kanadensiska studion Themify med backend- och frontend-redigeringslägen. Kan bygga sidor med musen i admin eller växla till liveförhandsvisning och finjustera visuellt. 40+ moduler, inklusive bildspel, galleri, kartor, WooCommerce-produkter, formulär, ikonpanel och pristabell.

Om du använder ett Themify-tema är byggaren inbyggd gratis med Themify Framework. För teman från tredje part finns ett separat Themify Builder-plugin. Det finns tillägg för extra funktioner (tidslinje, pristabell, kontaktformulär, A/B-testning), men grunden är generös.

Fördelar: två redigeringslägen (backend + frontend), rikt modulbibliotek. Nackdelar: vissa tillägg är betalda, knuten till Themifys ekosystem.

🔗 Themify Builder

⁉️🤔 Vanliga frågor

Kan jag använda shortcodes tillsammans med Gutenberg?

Ja, och det är precis så de flesta användare gör det 2026. Gutenberg tillhandahåller ett standardblock för "Shortcode", infoga valfri shortcode från ett tillägg i inläggets brödtext. Många shortcode-tillägg (Shortcodes Ultimate, Shortcoder) registrerar också sina egna Gutenberg-block för varje element, knappar, flikar, dragspel läggs till som vanliga block, utan manuell inmatning av hakparenteser. Det finns inga konflikter mellan shortcodes och blockredigeraren: dessa är två parallella lager som samexisterar korrekt i innehållet. Gutenberg har sedan 2024 varit standardredigerare i alla nya WordPress-installationer (version 6.4+). Alla shortcode-tillägg som listas i recensionen är specifikt testade för kompatibilitet med den.

Shortcodes eller builder, vad ska man välja för en kundsajt?

Avgör utifrån ett kriterium: hur många unika sidlayouter behöver kunden. Om det är en blogg med standardlayout och ett par anpassade element (knapp, formulär, notis) räcker shortcodes mer än väl, och sajten förblir snabb. För kunder som ska fylla sajten själva spelar instegströskeln också roll: Elementor är intuitivt tydligt för en icke-teknisk användare, såg, klickade, redigerade. Shortcodes med backend-gränssnitt (Shortcodes Ultimate) är också enkla men kräver att man kommer ihåg var vilken knapp finns. Om kunden planerar att regelbundet ändra sidstruktur kommer en visuell builder att spara timmar av support.

Vad händer med innehållet om jag tar bort en builder?

Klassisk WordPress-smärta: avaktiverade buildern, och istället för innehåll såg man en massa shortcodes inom hakparenteser. Alla builders beter sig inte likadant. Beaver Builder och SiteOrigin lämnar innehållet läsbart, deras data lagras i post_content som HTML-kommentarer, och efter avaktivering visar WordPress vanlig text. Elementor och Divi genererar "låst innehåll": utan aktivt tillägg ser du bara shortcodes och JSON-uppmärkning. Om du någonsin planerar att byta builder, välj antingen SiteOrigin/Beaver Builder, eller var beredd på manuell innehållsmigrering via export/import.

Hur kontrollerar jag om en builder saktar ner sajten?

Öppna en sida byggd med buildern i Google PageSpeed Insights eller GTmetrix. Titta på DOM-storlek, om buildern genererar mer än 1500 DOM-element per sida är det en anledning att fundera. Som jämförelse: en SiteOrigin-sida med tre kolumner och fem widgets ryms vanligtvis inom 800-1000 DOM-element, medan en komplex Elementor-layout med animationer och lageröverlägg kan producera 2500+. Breakdance har en inbyggd DOM-räknare direkt i redigeraren. Ytterligare en indikator, antal HTTP-förfrågningar: builders som Elementor och Divi laddar gemensamma CSS/JS-filer på varje sida, även om specifika widgets inte används.

Vilken builder är lättast för mindre sajter?

Live Composer och SiteOrigin, två builders med öppen källkod och minimalt fotavtryck. Live Composer laddar bara det som används på sidan (on-demand-laddning av tillgångar), och SiteOrigin förlitar sig på standard WordPress-widgets utan ett eget tungt JS-ramverk. För en visitkortssajt eller liten blogg där en builder behövs för 2-3 sidor är detta ett optimalt val utan extra bagage. Om budgeten tillåter ger Brizy ($49/år) visuell UX på Elementor-nivå med betydligt mindre fotavtryck, deras JavaScript-paket är 2-2,5 gånger lättare än Elementors.

Vilket verktyg ska du välja för din uppgift

Det finns inget universellt "installera X och tänk inte mer"-svar här, shortcodes och builders löser alltför olika uppgifter. Istället kommer här en beslutsmatris för tre typiska scenarier:

"Jag har redan ett bra tema, behöver bara lägga till knappar och notiser i inlägg." → Shortcodes Ultimate. 400 000+ användare kan inte ha fel. Gratis, 50+ element, Gutenberg-block.

"Jag är frilansare, hanterar 15 kundsajter, behöver en builder för att snabbt bygga landningssidor." → Divi eller Breakdance. Divi: $89/år för obegränsat antal sajter + 200+ färdiga layouter (snabb start). Breakdance: $149,99/år, 140+ element utan extra avgifter (maximala funktioner per krona).

"Behöver bygga en landningssida och glömma, vill inte multiplicera prenumerationer." → Beaver Builder Lite (gratis) eller SiteOrigin (gratis). Båda lämnar rent innehåll vid avaktivering, installerade, byggde sida, tog bort.

"WooCommerce-sajt, behöver anpassa produktkort och varukorg." → Elementor Pro ($59/år), djup WooCommerce-integration med builder för produktsidor, varukorg och kassa. Som alternativ, Breakdance ($149,99/år) med WooCommerce-moduler direkt ur kartongen.

"Jag har en webbutik, vill lägga till kirurgiska WooCommerce-shortcodes utan builder." → Inbyggda WooCommerce-shortcodes (gratis i tilläggets kärna), 20+ funktioner för butiksfront, varukorg, orderstatusar och autentisering. Dokumentation på woocommerce.com.

Enkel regel: om uppgiften löses med en shortcode, dra inte in en builder. Om du behöver fem olika shortcodes på varje sida kommer en builder att spara tid, även om den verkar "tung".