hoe de SoundCloud-afspeellijst in te voegen in WordPress Site?

WordPress biedt standaard shortcodes om audio en afspeellijsten in te voegen op uw site. Dit zal erg handig zijn wanneer u enkele audiobestanden host op uw eigen server. Maar de meesten van ons zijn geen muzikanten om onze eigen audio te componeren en het gebruik van iemands audio zal resulteren in Inbreuk op het auteursrecht. Hier komt de derde partijen zoals SoundCloud het aanbieden van audio hosting diensten en toestaan openbare gebruikers om de muziek te delen onder overeengekomen licenties. Ook wanneer u een groot aantal audiobestanden hebt, is het een goed idee om ze buiten uw server te hosten. Het zal niet alleen helpen om de pagina laadsnelheid van uw site te verbeteren, maar ook helpen om een breder publiek te bereiken.

In dit artikel leggen we uit hoe SoundCloud afspeellijst in uw WordPress site-zowel WordPress.com en WordPress.org site.

Stap 1 – Maak een afspeellijst aan in SoundCloud

Meld u aan voor een gratis a SoundCloud-account en maak een afspeellijst aan met uw favoriete nummers. Bekijk al uw afspeellijsten onder “Collection > Afspeellijsten” menu zoals hieronder getoond:

afspeellijsten in SoundCloud

afspeellijsten in SoundCloud

Stap 2 – Get Embed Code voor afspeellijst

klik op de afspeellijst die u wilt delen op uw WordPress site. U ziet de lijst van de nummers toegevoegd in de afspeellijst en klik op de “Share ” knop”. U kunt ook in-of uitschakelen playlist shuffling hier.

SoundCloud-afspeellijst delen

SoundCloud – afspeellijst delen

er zal een pop-upscherm zijn met drie opties voor delen: delen, insluiten en bericht. Ga naar het tabblad” insluiten”, kies het display ontwerp en krijg de embed code voor uw WordPress site.

stap 2.1-insluitcode voor WordPress.com gebruikers

SoundCloud heeft een shortcode die alleen wordt ondersteund voor WordPress.com gebruikers. Kies het selectievakje “WordPress code” om de shortcode voor uw WordPress.com site.

embed Code voor WordPress ophalen

Embed Code voor WordPress ophalen

de embed code voor WordPress.com gebruikers zullen er ongeveer zo uitzien als hieronder:


Scroll naar beneden naar het scherm en klik op “Meer opties” om de kleur te wijzigen en automatisch afspelen van uw afspeellijst in-of uit te schakelen.

enabling Autoplay

Enabling Autoplay

Bekijk het voorbeeld van uw afspeellijst en kopieer de code weergegeven in het tekstvak onder “Code and preview”.

stap 2.2-insluitcode voor WordPress.org gebruikers

als u een self-hosted WordPress.org site zorg er dan voor om het uit te schakelen “WordPress code” checkbox en krijg de embed code. Het moet een iframe code zoals hieronder weergegeven:

<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/299620824&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>

Stap 3 – invoegen van SoundCloud Embed Code in WordPress

of u de embed code voor WordPress.com of WordPress.org het invoegproces is hetzelfde en eenvoudig. Plak gewoon de embed code in uw bericht of pagina vergelijkbaar met een tekst inhoud onder “tekst” editor. U dient uw site te publiceren om de audio-speler te zien in WordPress.com site tijdens het overschakelen naar “Visual” editor zal de audio-speler in WordPress.org site. Hieronder is een echt voorbeeld van SoundCloud player op WordPress.org site.

breedte, hoogte en autoplay eigenschappen van de speler kunnen direct gewijzigd worden binnen de embed code. Het is ook mogelijk om het uiterlijk van de speler te veranderen door de parameter “visual=true” toe te voegen. Bijvoorbeeld, is de bovengenoemde standaard-speler kan worden aangepast, zoals hieronder met behulp van de opgegeven code:

<iframe width=”100%” height=”300″ scrolling=”no” frameborder=”ja” src=”https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/299620824&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true”></iframe>

U kunt de speler op sidebar en footer widget gebied door het plakken van de code in met “Tekst” – widget.

Share URL invoegen in WordPress

het is ook mogelijk om een audiospeler in te voegen met de Share URL. Wanneer u klikt op de “Share” knop, kopieer de URL onder “Share” tab en plak het op uw WordPress “Visual” editor.

Soundcloud Share URL Code

SoundCloud Share URL Code

druk op enter om te zien dat WordPress automatisch die URL converteert naar een afspeellijst zoals hieronder.

te onthouden punten

  • SoundCloud maakt het mogelijk om individuele audiotracks, afspeellijsten en uw accountprofiel te delen op uw WordPress site.
  • u kunt zowel Share URL methode als embed code methode gebruiken.
  • Share URL methode is goed voor het delen van uw eigen afspeellijsten met brede profielfoto. Embed code wordt aanbevolen voor het afspelen van andere audiobestanden.
  • Share URL moet worden geplakt in de “Visual” editor en de speler kan worden gezien in de editor.
  • Embed code voor WordPress.com site moet worden geplakt op “Visual” editor en de audio-speler zal alleen zichtbaar zijn alleen op de gepubliceerde site.
  • Inbedcode voor WordPress.org site moet worden geplakt op “tekst” editor en de speler kan worden gezien op de editor.
  • WordPress.com ondersteunt Soundcloud shortcodes terwijl WordPress.org niet waar. Dus zorg ervoor dat u de juiste embed code voor uw audio-speler te krijgen.
  • de speler kan aangepast worden door de standaard parameters in de embed code aan te passen. Maar de speler ingevoegd via een Share URL kan niet worden aangepast.
  • WordPress.org heeft veel gratis plugins om SoundCloud shortcode te maken en de afspeellijst in te sluiten.

Write a Comment

Het e-mailadres wordt niet gepubliceerd.