Cómo insertar archivos de audio en WordPress usando HTML5 con un shortcode personalizado

Si deseas insertar un archivo de audio en tus entradas o páginas de WordPress de manera personalizada, puedes crear un shortcode que renderice un reproductor HTML5. Esta solución es ideal cuando quieres mayor control sobre los atributos del reproductor como autoplay, loop, preload, etc.

Este enfoque es útil si usas el editor clásico o necesitas una integración más flexible sin depender del bloque de audio de Gutenberg.

A continuación te muestro cómo crear tu propio shortcode. Solo copia y pega este código en el archivo functions.php de tu tema activo (preferiblemente un child theme):

// Shortcode para insertar audio con HTML5
add_shortcode('audio5', 'html5_audio_shortcode');
function html5_audio_shortcode($atts) {
    $atts = shortcode_atts(array(
        'src' => '',
        'autoplay' => '',
        'preload' => 'auto',
        'loop' => '',
        'controls' => 'controls'
    ), $atts, 'audio5');

    if ( empty($atts['src']) ) return ''; // No renderizar si no hay fuente

    $html = '<audio';
    foreach ( $atts as $key => $value ) {
        if ( $value !== '' ) {
            $html .= ' ' . esc_attr($key) . '="' . esc_attr($value) . '"';
        }
    }
    $html .= '></audio>';

    return $html;
}

Ejemplo de uso del shortcode:

[audio5 src="https://tusitio.com/audio/musica.mp3" autoplay="autoplay" loop="loop" preload="auto" controls="controls"]