WordPress: Ingiza Kicheza MP3 katika Blogi yako

Blog Post MP3 Player na WordPress

Pamoja na podcasting na ushiriki wa muziki ulioenea mkondoni, kuna fursa nzuri ya kuongeza uzoefu wa wageni wako kwenye wavuti yako kwa kupachika sauti ndani ya machapisho yako ya blogi. Kwa bahati nzuri, WordPress inaendelea kutoa msaada wake wa kupachika aina zingine za media - na mp3 faili ni moja wapo ya ambayo ni rahisi kufanya!

Wakati kuonyesha mchezaji kwa mahojiano ya hivi karibuni ni nzuri, kukaribisha faili halisi ya sauti inaweza kuwa haifai. Wamiliki wengi wa wavuti za wavuti za WordPress hazijaboreshwa kwa media ya kutiririsha - kwa hivyo usishangae ikiwa unapoanza kushughulikia maswala kadhaa ambapo unapiga mipaka juu ya utumiaji wa bandwidth au vibanda vyako vya sauti kabisa. Ningependekeza kupakua faili halisi ya sauti kwenye huduma ya utiririshaji wa sauti au injini ya kukaribisha podcast. Na… hakikisha kuwa mwenyeji wako anaunga mkono SSL (njia ya https: // njia)… blogi inayoshikiliwa salama haitacheza faili ya sauti ambayo haijahifadhiwa salama mahali pengine.

Hiyo ilisema, unajua eneo la faili yako, kuipachika kwenye chapisho la blogi ni rahisi sana. WordPress ina kichezaji cha sauti cha HTML5 kilichojengwa moja kwa moja ndani yake ili uweze kutumia njia fupi kuonyesha mchezaji.

Hapa kuna mfano kutoka kwa kipindi cha hivi karibuni cha podcast nilichofanya:

Na upunguzaji wa hivi karibuni wa mhariri wa Gutenberg katika WordPress, nilibandika tu njia ya faili ya sauti na mhariri kweli aliunda njia fupi. Njia fupi halisi inafuata, ambapo ungechukua nafasi ya src na URL kamili ya faili unayotaka ichezwe.

[audio src="audio-source.mp3"]

WordPress inasaidia mp3, m4a, ogg, wav, na aina za faili za wma. Unaweza hata kuwa na njia fupi ambayo hutoa kurudi nyuma ikiwa una wageni wanaotumia vivinjari ambavyo haviunga mkono moja au nyingine:

[audio mp3="source.mp3" ogg="source.ogg" wav="source.wav"]

Unaweza kuongeza njia fupi pamoja na chaguzi zingine:

  • kitanzi - chaguo la kufungua sauti.
  • kucheza kiotomatiki - chaguo la kucheza faili kiotomatiki mara tu inapobeba.
  • preload - chaguo la kupakia faili ya sauti na ukurasa.

Weka yote pamoja na hapa ndio unapata:

[audio mp3="source.mp3" ogg="source.ogg" wav="source.wav" loop="yes" autoplay="on" preload="auto"]

Orodha za kucheza za sauti katika WordPress

Ikiwa unataka kuwa na orodha ya kucheza, WordPress haishikilii upangishaji wa nje wa kila faili yako ya kucheza, lakini inatoa ikiwa unashikilia faili zako za sauti ndani:

[playlist ids="123,456,789"]

Kuna suluhisho zingine huko nje ambayo unaweza kuongeza kwenye Mandhari yako ya Mtoto ambayo itawezesha upakiaji wa faili ya sauti ya nje.

Ongeza Podcast yako ya RSS Feed kwa Mwambaaupande wako

Kutumia kichezaji cha WordPress, niliandika programu-jalizi kuonyesha podcast yako kiatomati kwenye wijeti ya pembeni. Unaweza soma juu yake hapa na pakua programu-jalizi kutoka kwa hazina ya WordPress.

Uboreshaji wa Kicheza sauti cha WordPress

Kama unavyoona na wavuti yangu mwenyewe, kicheza MP3 ni msingi wa msingi katika WordPress. Walakini, kwa sababu ni HTML5, unaweza kuivaa kidogo kutumia CSS. CSSIgniter ameandika mafunzo mazuri juu kubinafsisha kicheza sauti kwa hivyo sitairudia yote hapa… lakini hapa kuna chaguo unazoweza kubadilisha:

/* Player background */
.mytheme-mejs-container.mejs-container,
.mytheme-mejs-container .mejs-controls,
.mytheme-mejs-container .mejs-embed,
.mytheme-mejs-container .mejs-embed body {
  background-color: #efefef;
}

/* Player controls */
.mytheme-mejs-container .mejs-button > button {
  background-image: url("images/mejs-controls-dark.svg");
}

.mytheme-mejs-container .mejs-time {
  color: #888888;
}

/* Progress and audio bars */

/* Progress and audio bar background */
.mytheme-mejs-container .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
.mytheme-mejs-container .mejs-controls .mejs-time-rail .mejs-time-total {
  background-color: #fff;
}

/* Track progress bar background (amount of track fully loaded)
  We prefer to style these with the main accent color of our theme */
.mytheme-mejs-container .mejs-controls .mejs-time-rail .mejs-time-loaded {
  background-color: rgba(219, 78, 136, 0.075);
}

/* Current track progress and active audio volume level bar */
.mytheme-mejs-container .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current,
.mytheme-mejs-container .mejs-controls .mejs-time-rail .mejs-time-current {
  background: #db4e88;
}

/* Reduce height of the progress and audio bars */
.mytheme-mejs-container .mejs-time-buffering,
.mytheme-mejs-container .mejs-time-current,
.mytheme-mejs-container .mejs-time-float,
.mytheme-mejs-container .mejs-time-float-corner,
.mytheme-mejs-container .mejs-time-float-current,
.mytheme-mejs-container .mejs-time-hovered,
.mytheme-mejs-container .mejs-time-loaded,
.mytheme-mejs-container .mejs-time-marker,
.mytheme-mejs-container .mejs-time-total,
.mytheme-mejs-container .mejs-horizontal-volume-total,
.mytheme-mejs-container .mejs-time-handle-content {
  height: 3px;
}

.mytheme-mejs-container .mejs-time-handle-content {
  top: -6px;
}

.mytheme-mejs-container .mejs-time-total {
  margin-top: 8px;
}

.mytheme-mejs-container .mejs-horizontal-volume-total {
  top: 19px;
}

Boresha Kicheza chako cha MP3 cha WordPress

Pia kuna programu-jalizi zilizolipiwa za kuonyesha sauti yako ya MP3 katika vichezaji vya sauti vya kushangaza kabisa:

Ufunuo: Ninatumia viungo vyangu vya ushirika kwa programu-jalizi zilizo juu kupitia Codecanyon, tovuti nzuri ya programu-jalizi ambayo ina programu-jalizi zilizosaidiwa vizuri na huduma bora na msaada.

Unafikiri?

Tovuti hii inatumia Akismet kupunguza spam. Jifunze jinsi maoni yako yanasindika.