Skip to navigation
AudiotoolsAudio Native

Audio Native met Webflow

Integreer Audio Native in je Webflow-sites.

Volg de stappen in het Audio Native-overzicht om aan de slag te gaan met Audio Native voordat je verdergaat met deze handleiding.

1

HTML aan je blogbericht toevoegen

Ga naar je Webflow-blog, log in en open de editor voor het blogbericht dat je wilt laten voorlezen.

2

De embedcode aan je blogbericht toevoegen

Klik linksboven op het symbool ”+” en selecteer “Code Embed” in het menu Elements.

Audio Native

Plak de Audio Native-embedcode in het HTML-vak en klik op “Save & Close”.

Fragment met embedcode
    <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

De code-embed verplaatsen

Plaats de code-embed in de Navigator op de plek waar deze op de pagina moet verschijnen.

Audio Native
4

Je wijzigingen publiceren

Publiceer tot slot je wijzigingen en ga naar de liveversie van het blogbericht. Je ziet een bericht dat aangeeft dat het Audio Native-project wordt gemaakt. Na enkele minuten wordt de tekst in je blog omgezet in een audioartikel en verschijnt de ingebedde audiospeler.

Audio Native