wilt u uw WordPress-afbeeldingen naast elkaar laten zien? Soms wilt u misschien uw foto ‘ s op een rij uitlijnen op uw website. In dit artikel laten we u zien hoe u WordPress afbeeldingen naast elkaar weer te geven.
WordPress-afbeeldingen naast elkaar weergeven
er zijn verschillende manieren om afbeeldingen naast elkaar weer te geven in WordPress. Laten we eens kijken naar drie eenvoudige methoden …
Methode 1: Links uitlijnen
voeg eerst uw foto ‘ s toe aan uw WordPress-bericht of-pagina. Klik op de knop media toevoegen in de linkerbovenhoek van de editor om de afbeeldingen te selecteren die u wilt invoegen.
zodra u uw afbeeldingen hebt geselecteerd, klikt u op de knop Invoegen in bericht.
klik nu op elke afbeelding en selecteer Links uitlijnen om de afbeeldingen naast elkaar uit te lijnen (u moet in de visuele tab staan om dit te doen).
u kunt ook “links” selecteren uit de uitlijningsoptie (onder “Instellingen voor Bijlageweergave”) in het Media-scherm invoegen voordat u op de knop Invoegen in bericht klikt.
nu worden uw afbeeldingen automatisch naast elkaar weergegeven. Hier is het resultaat:
er is één keerzijde aan deze methode. Als u tekst op dezelfde pagina als uw afbeeldingen hebt, vult deze elk leeg gebied rechts van de afbeeldingen:
Methode 2: Aangepaste CSS
toevoegen door uw eigen aangepaste CSS-code aan uw afbeeldingen toe te voegen, kunt u volledige controle hebben over hoe ze precies op uw website worden weergegeven.
controleer eerst of u uw pagina bewerkt of in tekstmodus plaatst (niet in visuele modus).
voeg in het <img> label voor uw afbeeldingen de volgende code toe:
style= "float: left; margin-right: 15px;"
dit zorgt ervoor dat uw afbeeldingen naast elkaar uitlijnen met een ruimte van 15px rechts van elke afbeelding. U moet deze code toevoegen aan alle foto ‘ s die u wilt weergeven naast elkaar, zoals hieronder weergegeven:
Hier is hoe het eruit ziet:
Als u wilt voorkomen dat tekst weergegeven aan de rechterkant van de beelden, deze code gebruiken in plaats:
style= "display: inline-block; margin-right: 15px;"
nu zal uw tekst niet rond uw afbeeldingen lopen. In plaats daarvan zal het er zo uitzien:
het enige nadeel van deze methode is dat het handmatig code moet toevoegen, wat een beetje verwarrend en tijdrovend kan zijn.
Methode 3: het gebruik van Envira Gallery
Envira Gallery is de makkelijkste methode om uw afbeeldingen naast elkaar weer te geven in WordPress. Het maakt zelfs automatisch grotere foto ‘ s in kleinere miniaturen, zodat al uw afbeeldingen er perfect uitzien wanneer ze naast elkaar worden weergegeven.
om te starten moet u de Envira Gallery plugin installeren en activeren.
ga dan gewoon naar Envira Gallery ” Nieuwe toevoegen om een nieuwe afbeeldingengalerij toe te voegen in WordPress.
voeg gewoon een naam toe voor uw afbeeldingengalerij en voeg de foto ‘ s toe die u wilt in de sectie afbeeldingen onder Envira Galerij-Instellingen.
druk op de knop Publiceren om uw wijzigingen op te slaan.
nu ziet u een dialoogvenster met de shortcodes en wat andere informatie. Kopieer en plak een van deze shortcodes in de pagina of post waar u uw afbeeldingen naast elkaar wilt laten zien.
(voor een gedetailleerde tutorial, kijk op hoe je een fotogalerij met miniaturen in WordPress te maken.)
dat is het! Hier is een voorbeeld van hoe uw afbeeldingen zullen verschijnen op uw website:
u kunt Envira gebruiken om afbeeldingen van verschillende hoogtes naast elkaar weer te geven. Voor onze tutorial over dat, kijk op hoe je een metselwerk fotogalerij in WordPress te creëren.
we hopen dat dit artikel u heeft geholpen om te leren hoe u WordPress afbeeldingen naast elkaar weer te geven. U kunt ook kijken op onze gids over het maken van een afbeelding slider voor uw WordPress galeries.
als je dit artikel leuk vindt, VOLG ONS dan op Facebook en Twitter voor meer Gratis WordPress tutorials.