Så här visar du foton i WordPress i Column och Row

Vill du visa WordPress-bilder i Column eller Row?

Som standard lägger WordPress till images i en vertikal column högst upp på varandra. Men om du lägger till flera foton i ett blogginlägg ser det inte särskilt snyggt ut och det är obligatoriskt för dina användare att rulla.

I den här artikeln visar vi dig hur du enkelt kan displayed WordPress bilder i Column och Row.

Varför du behöver WordPress-foton i Column och Row

Som standard, när du lägger till flera images i ett blogginlägg i WordPress, visas de precis bredvid varandra eller högst upp på varandra.

Det ser inte så bra ut, och dina användare måste rulla mycket för att kunna view flera images och foton.

Du kan enkelt lösa detta problem genom att visa foton i row och columns med en grid-baserad layout. På så sätt kommer images att visas i en kompakt layout och förbättra användarupplevelsen på din website.

Om du har en website för fotografering kan du visa din portfölj på ett mer engagerande sätt. Eller så kan du visa fler produkt images i en online store genom att displaya dem i row och columns.

Med detta sagt, låt oss ta en titt på hur du kan visa WordPress foton i Column och Row manuellt eller använda ett WordPress plugin. Klicka bara på länkarna under för att hoppa vidare till din önskade section.

1. Display Photos in Columns and Rows utan tillägg

Den här metoden kräver ej att du installerar ett plugin på din website i WordPress. Om du inte lägger till flera foton för ofta, skulle det här fungera bra för dig.

Du kan manuellt add images till ett Column block eller använda standard gallery block i WordPress.

Lägga till Images i ett Column Block

Först måste du skapa ett new post eller editera ett befintligt där du vill visa dina foton. När du är i vyn för content editor klickar du på knappen ”+” för att add to ett block med en column.

Därefter kan du välja det antal Column du gillar och dess layout.

You can for instance choose a 50/50 ratio, 33/66 ratio, 25/50/25 ratio, and more.

Efter det kan du add to ett image block till varje column.

Klicka bara på knappen ”+” och välj blocket ”Image”.

Därefter måste du lägga till en image i blocket.

Du kan klicka på knappen ”Upload” för att add to en image från din dator eller välja alternativet ”Mediabibliotek” för att använda en befintlig bild.

När mediabiblioteket öppnas väljer du helt enkelt din valda image och clickar på knappen ”Select”.

En av de bästa metoderna för bildoptimering är att add to en alt-text till din image. This allows search engine bots to understand your image and show it in image search results.

You should now see your image in one of the column blocks.

Nu kan du göra samma sak för andra block i Column och add to fler images.

Lägga till Images i ett Gallery Block

WordPress erbjuder också ett standard gallery block som du kan använda för att visa images i columns och rows.

Börja med att clicka på knappen ”+” och add to ett Gallery block i content editor.

Därefter måste du ladda upp images eller välja från mediabiblioteket.

I den här tutorialen väljer vi alternativet ”Mediabibliotek”.

Sedan är det bara att selecta de images som du gillar att add to your gallery och displaya dem i rows och columns.

När du har valt bilderna klickar du på knappen ”Create a new gallery” (Skapa ett nytt gallery).

Därefter kommer WordPress att be dig att enter captions för varje image och omorganisera ordern på bilderna.

När du har gjort det klickar du bara på knappen ”Insert gallery”.

You should now see your images in the gallery block.

Du kan justera antalet row genom att clicka på slidern i panelen Settings till höger.

När du är klar är det bara att publicera din post för att view images in columns and rows.

Det är bara att besöka your site för att se dem i action.

Den här metoden skulle fungera för de flesta Beginnare. Men om du run en fotografering blogg eller ofta delning bilder på din website, då denna metod saknar flera viktiga funktioner.

Till exempel beror bildernas appearance på your WordPress theme och you är limiterad till en viss layout och stil.

Dina images kommer ej att öppnas i en lightbox popup och användarna måste hämta dem som en new page och sedan trycka på tillbaka-knappen för att komma tillbaka till originalsidan.

För en mer professionell och beautiful användarupplevelse bör du prova metoden med plugin.

2. Display Photos in Columns and Rows med hjälp av ett plugin

Det bästa pluginet för att add to foton i columns och rows är Envira Gallery. Det är det mest populära tillägget för WordPress gallery som är superenkelt att använda och erbjuder massor av funktioner.

Först måste du installera och aktivera plugin-programmet Envira Gallery. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett plugin för WordPress.

Vid aktivering måste du besöka Envira Gallery ” Settings page för att enter your license key. Du kan få den här nyckeln från ditt account på Envira Gallerys website.

Nu är du redo att skapa beautiful galleries med bilder.

Gå bara till Envira Gallery ” Add New från WordPress dashboard för att skapa ditt första gallery.

Först måste du högst upp ange ett namn för ditt gallery. Härifrån kan du välja och uppladdare filer från din dator, eller så kan du välja från mediabiblioteket i WordPress.

När du har uploadat dina foton visas de i boxen för inställningar för gallery under.

Därefter måste du klicka på tabben ”Configuration” för att customize hur du vill visa dina foton.

Med Envira Gallery kan du välja olika layouts för galleriet. För att visa images i rows och columns kan du select grid, mason och square layouts.

När du har valt layout kan du klicka på dropdown-menyn ”Number of Gallery Columns” och välja hur många kolumner du gillar att visa.

Om du rullar ner ser du fler alternativ för att customize ditt gallery. Till exempel finns det inställningar för att editera dimensionerna och storleken på your gallery.

Efter det kan du klicka på knappen ”Publicera” för att göra ditt foto gallery redo att läggas till på din WordPress site.

Nu måste du edit ett post eller skapa ett new. När du är i content editor klickar du helt enkelt på knappen ”+” för att add to blocket ”Envira Gallery”.

Härifrån kan du clicka på dropdown-menyn och selecta det gallery som du skapade tidigare.

You can now save your post and preview it to see your photos in columns and rows in a beautiful mobile-responsive photo gallery.

Nu när dina användare klickar på en thumbnail öppnas den i en beautiful popup. De kommer också att kunna browsing images utan att lämna page.

Bonus: Skapa ett Custom Theme med Image Columns & Rows

Du kan också skapa custom WordPress themes som har en placeholder för att lägga till images i columns och rows.

Det bästa sättet att skapa ett custom theme är genom att använda SeedProd. Det är den bästa drag-and-drop-webbplatsbyggaren som erbjuder förbyggda teman och massor av alternativ för customize.

Du kan lägga till ett column block till din landing page design med SeedProd och add images till rows och columns. SeedProd kommer även med ett built-in Gallery block som du kan använda för detta.

För att lära dig mer, vänligen se vår guide om hur du skapar ett customize WordPress theme utan kod.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du visar WordPress-bilder i Column och Row. Du kanske också vill se vår guide om hur man fixar vanliga image issues i WordPress och den bästa designprogramvaran för småföretag.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.