Hur man visar WordPress-widgets i kolumner

Widgets låter dig lägga till dynamiskt innehåll i områden som du inte kan redigera med den vanliga WordPress-innehållsredigeraren. Folk lägger ofta till widgets i sidofältet, men du kan visa dem i andra områden i flera kolumner.

Detta tillvägagångssätt gör att du kan organisera och presentera innehåll mer effektivt, vilket gör din webbplats visuellt tilltalande och lättare att navigera.

På WPBeginner har vi använt vår webbplats sidfot för att förbättra användarupplevelsen och driva engagemang. Genom att genomtänkt arrangera flera widgets i kolumner kan vi visa upp våra varumärken, ge enkel åtkomst till gratisverktyg, ge länkar till viktiga resurser och uppmuntra till vidare utforskning av vår webbplats.

I den här artikeln visar vi dig hur du enkelt kan visa WordPress-widgets i kolumner.

Varför visa WordPress-widgets i kolumner?

Widgets är ett utmärkt sätt att lägga till bildgallerier, flöden från sociala medier, kalendrar, slumpmässiga citat, populära inlägg och annat dynamiskt innehåll till din WordPress-webbplats.

Men om du lägger till många widgetar kan det börja se förvirrande och rörigt ut.

Om detta händer, rekommenderar vi att du organiserar dina widgets i kolumner. Detta gör att du kan visa mycket innehåll på ett strukturerat sätt. Du kan till och med lägga till underrubriker till kolumnerna för att hjälpa besökare att hitta det de letar efter snabbare.

Med det i åtanke, låt oss se hur du kan visa widgets i kolumner. Använd helt enkelt snabblänkarna nedan för att hoppa direkt till den metod du vill använda:

• Metod 1: Kontrollera ditt WordPress-tema för en widget-klar sidfot
• Metod 2: Använd redigeraren för sidor och inlägg (fungerar med alla teman)
• Metod 3: Skapa ett anpassat WordPress-tema (fullt anpassningsbart)
• Metod 4: Använd Full-Site Editor (endast blockbaserade teman)
• Bonus: Visa WordPress-foton i kolumner

Metod 1: Kontrollera ditt WordPress-tema för en widget-klar sidfot

Vissa WordPress-teman har flera widget-redo områden i sidfoten. I det här fallet kommer varje område att visas som en separat kolumn.

Detta är perfekt om du vill lista information eller länkar i din webbplats sidfot. Du kan till exempel visa din kontaktinformation, en lista över alla produkter i din WooCommerce-butik, eller din webbplats viktigaste länkar.

För fler idéer, se vår checklista med saker att lägga till i sidfotsområdet på WordPress.

För att kontrollera om ditt tema har flera widget-redo områden i sidfoten, gå till Utseende » Widgetar i WordPress-instrumentpanelen.

Leta här efter områden märkta 'Sidfot' eller liknande.

Temat ovan har två widget-redo områden, så vi kan använda dem för att visa widgets i kolumner.

Klicka helt enkelt för att expandera något av dessa områden och börja lägga till de widgets du vill visa. För mer detaljerade instruktioner, se vår guide om hur man lägger till och använder widgets i WordPress.

När det är gjort, klicka för att expandera nästa widget-redo sidfotsområde och lägg sedan till de widgets du vill visa i den kolumnen.

Upprepa helt enkelt dessa steg för varje sidfältsområde.

När du har lagt till widgets, glöm inte att klicka på knappen 'Uppdatera' för att spara dina ändringar. Du kan nu besöka din WordPress-webbplats och skrolla till sidfoten för att se dina widgets organiserade i kolumner.

Metod 2: Använd redigeraren för sidor och inlägg (fungerar med alla teman)

Ett annat alternativ är att använda standard WordPress blockredigerare för att lägga till kolumner i dina sidor och inlägg. Detta gör att du kan styra exakt var widgets visas på din webbplats, inklusive inuti inläggsinnehållet.

Det är också ett bra alternativ om du vill visa unika widgets på varje sida.

Dock måste du lägga till widgets på varje sida och inlägg manuellt. Med det sagt kan den här metoden ta lång tid, särskilt om du vill visa samma widgets på varje sida.

För att använda den här metoden, öppna sidan eller inlägget där du vill lägga till widgets i kolumner. Klicka sedan på '+' -knappen och skriv 'Columns'.

När rätt block visas, dra och släpp det på din layout.

Du kan nu välja antalet kolumner du vill visa och hur mycket utrymme varje kolumn ska uppta.

Till exempel skapar vi i följande bild tre kolumner som var och en tar upp 33 % av det tillgängliga utrymmet.

När det är gjort, klicka på '+' ikonen i den första kolumnen.

I popup-fönstret som visas väljer du widgeten som du vill lägga till i den här kolumnen.

