vill du visa dina WordPress bilder sida vid sida? Ibland kanske du vill anpassa dina foton i rad på din webbplats. I den här artikeln visar vi hur du visar WordPress-bilder bredvid varandra.
Visa WordPress-bilder bredvid varandra
det finns flera olika sätt att visa bilder sida vid sida i WordPress. Låt oss ta en titt på tre enkla metoder …
Metod 1: Justera vänster
lägg först till dina foton i ditt WordPress-inlägg eller-sida. Klicka bara på knappen Lägg till Media från det övre vänstra hörnet av redigeraren för att välja de bilder du vill infoga.
när du har valt dina bilder klickar du på knappen Infoga i inlägg.
Klicka nu på varje bild och välj Justera vänster för att justera bilderna bredvid varandra (du måste vara i den visuella fliken för att göra detta).
Alternativt kan du välja ”vänster” från Justeringsalternativet (under ”attachment Display Settings”) inuti skärmen infoga Media innan du klickar på knappen Infoga i post.
nu visas dina bilder automatiskt sida vid sida. Här är resultatet:
det finns en nackdel med denna metod. Om du har text på samma sida som dina bilder fyller den alla tomma områden till höger om bilderna:
Metod 2: Lägg till anpassad CSS
genom att lägga till din egen anpassade CSS-kod till dina bilder kan du ha fullständig kontroll över exakt hur de visas på din webbplats.
kontrollera först att du redigerar din sida eller inlägg i textläge (inte visuellt läge).
Lägg till följande kod i taggen <img> för dina bilder:
style= "float: left; margin-right: 15px;"
detta gör att dina bilder anpassas bredvid varandra med ett utrymme på 15px till höger om varje bild. Du måste lägga till den här koden till alla bilder som du vill visa bredvid varandra, som visas nedan:
så här ser det ut:
om du vill förhindra att text visas till höger om bilderna, använd den här koden istället:
style= "display: inline-block; margin-right: 15px;"
nu kommer din text inte att lindas runt dina bilder. Istället kommer det att se ut så här:
den enda nackdelen med denna metod är att den kräver att man lägger till kod manuellt, vilket kan vara lite förvirrande och tidskrävande.
Metod 3: Använda Envira Gallery
Envira Gallery är den enklaste metoden att visa dina bilder sida vid sida i WordPress. Det gör till och med automatiskt större foton till mindre miniatyrbilder så att alla dina bilder ser perfekt ut när de visas bredvid varandra.
för att starta måste du installera och aktivera plugin-programmet Envira Gallery.
gå sedan till Envira Gallery ” Lägg till nytt för att lägga till ett nytt bildgalleri i WordPress.
lägg bara till ett namn för ditt bildgalleri och Lägg till de foton du vill ha i avsnittet Bilder under Inställningar för Envira Gallery.
se till att trycka på knappen Publicera för att spara dina ändringar.
nu ser du en dialogruta med kortkoderna och lite annan information. Kopiera och klistra in en av dessa kortkoder på sidan eller posta där du vill visa dina bilder sida vid sida.
(för en detaljerad handledning, kolla in hur du skapar ett bildgalleri med miniatyrer i WordPress.)
det är det! Här är ett exempel på hur dina bilder kommer att visas på din webbplats:
du kan använda Envira för att visa bilder med olika höjder bredvid varandra också. För vår handledning om det, kolla in hur du skapar ett murverk bildgalleri i WordPress.
vi hoppas att den här artikeln har hjälpt dig att lära dig hur du visar WordPress-bilder bredvid varandra. Du kanske också vill kolla in vår guide om hur du skapar en bildreglage för dina WordPress-gallerier.
om du gillar den här artikeln, Följ oss på Facebook och Twitter för mer gratis WordPress tutorials.
använda WordPress och vill få Envira Gallery Gratis?
Envira Gallery hjälper fotografer att skapa vackra foto-och videogallerier med bara några klick så att de kan visa upp och sälja sitt arbete.