Instellingen voor uitlijning van WordPress-afbeeldingen – Uitgelegd!

Het onderwerp van het uitlijnen van afbeeldingen is er een die vaak verkeerd wordt begrepen door WordPress-nieuwkomers. Wanneer u een afbeelding aan uw inhoud toevoegt (binnen berichten of pagina’s), biedt WordPress u vier standaardmanieren om de afbeelding uit te lijnen: ‘Links’ uitlijnen, ‘Midden’ uitlijnen, ‘Rechts’ uitlijnen en ‘Geen’ uitlijnen *.


Laten we om beurten naar elk van deze kijken:

1. Links uitlijnen

Een afbeelding waaraan een linkse uitlijning is toegewezen, wordt effectief naar de linkerkant van het gedeelte van de pagina geduwd waarin deze zich bevindt (zoals de linkergrens van uw WordPress-post met pagina-inhoud), en alle andere inhoud (zoals tekst) wikkel rond de andere drie randen – vul het gebied rechts van waar de afbeelding zich bevindt.

Voorbeeld:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Links uitlijnen Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

2. Lijn het midden uit

Als u wilt dat uw afbeelding wordt gecentraliseerd binnen het gedeelte van de pagina waar deze zich bevindt (d.w.z. met een gelijke hoeveelheid ruimte tussen de rand van het inhoudsgebied en de linker- en rechterrand), kiest u een ‘Centrale’ uitlijning. In tegenstelling tot de bovengenoemde uitlijning ‘Links’, zal alle naburige inhoud (zoals tekst) niet om de afbeelding heen lopen – deze wordt in plaats daarvan boven of onder de afbeelding geplaatst (afhankelijk van waar in de tekst die u hebt ingevoegd om in te voegen zei afbeelding).

Voorbeeld:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Tekst in het midden uitlijnen Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

3. Rechts uitlijnen

Rechts uitlijnen van een afbeelding is, zoals je zou verwachten, vrij veel precies het tegenovergestelde van links uitlijnen van een afbeelding – het beeld zal worden geduwd aan de rechterkant van het gedeelte van de pagina waarin het zit (dat wil zeggen de rechter grens van uw WordPress-post van pagina-inhoud) en alle andere inhoud (zoals tekst, enz.) Wikkelt zich rond de andere drie randen: vult daarmee het gebied aan de linkerkant ervan.

Voorbeeld:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Rechts uitgelijnde afbeelding Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

4. Uitlijnen Geen

Afbeeldingen waaraan geen uitlijning is toegewezen (door ze een uitlijning van ‘Geen’ toe te wijzen), zullen precies op de plaats zitten waar u ze plaatst – dat wil zeggen als u ervoor kiest om een ​​afbeelding te plaatsen die een uitlijning van ‘Geen’ heeft toegewezen binnen een alinea met tekst (zie het volgende voorbeeld hieronder), zal het in lijn met die tekst worden geplaatst, wat zal resulteren in tekst links en rechts van de afbeelding (ervan uitgaande dat de afbeelding niet dezelfde breedte – of breder – is dan het gebied) waarin het zit **). Het is echter verwarrend dat een afbeelding die BEIDE een uitlijning ‘Geen’ heeft toegewezen EN binnen een eigen alinea zit (dwz op een nieuwe regel in de WordPress-editor en / of specifiek binnen HTML ‘p’-tags) aan de linkerkant wordt geplaatst van het gebied waarin het zich bevindt (op dezelfde manier als wanneer het links was uitgelijnd), maar zonder tekst rechts ervan. Waarom? Omdat een afbeelding geen specifieke uitlijning heeft (of, in technische termen: geen specifieke links-of-rechts ‘zwevende’) die binnen zijn eigen alinea zit (zonder andere elementen in dezelfde alinea), wordt gescheiden van beide voorgaande en inhoud volgen door regels van vooraf gedefinieerde witruimte – op vrijwel dezelfde manier als elke andere alinea!

Voorbeeld:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed doen eiusmod Tempor incididunt ut Labore et dolore magna Aliqua. Uitlijnen Geen Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Dus wat gebeurt hier eigenlijk??

Waarom gebeurt dit allemaal? Het komt eigenlijk allemaal door een computertaal die wordt gebruikt om de presentatie (lay-out, afmetingen, kleuren, enz.) Van webelementen uit te drukken, bekend als Cascading Style Sheets – of kortweg ‘CSS’. In wezen voegt WordPress elke keer dat u bijvoorbeeld een linkse uitlijning aan een afbeelding in een bericht of pagina toewijst, een HTML-klassennaam van “alignleft” toe aan die afbeelding, die vervolgens de afbeelding effectief dwingt naar een specifieke set te verwijzen van voorgedefinieerde CSS-commando’s die het vertellen waar het op de pagina moet zitten – eenvoudig! Evenzo kent WordPress voor elk van de andere genoemde uitlijningen verschillende klassenamen toe – zoals ‘aligncenter’ (voor afbeeldingen die centraal zijn uitgelijnd), ‘alignright’ (voor afbeeldingen die rechts zijn uitgelijnd) en ‘alignnone’ (voor afbeeldingen die zijn om geen specifieke uitlijning toegewezen te krijgen) – dat elk verwijst naar verschillende sets CSS-opdrachten.

Toegegeven (helaas) kan het idee om je hoofd rond de wereld van CSS-commando’s te wikkelen, een beetje ontmoedigend zijn voor de gemiddelde WordPress-gebruiker; als je er echter meer over wilt weten, zullen ze je snel in staat stellen een geheel nieuwe mate van vrijheid te krijgen als het gaat om het stylen van je inhoud – of zelfs je hele website! Als je geïnteresseerd bent in leren, bekijk dan ons eerdere bericht over waar je het beste kunt leren over het online leren van CSS – of ga gewoon naar het goede oude Google en ga los! 😉

Overzicht

Dus daar heb je het: beelduitlijningen uitgelegd! Kortom: gebruik een uitlijning naar links als u wilt dat een afbeelding links staat en andere elementen (zoals tekst, enz.) Om er rechts omheen lopen; gebruik een centrale uitlijning als u wilt dat een afbeelding in het midden / midden van uw inhoud staat zonder andere elementen aan weerszijden ervan; gebruik een uitlijning naar rechts als u wilt dat een afbeelding rechts zit en andere naburige webelementen zich er links omheen wikkelen; en gebruik een uitlijning van ‘geen’ als u wilt dat uw afbeelding precies op de plek staat waar u deze wilt plaatsen ten opzichte van de aangrenzende elementen (bijv. tekst enz.) – EN ten slotte, als u wilt dat een afbeelding zich links van de inhoud bevindt -gebied waarin het zich bevindt MAAR wil niet dat er tekst enz. rechts van verschijnt, wijs de afbeelding een uitlijning van ‘Geen’ toe en zorg ervoor dat het in zijn eigen privéparagraaf zit!

* via een vervolgkeuzemenu rechtsonder in het WordPress ‘Mediabibliotheek’ venster, onder de subkop ‘Instellingen weergave bijlagen’.

** in welk geval de tekst die normaal aan weerszijden zou zitten, nergens anders kan komen dan boven of onder de afbeelding – merk op dat dergelijke gevallen vaak kunnen leiden tot verwarring tussen alle vier de uitlijningen omdat er geen ruimte is voor andere tekst / elementen aan weerszijden van de afbeelding maakt het in wezen niet uit welke uitlijning u kiest te gebruiken!

Nuttig?

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me