Namaste दोस्तों! अगर आप अपनी Website पर कुछ ऐसा Feature जोड़ना चाहते हैं जिससे Visitors ज़्यादा देर तक रुकें और आपकी Site ज़्यादा Interactive बने, तो FM Live Radio Widget एक बेहतरीन Option है। इस Beginner‑Friendly Guide में आप सीखेंगे कि अपनी Website पर FM Live Radio Widget कैसे Add करें, वो भी बिल्कुल Step‑By‑Step और बिना किसी Technical Knowledge के।
और सबसे अच्छी बात — मैं आपको इस Article में Widget Code भी दूँगा, जिसे आप बस Copy‑Paste करके आसानी से Setup कर सकते हैं 😊
आज के Digital ज़माने में Users सिर्फ Content पढ़ना ही नहीं चाहते, बल्कि कुछ Live और Entertaining चीज़ें भी पसंद करते हैं। ऐसे में अगर आपकी Website पर Live FM Radio चल रहा हो, तो Visitors को एक अलग Experience मिलता है।
चाहे आप:
- 📰 News Website चलाते हों।
- ✍ Blog लिखते हों।
- 🏢 Business Website हो।
- 🎙 Entertainment Portal हो।
FM Live Radio Widget आपकी Site को:
- ज़्यादा Interactive बनाता है।
- User Retention बढ़ाता है।
- Professional Look देता है।
अब चलिए Detail में समझते हैं 👇
FM Live Radio Widget क्या होता है?
FM Live Radio Widget एक छोटा‑सा Player होता है जो आपकी Website पर Real‑Time Radio Stream चलाता है। इसका मतलब है कि:
- Visitors आपकी Website पर रहते हुए।
- Live Radio सुन सकते हैं।
- बिना किसी App के।
- Direct Browser से।
यह Widget Automatically Stream करता है और आपको रोज़‑रोज कुछ Update करने की ज़रूरत नहीं पड़ती।
यह बिल्कुल उसी तरह काम करता है जैसे:
Mobile पर FM App बस फर्क इतना है कि यह आपकी Website के अंदर चलता है।
Website पर FM Radio Widget लगाने के फायदे
FM Live Radio Widget लगाने से आपकी Website को कई Benefits मिलते हैं:
- Visitors ज़्यादा देर तक Site पर रहते हैं।
- Bounce Rate कम होता है।
- Website Fun & Engaging बनती है।
- News या Blog Site को Extra Value मिलती है।
- Regular Audience बनने में मदद मिलती है।
खासकर:
- 🎧 Music Lovers
- 📰 News Readers
- 🧑💻 Students
- 📢 Digital Audience
को यह Feature बहुत पसंद आता है।
Widget Add करने के लिए आपको क्या चाहिए?
FM Live Radio Widget Add करने के लिए आपको सिर्फ:
- आपके पास एक WordPress Website होना चाहिए।
- Custom HTML Widget Access
- Live Radio Widget Code
- बस! और कोई Plugin जरूरी नहीं हैं।
- Step‑By‑Step – FM Live Radio Widget कैसे Add करें
अब पूरा Process बिल्कुल Easy Steps में समझते हैं 👇
Step 1: WordPress Dashboard पर Login करें
सबसे पहले अपने Browser में जाएँ और Type करें:
yourwebsite.com/wp-admin yourwebiste.com/wp-login.php
अब:
- Username
- Password
डालकर Login करें। Login होते ही आपके सामने WordPress Dashboard खुल जाएगा।
Step 2: Widgets Section खोलें
अब Dashboard से जाएँ:
Appearance → Widgets
यहाँ आपको आपकी Website के सभी Widget Areas दिखेंगे जैसे:
- Sidebar Widgets
- Footer Widgets
- Header Widgets
- Custom Widgets Areas
आप Radio Widget कहीं भी लगा सकते हैं, लेकिन Sidebar Widget Area सबसे Best जगह होती है।
Step 3: Custom HTML Widget Add करें
अब जिस Area में Widget लगाना है:
- “Add Block” पर Click करें या ।
- Search करें — Custom HTML
- उस Widget को Sidebar में Add कर दें।
अब आपके सामने एक खाली Box खुलेगा।
Step 4: FM Live Radio Widget Code Paste करें
अब नीचे दिया गया Code Copy करें और Custom HTML Box में Paste कर दें 👇
<div class=\"wp-radio-widget\">
<div class=\"wp-radio-header\">
<div class=\"wp-radio-logo\">📻</div>
<div>
<h3>FM Live Radio</h3>
<span id=\"wpRadioStatus\">Connecting...</span>
</div>
</div>
<div class=\"wp-radio-controls\">
<button id=\"wpPlayBtn\">▶ Play</button>
<button id=\"wpPauseBtn\">⏸ Pause</button>
</div>
<audio id=\"wpRadioPlayer\" preload=\"none\">
<source src=\"https://air.pc.cdn.bitgravity.com/air/live/pbaudio001/playlist.m3u8\" type=\"application/x-mpegURL\">
</audio>
</div>
<style>
.wp-radio-widget{
max-width:360px;
margin:auto;
background:#0f2027;
color:#fff;
padding:18px;
border-radius:14px;
box-shadow:0 8px 25px rgba(0,0,0,.4);
font-family:Arial
}
.wp-radio-header{
display:flex;
align-items:center;
gap:12px
}
.wp-radio-logo{
font-size:30px;
background:#fff;
color:#000;
border-radius:50%;
width:50px;
height:50px;
display:flex;
align-items:center;
justify-content:center
}
.wp-radio-header h3{
margin:0;
font-size:17px
}
#wpRadioStatus{
font-size:13px;
color:#7dd3fc
}
.wp-radio-controls{
margin-top:12px;
display:flex;
gap:8px
}
.wp-radio-controls button{
flex:1;
padding:9px;
border:0;
border-radius:6px;
font-size:14px;
cursor:pointer
}
#wpPlayBtn{background:#00c853}
#wpPauseBtn{background:#ff5252;color:#fff}
/* Mobile */
@media(max-width:480px){
.wp-radio-widget{width:95%}
}
</style>
<script>
(function(){
var player=document.getElementById(\"wpRadioPlayer\");
var status=document.getElementById(\"wpRadioStatus\");
document.getElementById(\"wpPlayBtn\").addEventListener(\"click\",function(){
player.play();
status.innerHTML=\"🔴 Live Playing...\";
});
document.getElementById(\"wpPauseBtn\").addEventListener(\"click\",function(){
player.pause();
status.innerHTML=\"⏸ Paused\";
});
player.addEventListener(\"waiting\",function(){
status.innerHTML=\"🔴 Live Playing...\";
});
})();
</script>
अब: Widget को Save करें Update करें और Done कर दे।
Step 5: Final Preview करें
अब अपनी Website Open करें और Check करें:
- Radio Player Show हो रहा है।
- Play Button काम कर रहा है।
- Sound Proper आ रहा है।
अगर तुरंत न दिखे तो:
- Page Refresh करें। अपने कंप्यूटर/लैपटॉप से Ctrl+Shift+R दबाये।
- या अपने वेब ब्राउज़र का Cache Clear करें।
क्या यह Safe है?
Yes 👍 क्योंकि:
- यह सिर्फ Audio Player है।
- कोई Heavy Script नहीं।
- WordPress Friendly है।
- Website Slow नहीं करता।
बस ध्यान रखें:
Trusted Streaming Source ही Use करें।
Common Mistakes Avoid करें
- Wrong Stream Link डालना।
- HTTPS Website पर HTTP Link Use करना।
- Cache Clear ना करना।
- गलत Widget Area चुनना।
अगर आप चाहते हैं कि आपकी Website:
- ज़्यादा Engaging बने।
- Visitors को Entertain करे।
- Professional Look दे।
तो FM Live Radio Widget एक Perfect Feature है।
और सबसे अच्छी बात — इसे Add करना इतना आसान है कि कोई भी Beginner 5 Minute में कर सकता है।
अब आपकी बारी!
अगर यह Article आपको Helpful लगा हो — तो Comment में जरूर बताइए कि आपने Radio Widget कहाँ Add किया और WordPress, Blogging, Tech Tips और Website Tools से जुड़े Daily Updates पाने के लिए हमारे Telegram और WhatsApp Channel जरूर Join करें।
आपकी Feedback ही हमारी सबसे बड़ी Motivation है ❤️
Discover more from MTECH4YOU BLOG
Subscribe to get the latest posts sent to your email.