Du kan anpassa widgeten med hjälp av inställningarna i menyn till höger. Du kan till exempel ändra bakgrundsfärgen, lägga till länkar eller ändra teckenstorleken.

Du kan också använda block för att skapa underrubriker, listor och annat innehåll. Detta kan ge lite extra struktur och kontext till dina widgets.

Upprepa helt enkelt dessa steg för att lägga till fler widgets i kolumnerna.

När du är nöjd med hur kolumnerna är inställda, klicka antingen på 'Uppdatera' eller 'Publicera' för att göra kolumnerna och widgetarna live.

Metod 3: Skapa ett anpassat WordPress-tema (fullt anpassningsbart)

Även om det är möjligt att organisera och visa widgets i flera kolumner med hjälp av de inbyggda WordPress-verktygen, kan du ibland behöva mer kontroll över layouten.

Du kanske också vill lägga till kolumner till vackra landningssidor eller säljsidor som har en helt anpassad design.

I så fall rekommenderar vi att du använder SeedProd.

SeedProd är det bästa WordPress sidbyggarplugin på marknaden och låter dig designa ditt tema utan att skriva en enda kodrad. Detta innebär att du kan lägga till så många kolumner och widgets du vill till vilket område som helst på din webbplats.

SeedProd har också ett växande bibliotek med professionella mallwebbplatskit som du kan lägga till på din webbplats med ett enda klick.

Först måste du installera och aktivera SeedProd-pluginet. För mer information, se vår steg-för-steg-guide om hur man installerar ett WordPress-plugin.

Notera: Det finns en gratis version av SeedProd som låter dig skapa anpassade sidor, inklusive underhåll och "kommer snart"-sidor, oavsett din budget. I den här guiden kommer vi dock att använda premium-pluginet eftersom det kommer med temabyggaren. Var bara medveten om att du behöver SeedProd Pro eller en högre plan för att använda temabyggaren.

Efter aktivering, gå till SeedProd » Inställningar och ange din licensnyckel.

Du hittar denna information på ditt konto på SeedProd-webbplatsen. Klicka sedan på knappen ‘Verifiera nyckel’.

När det är gjort, gå till sidan SeedProd » Theme Builder och klicka på knappen 'Theme Template Kits'.

Du kommer nu att se SeedProds bibliotek med webbplatsmallar.

För att titta närmare på en mall, för muspekaren över den och klicka sedan på förstoringsglaset när det visas.

Detta öppnar mallpaketet i en ny flik.

Eftersom det är ett komplett webbplatskit kan du se fler sidor och designer genom att klicka på de olika länkarna, knapparna och menyalternativen.

SeedProd har mallpaket för olika branscher och nischer som restaurangwebbplatser, resebloggar, marknadsföringskonsultfirmor och mer.

När du hittar en mall du vill använda, för muspekaren över den och klicka sedan på kryssikonen när den visas.

SeedProd kommer nu att lägga till alla olika mallar i WordPress-instrumentpanelen.

För att titta närmare, gå till SeedProd » Temabyggare. Du kan se något annorlunda alternativ beroende på vilket kit du använder.

Håll muspekaren över mallen där du vill lägga till widgetkolumnerna och klicka sedan på länken ‘Redigera design’.

Om du till exempel ville visa widgetkolumner i sidfotsområdet, skulle du behöva redigera sidfotsmallen.

Detta laddar SeedProd-redigeraren med mallen till höger om skärmen.

På vänster sida ser du en meny med olika alternativ.

De flesta kit levereras redan med inbyggda block. För att anpassa ett block, klicka bara för att välja det i sidförhandsgranskningen och gör sedan eventuella ändringar i menyn till vänster.

Till exempel, om du ville ersätta en platshållare, skulle du behöva välja blocket Text eller Rubrik och sedan skriva i den lilla textredigeraren.

Du kan också helt ändra hur kitet ser ut med hjälp av inställningarna i menyn till vänster, inklusive att ändra färgschemat, teckensnittsval, länkfärg, knappar och mer.

De flesta av dessa inställningar är ganska självförklarande, så det är värt att välja olika block i din layout och sedan titta igenom inställningarna.

För att skapa dina kolumner, skrolla till sektionen 'Standard' i menyn till vänster.

Här hittar du blocket 'Kolumn' och drar och släpper det till området där du vill arrangera widgets i kolumner.

Du kan nu välja hur många kolumner du vill skapa och hur mycket utrymme varje kolumn ska ta upp.

För att göra detta, klicka helt enkelt på layouten som du vill använda.

Du kan nu börja lägga till widgets i dina kolumner.

I menyn till vänster, hitta varje widget och dra den sedan till kolumnen där du vill visa den widgeten.

Efter att ha lagt till en widget, klicka för att välja den i liveförhandsgranskningen.

