Audio Native con Webflow

Integra Audio Native en tus sitios de Webflow.

Sigue los pasos de la descripción general de Audio Native para empezar a usar Audio Native antes de continuar con esta guía.

1

Añade HTML a tu entrada de blog

Ve a tu blog de Webflow, inicia sesión y abre el editor de la entrada de blog que quieras narrar.

2

Añade el código de inserción a tu entrada de blog

Haz clic en el símbolo ”+” de la parte superior izquierda y selecciona “Code Embed” en el menú Elements.

Audio Native

Pega el código de inserción de Audio Native en el cuadro HTML y haz clic en “Save & Close”.

Fragmento de código de inserción
<div
id="elevenlabs-audionative-widget"
data-height="90"
data-width="100%"
data-frameborder="no"
data-scrolling="no"
data-publicuserid="public-user-id"
data-playerurl="https://elevenlabs.io/player/index.html"
data-projectid="project-id"
>
Loading the <a href="https://elevenlabs.io/text-to-speech" target="_blank" rel="noopener">Elevenlabs Text to Speech</a> AudioNative Player...
</div>
<script src="https://elevenlabs.io/player/audioNativeHelper.js" type="text/javascript"></script>
Audio Native
3

Cambia la posición del código insertado

En el Navigator, coloca el código insertado donde quieras que aparezca en la página.

Audio Native
4

Publica los cambios

Por último, publica los cambios y ve a la versión publicada de la entrada de blog. Deberías ver un mensaje que te informa de que se está creando el proyecto de Audio Native. Tras unos minutos, el texto de tu blog se convertirá en un artículo de audio y aparecerá el reproductor de audio insertado.

Audio Native