Menu

Eenvoudig video’s en foto’s plaatsen op je WordPress website

Remco 20 juni 2011

Sinds WordPress 2.9 is het erg eenvoudig om video’s, foto’s en andere content in te voegen op je WordPress website. Het enige wat je hoeft te doen is de URL van bijvoorbeeld een YouTube video te plaatsen op een lege regel in je WordPress bericht of pagina. WordPress zorgt er vervolgens automatisch voor dat de video geïntegreerd wordt in je bericht.

Een voorbeeld hiervan zie je op de volgende afbeeldingen:

WordPress transformeert dit volledig automatisch naar het volgende resultaat:

Het is ook mogelijk om gebruik te maken van de WordPress embed shortcode. Hiermee kun je exact hetzelfde realiseren, maar is het niet nodig om de URL op een lege regel te zetten. Daarnaast kun je binnen deze shortcode ook een maximum breedte en hoogte op geven:

{embed width=120 height=120}https://youtube.com{/embed}

Deze handige techniek is gerealiseerd met behulp van de oEmbed protocol. Om bijvoorbeeld een YouTube video in te voegen vraagt je WordPress website aan YouTube hoe de video geïntegreerd kan worden. Dit doet WordPress door een specifieke URL op te vragen:

http://www.youtube.com/oembed?url=http%3A//youtube.com/watch%3Fv%3DM3r2XDceM6A&format=json

Vervolgens antwoord YouTube met een stukje HTML code die WordPress vervolgens invoegt. Je kunt naast YouTube video’s ook andere media op deze manier invoegen in je WordPress bericht. Standaard kan WordPress media vanaf de volgende websites automatisch invoegen:

De kans is groot dat deze lijst in de toekomst nog zal worden uitgebreid. Er zijn overigens ook tientallen plugins die de lijst uitbreiden. De bekendste plugin is Embedly die bovenstaande lijst uitbreid met 70+ websites.

Deze techniek is overigens niet alleen erg handig voor gebruikers, maar ook voor ontwikkelaars. De techniek is namelijk op allerlei manieren in te zetten. Zo kunnen ontwikkelaars WordPress meta velden inrichten voor het instellen van bijvoorbeeld een header foto of video. Gebruikers kunnen dan door het invoeren van een URL eenvoudig een foto of video plaatsen in de header van hun website.

Ontwikkelaars kunnen hiervoor gebruik maken van de oEmbed en de WP_Embed PHP klassen. Hieronder vind je een eenvoudig code voorbeeld van hoe deze klasse is te gebruiken:

$shortcode = '{embed width=641}'. get_post_meta($post->ID, '_video_url', true) .'{/embed}';
$embed = new WP_Embed();
echo $embed->run_shortcode($shortcode);

Dankzij deze techniek kunnen we WordPress thema’s nog flexibeler en krachtiger inrichten. Voor ons één van de redenen om te werken met WordPress. Er zijn namelijk weinig andere Content Management Systemen die uitgerust zijn met deze techniek.

WordPress cursus volgen?

Haal het maximale rendement uit WordPress. Een extra WordPress training of WordPress cursus in het gebruik van WordPress kan dan handig zijn. Pronamic biedt deze cursus in verschillende vormen aan. Wilt u bijvoorbeeld uw redactie op locatie een korte maar effectieve training aanbieden in het gebruik van WordPress? Bij Pronamic is dit mogelijk. Ook op beheerdersniveau bieden wij interessante WordPress trainingen aan.

1 reactie

  1. Eelco Wiersma

    Thanks Remco, dit wist ik nog niet. Eindelijk weg met die half werkende plugins! ;)

Altijd op de hoogte blijven?