En muchas ocasiones es útil y necesario agregar un archivo multimedia en nuestro blog, sin importar la plataforma. Para esto podemos usar las nuevas etiquetas HTML5 las cuales ya son soportadas por los navegadores, excepto Internet Explorer, y podemos usar los archivos que queremos sin usar plugins, en el caso de que usemos WordPress.
En este caso podemos usar el archivo que tenemos en nuestro blog, pero para este ejemplo para reducir ancho de banda y recursos del servidor de mi blog en WordPress voy a usar un archivo que tengo en mi cuenta de Dropbox.
audio html5 blog
Si queremos usar un archivo de audio, lo que hacemos es agregar este código:
 <audio controls>
<source src=”URL del archivo mp3″ type=”audio/mpeg”>
<source src=”URL del archivo ogg” type=”audio/ogg”>
<embed src=”URL de tu archivo mp3″ type=”audio/mp3″ width=”200″ height=”100″/>
</audio>
Debes de reemplazar la ruta por tu archive, la fuente con el audio en .ogg es para los usuarios que usen navegadores que no soporten HTML5.
Los atributos del elemento AUDIO y VIDEO son: controls, autoplay, loop, muted, y preload
Controls: permite que se muestren los controles y el reproductor en sí.
Autoplay:  hace que el archivo se reproduzca al cargar la página.
Loop:  reproducirá el archivo una y otra vez.
Muted:  quitará el audio del archivo.
Preload:  define si el reproductor se debe cargar cuando se cargue la página.
Si queremos mostrar un video, es casi lo mismo solo que cambiamos AUDIO por VIDEO, en este caso el código quedaría así:
 <video width=”320″ height=”240″ controls>
<source src=”URL del archivo mp4″ type=”video/mp4″>
</video>

Copiando el archivo de Dropbox.

En este caso de ejemplo vamos  copiar la ruta de un archivo de dropbox que vamos a reemplazar e ingresar en el codigo.
Ingresamos a nuestra cuenta y buscamos el archivo de audio.
En el archivo hacemos clic derecho y seleccionamos “Compartir Vinculo”.
Inmediatamente se abrira una ventana donde hacemos clic en “Obtener vinculo” como muestra la imagen
obtemer vinculo
La ruta ahora se ha copiado y solo debemos de reemplazarla en el código anterior para insertarlo en el blog.
Deben recordar que para insertar el código en un post deben de selección la vista del editor en HTML o TEXT como muestra WordPress.