Jun 112013
 
Article WordPress

This post explains the procedure to embed in a post of a free blog on wordpress.com a video or audio from youtube, that autoplays when the page is visited, without the user having to click on the “play” button.

Documented shortcodes for the embedding of audio and vídeo

In the jetpack documentation there is a list of available “shortcodes” in a wordpress.com blog to embed in a post references to video and audio resources from several external services (flickr, vimeo, youtube).

The problem with the documented shortcode for the embedding of a video from youtube is that it does not allow to specify the option “autostart” to make the video start playing automatically when the page is visited.

gigya shortcode

However, there is an undocumented shortcode “gigya” that is also available in a free blog, that allows to specify the option “autostart”.

Inserting an autoplay video from youtube

Once we have located in youtube the video that we want to embed in our post, we must copy the url that appears in the address bar. For instance:

In this url, the value 1SuXOnBmDm8 is the video id.

Then, the video can be embedded in our post using the shortcode:

where VIDEO-ID is to be replaced with the video id retrieved from the video url at youtube.

As we can see in the example, the parameter “autoplay=1” has been included in the shortcode, making the video start playing when the page is visited.

Inserting background music

In the same way, we can embed a youtube video that only contains music, to be listened while the page is being visited.

To hide the player controls, the page can be edited using the “Text” editor (also known as “HTML editor” in previous versions of wordpress), to place the gigya shortcode inside a div element with the css attribute “display:none”:

To make the music play in all pages of the blog, the shortcode can be placed inside a “Text” widget in the sidebar, instead of including it in the content of each post.

References:

 Posted by at 3:41 pm

 Leave a Reply

(required)

(required)