Met restaurant

WordPress gallery

Hierboven zie je een Gallery. Dankzij een extra plugin Fancybox / Lightbox kan je er ook op klikken voor een vergroting. Met de pijltjestoetsen op je toetsenbord kan je er doorheen. Dat kan niet als je gewoon losse plaatjes invoegt: je moet eerst een Galerij aanmaken:

Linksboven elk artikel staat een knop Media Toevoegen. Daar klik je op Galerij aanmaken. Bekijk de opties, verschuif de volgorde en kies ook Link naar Media bestand.  De opties krijg je ook als je later klikt op de galerie, en dan het wijzig-ikoon.

Probeer ook de optie Uitgelichte Afbeelding (featured image). Dat is het grote plaatje bovenaan het artikel. Kan er bij elk thema anders uitzien, en sommige thema’s doen er helemaal niks mee.

Je kan losse plaatjes ook direct in een Bericht of Pagina slepen, maar dan is het geen galerie. Probeer dat ook uit, vergroot, verklein, pas de alt-tag aan en maak bijschriften. Bekijk ook Instellingen > Media.

Als je een bestaande web-pagina kopieert en inplakt, dan komen de plaatjes ook mee. De plaatjes zijn dan links naar die betreffende website, en staan dus niet in jouw Library.

Bij het toevoegen van plaatjes aan de Library maakt WordPress zelf de versies voor thumbnail, medium en groot. Dat kun je afstellen bij Instellingen > Media. De originelen kan je eventueel automatisch laten deleten met de plugin Delete Original Images.

Erg grote plaatjes kan je beter eerst kleiner maken, met Photoshop, of door ze op een Mac in een mailtje te gooien en daar Grootte Afbeelding: Groot te kiezen. Vanuit dat mailtje kan je de plaatjes dan slepen naar WordPress.

Lightbox / Fancybox

Op deze pagina is ook de plugin Easy Fancybox gebruikt, om plaatjes te kunnen vergroten en met pijltjes te kunnen bladeren. Ook nog eens responsive. Als je de plugin activeert hoef je verder niets te doen. Je kan ‘m verder afstellen bij Plugins > Easy Fancybox > Instellingen.

Audio en Video embeds

Video en audio kun je uploaden naar de Media Library, maar het is nog makkelijker om video’s van Youtube / Vimeo (of muziek van Soundcloud) direct in te plakken met de url:

http://youtu.be/mxzgwJ8tSE0 
wordt dan:

De oude manier kan ook nog, via Youtube > Delen > Insluiten, met als voordeel dat je dan ook het formaat kan aanpassen:

<iframe width="300" height="169" src="https://www.youtube.com/embed/mxzgwJ8tSE0?rel=0" frameborder="0" allowfullscreen></iframe>

Meer informatie over WordPress embeds.

Video Gallery

Met een plugin als Vimeography kun je een video gallery maken. Dat is mooier en sneller dan simpelweg veel video’s onder elkaar zetten. De plugin is gratis, maar de mooiere thema’s zijn betaald. Er zijn veel vergelijkbare alternatieve plugins zoals Tubepress en Vimeo Video Wall.

Styling met Custom CSS

Wil je afgeronde hoeken, drop-shadows, effecten bij een hover, et cetera? Dat kan met CSS via Weergave > Custom CSS. Bekijk met rechtsklik > Inspecteer element hoe je het plaatje in de CSS kan aanroepen, oftewel in welke HTML-elementen het staat. Hier op deze pagina is dat bijvoorbeeld een img in een class=gallery. Voor afgeronde hoeken en een animatie tijdens de hover plak je dit bij de Custom CSS:

.gallery img {border-radius:10px; transition:all 0.5s}
.gallery img:hover {-webkit-transform: scale(1.2) rotate(10deg);}
.gallery img:hover {transform: scale(1.2) rotate(10deg);}

Gallery plugins: NextGen

Je kan ook een gallery via een plugin maken. Bij de plugins zie je verschillende galleries staan. Probeer eerst NextGen, dat is de bekendste.

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *