Code gebruiken om audio en video aan de Website Builder-site toe te voegen

Naast het gebruik van een van onze vele widgets, kun je ook audio en video toevoegen aan je site in Website Builder met HTML en de code-component. In deze handleiding leggen we uit hoe.

• Stap 1 - Upload het audio- of videobestand naar de webruimte
• Stap 2 - Open Website Builder
• Stap 3 - Embed de code in Website Builder
• Stap 4 - Opslaan en Publiceren

Opmerking: De code-component is een Website Builder en + E-commerce-functie. Als je momenteel Starter gebruikt, kun je je pakket upgraden of in plaats daarvan de gebruiken. 

Stap 1 - Upload het audio- of videobestand naar de webruimte

Upload eerst het audio- of videobestand naar de webruimte via File Manager of FTP. Audio moet in mp3-formaat zijn en video in mp4.

1. Log in op het one.com Configuratiescherm.
2. Open File Manager onder Hostinginstellingen in het menu aan de linkerkant.
3. Klik op + Uploaden en selecteer het audio- (mp3) of video- (mp4) bestand dat je op de site wilt insluiten.
4. Kopieer het volledige pad van het bestand en plak het in een tekstbestand voor later gebruik.

Stap 2 - Open Website Builder

1. Open Website Builder.
2. Klik op Widgets in het menu met componenten aan de linkerkant.
3. Scroll naar beneden en selecteer Code.

Stap 3 - Embed de code in Website Builder

1. Kopieer een van de onderstaande codevoorbeelden en plak deze in de code-component in Website Builder.
2. Vervang FULL PATH in het codevoorbeeld door het volledige pad naar het audio- of videobestand.
3. Klik op Opslaan.

Kies een van de onderstaande voorbeelden of maak je eigen code met de <audio> tag en <video> tag. Vergeet niet om FULL PATH te vervangen door het volledige pad naar je audio- of videobestand.

Audio:

Een mp3-audiobestand insluiten:

</audio>

Een mp3-audiobestand insluiten dat automatisch wordt afgespeeld:

</audio>

Let op: Sommige browsers beperken het automatisch afspelen van audio of video, zelfs als je deze aan de code hebt toegevoegd.

Video:

Een mp4-videobestand insluiten:

</video>

Embed een mp4-videobestand dat automatisch wordt afgespeeld:

</video>

Tip: De standaardgrootte van de video is 640x480. Je kunt de grootte aanpassen door de getallen voor breedte en hoogte in de code aan te passen. Je kunt de video ook responsief maken op het scherm van de kijker door de breedte te wijzigen naar "100%" (width="100%") en de hoogte naar "auto" (height="auto").

Stap 4 - Opslaan en Publiceren

1. De component is nu toegevoegd aan de werkruimte. Sleep de component naar de plaats waar het bestand zich op de site moet bevinden.
2. Klik op Voorbeeld om te controleren of het er naar wens uitziet.
3. Als alles goed is, klik je op Opslaan en Publiceren om de wijzigingen online zichtbaar te maken.

Tip: Voeg een toe aan de site met dezelfde afmetingen als de video en voeg de code-component toe aan de box. Dit maakt de plaatsing van de audio of video gemakkelijker te controleren. De grootte van de video wordt bepaald door de hoogte en breedte in de HTML-code.

Gerelateerde artikelen:

• Wat kan ik doen met een container-component?
• De Mobiele weergave-editor in Website Builder gebruiken