ElementsKit är ett komplett Elementor-tillägg som kommer med nästan alla typer av funktioner för WordPress-webbplatser som inkluderar Elementor Audio Player-widgeten.

Med hjälp av Audio Player-widgeten kan du bädda in musik på din webbplats med en användarvänlig ljudspelareskontroll. Widgeten innehåller ett par alternativ för att ladda upp ljud, massor av ljud- och kontrollalternativ och mer.

Funktioner i Audio Player Widget: #

• Ladda upp ljud via WordPress mediabibliotek.
• Bädda in ljud med URL.
• Ljudalternativ, inklusive autoplay, loop och mute.
• Spela och pausa kontroll.
• Volymkontroll.
• Kontroll av förloppsindikator.
• Visa speltid och total längd.
• Anpassa ljudspelarens utseende.

Steg 1: Aktivera Audio Player Widget #

Först måste du aktivera widgeten från WordPress instrumentpanel. Så här aktiverar du Audio Player-widgeten:

1. Navigera till ElementsKit > Widgets.
2. Hitta Ljudspelare från listan och aktivera widgeten.
3. Klicka på SPARA ÄNDRINGAR.

Steg 2: Dra och släpp widgeten #

Efter det, dra och släpp ElementsKit Audio Player-widgeten till Elementor-redigeraren.

Steg 3: Konfigurera Elementor Audio Player Widget #

Under fliken Innehåll kan du ladda upp ljudet och konfigurera Ljudalternativ och Kontrollalternativ av ljudspelaren. Du kan använda följande alternativ för att konfigurera WordPress ljudspelare i Elementor.

3.1 Källa #

Du kan antingen ladda upp ljudfilen eller använda en URL för att lägga till ljud till spelaren. Det finns två alternativ tillgängliga för ljudkällan.

Källa – Egen värd: #

När du väljer Self Hosted som ljudkälla kan du ladda upp en ljudfil från ditt WordPress-mediebibliotek.

Välja "Self Hosted" som källa > Klicka på uppladdningsknappen > lägga till en ljudfil från mediebiblioteket.

Källa – Extern: #

Genom att välja den externa källan kan du bädda in ljud från internet med dess URL.

Välja "Extern" som källa > ange ljud-URL i det obligatoriska fältet.

3.2 Ljudalternativ #

Här är ljudalternativen som är tillgängliga med Audio Player-widgeten:

1. Autospela: Aktivera automatisk uppspelning så att ljudet automatiskt spelas upp när sidan laddas.
2. Slinga: Aktivera det här alternativet för att spela upp ljudet i en loop.
3. Stum: När det är aktiverat stängs ljudet initialt av när spelaren startar. Användare måste stänga av ljudet manuellt.

3.3 Kontrollalternativ #

Här är kontrollalternativen som är tillgängliga med Audio Player-widgeten:

1. Spela Paus: Aktiverar uppspelnings-/pauskontrollen (knappen) för användarna.
2. Förloppsindikator: För att visa ljudförloppsindikatorn på spelaren.
3. Aktuell tid: Detta visar den aktuella speltiden på Elementor-ljudspelaren.
4. Total varaktighet: Detta visar ljudets totala varaktighet.
5. Volymstapel: För att visa och kontrollera ljudvolymen.
6. Dölj volym på Touch-enheter:
7. Layout för volymreglage: Det finns två tillgängliga layouter för volymfältet: Horisontell och Vertikal.
8. Startvolym: Ställ in den ursprungliga volymnivån när spelaren startar.

Steg 4: Anpassa Elementor Audio Player Styles #

Du kan anpassa spelpausknappen, förloppsindikatorn, tid och volymstilar på Elementor Audio Player-widgeten.

4.1 Spela Paus-knapp #

För att anpassa knappen Spela paus,

1. Justera Storlek av knappen.
2. Välj knappen Färg, Bakgrundsfärg, Box Shadow, och Kanttyp för knappen.
3. Ställ in Gränsradie, Stoppning, och Marginal.

4.2 Förloppsindikator #

För att anpassa förloppsindikatorn,

1. Du kan justera Höjd av förloppsindikatorn.
2. Välj den Bakgrundsfärg av förloppsindikatorn.
3. Ställ in Kanttyp, Gränsbredd, och Gräns färg.
4. Justera Gränsradie av förloppsindikatorn.

5. Laddad förloppsindikator: Du kan välja bakgrundsfärg för den laddade förloppsindikatorn.
6. Aktuell förloppsindikator: Ställ in bakgrundsfärg och kantradie för den aktuella förloppsindikatorn.
7. Tidspekare: Välj Bakgrundsfärg för att övervaka tiden.

4.3 Tid #

För att anpassa Time-stilarna för Elementor-ljudspelaren,

1. Ställ in Typografi för textsiffrorna.
2. Välj en färg och justera Marginal för Aktuell tid.
3. Välj en färg och justera Marginal för Varaktighet.

4.4 Volym #

För att anpassa volymknappstilen,

1. Du kan justera Höjd på volymknappen.
2. Välj den Bakgrundsfärg på volymknappen.
3. Ställ in Kanttyp, Gränsbredd, och Gräns färg.

4. Volymstapel: Justera höjd, bredd, färg och kantstilar för volymfältet.
5. Aktuell volymstapel: Ställ in färg och ramradie för den aktuella volymstapeln.

Slutligen kan du använda ljudspelaren på din webbplats med alla användbara funktioner. Elementor Audio Player-widgeten kommer med ElementKits Pro. Skaffa plugin för att lägga till ljud och musik till din WordPress-webbplats på det enklaste sättet.