வேர்ட்பிரஸ்: உங்கள் வலைப்பதிவு இடுகையில் எம்பி 3 பிளேயரை உட்பொதிக்கவும்
ஆன்லைனில் போட்காஸ்டிங் மற்றும் இசை பகிர்வு அதிகமாக இருப்பதால், உங்கள் வலைப்பதிவு இடுகைகளுக்குள் ஆடியோவை உட்பொதிப்பதன் மூலம் உங்கள் தளத்தில் பார்வையாளர்களின் அனுபவத்தை மேம்படுத்த ஒரு சிறந்த வாய்ப்பு உள்ளது. அதிர்ஷ்டவசமாக, வேர்ட்பிரஸ் மற்ற ஊடக வகைகளை உட்பொதிப்பதற்கான அதன் ஆதரவைத் தொடர்ந்து உருவாக்கி வருகிறது - மற்றும் mp3 கோப்புகளைச் செய்வது எளிதானது!
சமீபத்திய நேர்காணலுக்கு ஒரு பிளேயரைக் காண்பிப்பது மிகச் சிறந்தது, உண்மையான ஆடியோ கோப்பை ஹோஸ்ட் செய்வது அறிவுறுத்தலாக இருக்காது. வேர்ட்பிரஸ் தளங்களுக்கான பெரும்பாலான வலை ஹோஸ்ட்கள் ஸ்ட்ரீமிங் மீடியாவிற்கு உகந்ததாக இல்லை - எனவே அலைவரிசை பயன்பாடு அல்லது உங்கள் ஆடியோ ஸ்டால்களை நீங்கள் வரம்பிடக்கூடிய சில சிக்கல்களில் நீங்கள் இயங்கத் தொடங்கினால் ஆச்சரியப்பட வேண்டாம். உண்மையான ஆடியோ கோப்பை ஆடியோ ஸ்ட்ரீமிங் சேவை அல்லது போட்காஸ்ட் ஹோஸ்டிங் என்ஜினில் ஹோஸ்ட் செய்ய பரிந்துரைக்கிறேன். மேலும்… உங்கள் ஹோஸ்ட் SSL ஐ ஆதரிக்கிறது என்பதை உறுதிப்படுத்திக் கொள்ளுங்கள் (ஒரு https: // path)… பாதுகாப்பாக ஹோஸ்ட் செய்யப்பட்ட வலைப்பதிவு வேறு எங்கும் பாதுகாப்பாக ஹோஸ்ட் செய்யப்படாத ஆடியோ கோப்பை இயக்காது.
உங்கள் கோப்பின் இருப்பிடம் உங்களுக்குத் தெரிந்தால், அதை வலைப்பதிவு இடுகையில் உட்பொதிப்பது மிகவும் எளிது. வேர்ட்பிரஸ் அதன் சொந்த HTML5 ஆடியோ பிளேயரை நேரடியாகக் கட்டமைத்துள்ளது, எனவே பிளேயரைக் காட்ட சுருக்குக்குறியீட்டைப் பயன்படுத்தலாம்.
நான் செய்த சமீபத்திய போட்காஸ்ட் எபிசோடில் ஒரு எடுத்துக்காட்டு இங்கே:
வேர்ட்பிரஸ்ஸில் குட்டன்பெர்க் எடிட்டரின் சமீபத்திய மறு செய்கையுடன், நான் ஆடியோ கோப்பு பாதையை ஒட்டினேன், எடிட்டர் உண்மையில் சுருக்குக்குறியீட்டை உருவாக்கினார். உண்மையான சுருக்குக்குறியீடு பின்வருமாறு, நீங்கள் விளையாட விரும்பும் கோப்பின் முழு URL உடன் src ஐ மாற்றுவீர்கள்.
[audio src="audio-source.mp3"]
வேர்ட்பிரஸ் mp3, m4a, ogg, wav மற்றும் wma filetypes ஐ ஆதரிக்கிறது. ஒன்று அல்லது மற்றொன்றை ஆதரிக்காத உலாவிகளைப் பயன்படுத்தி பார்வையாளர்கள் வருகை தந்தால் குறைவடையும் ஒரு சுருக்குக்குறியீடு கூட உங்களிடம் இருக்கலாம்:
[audio mp3="source.mp3" ogg="source.ogg" wav="source.wav"]
நீங்கள் சுருக்குக்குறியீட்டை மற்ற விருப்பங்களுடன் மேம்படுத்தலாம்:
- லூப் - ஆடியோவை லூப் செய்வதற்கான ஒரு விருப்பம்.
- தானியங்கு - கோப்பு ஏற்றப்பட்டவுடன் தானாக இயங்குவதற்கான ஒரு விருப்பம்.
- preload - பக்கத்துடன் ஆடியோ கோப்பை முன்னதாக ஏற்றுவதற்கான ஒரு விருப்பம்.
அனைத்தையும் ஒன்றாக இணைத்து, நீங்கள் பெறுவது இங்கே:
[audio mp3="source.mp3" ogg="source.ogg" wav="source.wav" loop="yes" autoplay="on" preload="auto"]
வேர்ட்பிரஸ் இல் ஆடியோ பிளேலிஸ்ட்கள்
நீங்கள் ஒரு பிளேலிஸ்ட்டை வைத்திருக்க விரும்பினால், உங்கள் ஒவ்வொரு கோப்புகளின் வெளிப்புற ஹோஸ்டிங்கையும் தற்போது வேர்ட்பிரஸ் ஆதரிக்கவில்லை, ஆனால் நீங்கள் உங்கள் ஆடியோ கோப்புகளை உள்நாட்டில் ஹோஸ்ட் செய்தால் அவை வழங்குகின்றன:
[playlist ids="123,456,789"]
உள்ளன சில தீர்வுகள் வெளிப்புற ஆடியோ கோப்பு ஏற்றுதலை இயக்கும் உங்கள் குழந்தை தீமிற்கு நீங்கள் சேர்க்கலாம்.
உங்கள் பக்கப்பட்டியில் உங்கள் பாட்காஸ்ட் ஆர்எஸ்எஸ் ஊட்டத்தைச் சேர்க்கவும்
வேர்ட்பிரஸ் பிளேயரைப் பயன்படுத்தி, உங்கள் போட்காஸ்டை ஒரு பக்கப்பட்டி விட்ஜெட்டில் தானாகக் காண்பிக்க ஒரு சொருகி எழுதினேன். உன்னால் முடியும் அதைப் பற்றி இங்கே படியுங்கள் மற்றும் சொருகி பதிவிறக்க வேர்ட்பிரஸ் களஞ்சியத்திலிருந்து.
வேர்ட்பிரஸ் ஆடியோ பிளேயரின் தனிப்பயனாக்கம்
எனது சொந்த தளத்திலிருந்து நீங்கள் பார்க்க முடியும் என, எம்பி3 பிளேயர் வேர்ட்பிரஸில் மிகவும் அடிப்படையானது. இருப்பினும், இது HTML5 என்பதால், நீங்கள் அதைப் பயன்படுத்தி சிறிது அலங்காரம் செய்யலாம் CSS ஐ. CSSIgniter ஒரு சிறந்த டுடோரியலை எழுதியுள்ளார் ஆடியோ பிளேயரைத் தனிப்பயனாக்குதல் எனவே நான் இங்கே அனைத்தையும் மீண்டும் செய்ய மாட்டேன் ... ஆனால் நீங்கள் தனிப்பயனாக்கக்கூடிய விருப்பங்கள் இங்கே:
/* 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;
}
உங்கள் வேர்ட்பிரஸ் எம்பி 3 பிளேயரை மேம்படுத்தவும்
முற்றிலும் அதிர்ச்சியூட்டும் சில ஆடியோ பிளேயர்களில் உங்கள் எம்பி 3 ஆடியோவைக் காண்பிப்பதற்கான சில கட்டண செருகுநிரல்களும் உள்ளன:
- எம்பி 3 ஸ்டிக்கி பிளேயர் வேர்ட்பிரஸ் செருகுநிரல்
- ராயல் ஆடியோ பிளேயர் வேர்ட்பிரஸ் செருகுநிரல்
- HTML5 ஆடியோ பிளேயர்கள் வேர்ட்பிரஸ் செருகுநிரல்கள் மூட்டை
- எளிதான ஆடியோ பிளேயர் வேர்ட்பிரஸ் செருகுநிரல்
- WordPress க்கான Sonaar Podcast Player
வெளிப்படுத்தல்: Martech Zone உட்பட மேலே உள்ள செருகுநிரல்களுக்கான இணை இணைப்புகளைப் பயன்படுத்துகிறது நேரடி, நன்கு ஆதரிக்கப்பட்ட செருகுநிரல்கள் மற்றும் சிறந்த சேவை மற்றும் ஆதரவைக் கொண்ட அருமையான சொருகி தளம்.