Bädda in en gratis MP3 -spelare på din webbplats: 3 sätt

Bädda in en gratis MP3 -spelare på din webbplats: 3 sätt

Om du vill att dina webbplatsbesökare ska njuta av en MP3 -fil är ett av de enklaste sätten att göra detta att bädda in den på sidan. Med en inbyggd MP3 -spelare behöver besökare inte direkt ladda ner ljudet eller använda ytterligare programvara eftersom det spelar inline.





Vi kommer att beskriva olika metoder som du kan använda för att bädda in en MP3 på din webbplats, inklusive HTML5 och Google Drive.





1. Bädda in en MP3 på din webbplats med HTML5

Om du är bekväm med att redigera koden på din webbplats är ett av de enklaste sätten att bädda in en MP3 -fil att använda HTML5.





HTML5 taggen kan verka grundläggande vid första ögonkastet, men den är kraftfull eftersom den är kompatibel med alla större webbläsare på stationära och mobila enheter.

Om du vill bädda in en MP3 med HTML5 använder du den här koden:



Your browser does not support the audio tag.

Byt helt enkelt MP3 URL HÄR med din uppladdade ljudfil. Detta kan inte vara en fil som är lagrad på din dator. det måste vara tillgängligt online.

hur man startar om min macbook pro

Denna kod kommer att placera en liten ljudspelare på sidan, från vilken användaren kan spela, pausa, skrubba och justera volymen. Så här ser det ut på Firefox:





Denna kod innehåller också ett meddelande som kommer att visas i stället för mediaspelaren, under den osannolika omständigheten att användarens webbläsare inte stöder spelaren.

Du kan tillämpa attribut som t.ex. autospela och slinga , såhär:





Your browser does not support the audio tag.

Tänk på att de flesta webbläsare inte stöder autoplay eftersom det anses dåligt att automatiskt tvinga ljud till användare.

Grundläggande anpassning kan tillämpas på ljudspelarens block via CSS, som gräns och stoppning . Du måste dock använda JavaScript för att ordentligt styra själva spelaren så att den är konsekvent i alla webbläsare.

Mer information om HTML5 -ljudspelarens attribut och anpassning finns på MDN -webbdokument .

se vem du har blockerat på facebook

Relaterad: Coola HTML -effekter som alla kan lägga till på sina webbplatser

2. Bädda in en MP3 på din webbplats med Google Drive

Google Drive är en utmärkt och gratis molnlagringsleverantör . Du kan använda den för att ladda upp din MP3 -fil och skapa en ljudspelare.

Med MP3 överförd till Google Drive:

  1. Högerklicka filen och klicka på Få länk .
  2. Ändra tillgänglighetsbegränsningen till Alla med länken .
  3. Slutligen, klicka Kopiera länk .

Detta ger dig en URL som liknar detta:

https://drive.google.com/file/d/123/view?usp=sharing

Byta ut visa? usp = dela med förhandsvisning , såhär:

https://drive.google.com/file/d/123/preview

Använd sedan en

Du kan justera, lägga till eller ta bort attributen (som ramgräns och bredd ) som nödvändigt.

Detta kommer att bädda in MP3 på din webbplats med Google Drive -spelaren. Användare kan spela, skrubba och justera volymen, precis som med HTML5 -spelaren. Så här ser det ut:

Den största skillnaden är närvaron av en poppa ut knapp. Detta öppnar MP3 på Google Drive, där användare kan lägga till kommentarer, dela filen och mer.

3. Bädda in en MP3 på din webbplats med ett CMS

Om du använder ett innehållshanteringssystem (CMS) för din webbplats kan du troligtvis fortfarande använda metoderna ovan. Som sagt, du kanske inte är bekväm att redigera HTML -kod.

hur man tittar på instagramhistorier på datorn

Alla bra CMS låter dig enkelt lägga till ljud till din webbplats via dess gränssnitt. Till exempel, på WordPress behöver du helt enkelt lägg till ett block , Välj Audio , och sedan antingen Ladda upp MP3, välj den från din Media bibliotek , eller Infoga från URL .

Oavsett om du använder Google Sites, ExpressionEngine eller en tjänst som Squarespace kommer processen för att lägga till ljud att bli något annorlunda, så se till företagets hjälpdokumentation för fullständig vägledning.

Låt dina besökare lyssna på MP3 -filer med lätthet

Med någon av ovanstående metoder kan dina webbplatsbesökare nu enkelt lyssna på MP3 -filer via en mediaspelare.

Som sagt, du behöver inte alltid använda MP3 -filer. Det finns många andra vanliga ljudformat, som WAV och FLAC, som du också kan spela inline på din webbplats.

Dela med sig Dela med sig Tweet E-post De 10 vanligaste ljudformaten: Vilket ska du använda?

Du vet om MP3, men hur är det med AAC, FLAC, OGG eller WMA? Varför finns det så många ljudfilformat och finns det det bästa ljudformatet?

Läs Nästa
Relaterade ämnen
  • Internet
  • Webbutveckling
  • Verktyg för webbansvariga
  • HTML5
Om författaren Joe Keeley(652 artiklar publicerade)

Joe föddes med ett tangentbord i händerna och började genast skriva om teknik. Han har en BA (Hons) i Business och är nu en frilansskribent på heltid som tycker om att göra teknik enkel för alla.

Mer från Joe Keeley

Prenumerera på vårt nyhetsbrev

Gå med i vårt nyhetsbrev för tekniska tips, recensioner, gratis e -böcker och exklusiva erbjudanden!

Klicka här för att prenumerera