Du kan sedan använda inställningarna i menyn till vänster för att anpassa den widgeten. För att se ännu fler anpassningsinställningar, klicka på fliken ‘Avancerat’.

Här kan du lägga till CSS-animationer, ändra avståndet, lägga till en kantlinje och mer.

Upprepa helt enkelt dessa steg för att lägga till fler widgets i dina kolumner. När du är nöjd med hur sidan ser ut, klicka på knappen 'Spara' för att lagra dina ändringar.

Du kan nu fortsätta att redigera resten av ditt WordPress-tema. För mer information, se vår kompletta guide om hur man skapar ett anpassat WordPress-tema för nybörjare.

När du är nöjd med hur mallarna är inställda är det dags att göra kitet live.

Gå till SeedProd » Temabyggare i WordPress-instrumentpanelen och klicka på växlingsknappen ‘Aktivera SeedProd-tema’ så att den visar ‘Ja.’

Du kan nu besöka din WordPress-blogg eller webbplats för att se det nya anpassade temat i aktion.

Metod 4: Använd Full-Site Editor (endast blockbaserade teman)

Om du använder ett blockaktiverat WordPress-tema, kan du lägga till kolumner i vilket område som helst på din webbplats med hjälp av redigeraren för hela webbplatsen.

Du kan till och med redigera områden som du inte kan ändra med hjälp av standard WordPress-innehållsredigeraren. Till exempel kan du lägga till widgets och kolumner till din webbplats 404-sidmall.

För att komma igång, gå till Utseende » Redigerare i WordPress-instrumentpanelen.

Som standard visar redigeraren för hela webbplatsen ditt temas hemmamall, men du kan lägga till kolumner och widgets i valfritt område.

För att se alla tillgängliga alternativ, välj antingen 'Malar' eller 'Mall-delar'.

Du kan nu klicka på mallen eller malldelen som du vill redigera.

WordPress kommer nu att visa en förhandsgranskning av designen. För att fortsätta och redigera den här mallen, klicka på den lilla pennikonen.

När det är gjort, klicka på den blå ikonen '+' och skriv 'Kolumner'.

När det högra blocket visas, dra och släpp det på din siddesign.

Du kan nu välja den layout du vill använda.

Till exempel använder vi i våra bilder 33/33/33-layouten, som skapar tre kolumner som var och en tar upp 33 % av den tillgängliga bredden.

När det är gjort, klicka på den blå ikonen '+' och leta sedan upp den första widgeten du vill använda.

Du kan sedan helt enkelt dra och släppa den här widgeten till kolumnen där du vill visa den.

Om du behöver det kan du finjustera varje block med hjälp av inställningarna i menyn till höger.

Upprepa helt enkelt dessa steg för att lägga till fler widgets i dina kolumner.

När du är nöjd med ändringarna, klicka på 'Spara' för att göra dem aktiva. Om du nu besöker din WordPress-webbplats kommer du att se de nya widgets och kolumnerna i aktion.

Bonus: Visa WordPress-foton i kolumner

Om du har en fotografisajt, kanske du också vill visa alla dina fotografier i snygga kolumner och rader.

För att göra detta kan du använda Envira Gallery, som är den bästa WordPress-galleriprogramvaran på marknaden. Den låter dig skapa ett attraktivt galleri där alla bilder är organiserade i rader och kolumner för att se visuellt tilltalande ut.

Dessutom erbjuder den andra funktioner som lightbox-popups, vattenmärken, alt-bildtext och mer.

Efter aktivering av plugin, besök helt enkelt sidan Envira Gallery » Lägg till ny och klicka på knappen ‘Välj filer från andra källor’ för att ladda upp alla dina bilder från mediebiblioteket.

När du har gjort det, skrolla ner till sektionen 'För närvarande i ditt galleri' och växla till fliken 'Konfiguration'.

Här kan du välja olika layouter och antalet kolumner för dina galleribilder enligt dina önskemål.

När du är klar, klicka på knappen 'Publicera' högst upp för att spara dina inställningar. Därefter måste du öppna inlägget där du vill lägga till dina bilder i rader och kolumner och klicka på knappen 'Lägg till block' (+).

Detta öppnar blockmenyn. Dra och släpp nu helt enkelt Envira Gallery-blocket och välj sedan det bildgalleri du skapade från rullgardinsmenyn i blocket.

Slutligen, klicka på knappen ‘Uppdatera’ eller ‘Publicera’ för att spara dina inställningar. Du kan nu besöka din WordPress-webbplats för att se bilderna i rader och kolumner.

För mer information, se vår handledning om hur man visar WordPress-foton i kolumner och rader.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du visar WordPress-widgetar i kolumner. Du kanske också vill se vår guide om hur du visar dina toppkommentatorer i WordPress sidofält eller våra experttips om de bästa Gutenberg-vänliga teman för WordPress.

Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.