ब्लॉगर Thread कमेन्ट में Smiley's, Youtube विडियो कैसे दिखाए

ब्लॉगर की तुलना हमेशा ही वर्डप्रेस से की जाती रही है ॥ इसका कारन शायद ब्लॉग्गिंग हेतु यह दूसरा विस्तृत प्लेटफोर्म है ... वर्डप्रेस पर ब्लॉगर के तुलना में अधिक ब्लॉग बनाये जाने का कारन वर्डप्रेस ब्लॉग की उन्नत तकनीक और इसी के साथ विभिन तकनिकी भाषा विकल्पों जैसे html5, css, php आदि का यथासंभव प्रयोग है... वही ब्लॉगर पर भी वर्डप्रेस के मुकाबले आये दिन नयी सुविधाओ का अनावरण कर गूगल द्वारा ब्लागस्पाट प्लेटफोर्म को बेहतर बनाने का प्रयास क्रमशः जारी है ... अभी कुछ ही समय पहले ब्लॉगर द्वारा ब्लॉगर thread comments को शुरू किया गया .... शायद सभी ने इसे अपने ब्लॉग पर सक्रिय तो कर ही किया होगा ... :०)

मेरे पिछले लेख में मैने बताया था की कैसे Blogger Thread Comments में याहू स्मिले'स को दिखाया जाए ...इस लेख पर कुछ पाठको ने अपनी परेशानी बताते हुवे कहा था की ये मोजिला , और क्रोम ब्राव्सर में तो ठीक तरह कार्य करती है मगर Internet Explore में नहीं ... पाठको की इसी परेशानी के निवारण हेतु आज की इस पोस्ट में मैने बताया है की कैसे Smiley's को Internet Explore में भी ठीक तरह से दिखाया जा सके ... ध्यान दे की आज इस लेख में न सिर्फ Internet Explore में Smiley's को दिखाने हेतु tutorial , बल्कि ब्लॉगर thread कमेन्ट में youtube विडियो डालना , किसी ब्लॉग या साईट की Iframe डालना आदि हेतु भी जानकारी दी गयी है ... अतः इसे अपने ब्लॉग पर सक्रिय करने के लिए नीचे क्रमशः प्रक्रिया अपनाते चले :०)

Screenshot






Live Demo

Step 1

  • अपने blogger dashboard पर जाए
  • यहाँ जाए Dashbord > Design > Edit HTML
  • अब ऊपर Expand Widgets चेक बॉक्स पर क्लिक करे
  • यहाँ पर </body> कोड तलाशे
  • अब नीचे बताया गया पूरा कोड </body> के ठीक पहले यथावत डाल दे

<script type='text/javascript'>
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("emocomments");
theText = bodyText.innerHTML;
theText = theText.replace(/:\)\)/gi, "<img src='http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vt_XVZKI/AAAAAAAAATI/Q35_W0anT6A/21.gif'/>");
theText = theText.replace(/=d&gt;/gi, "<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vzUt1yQI/AAAAAAAAATY/QHNvnj0gYbU/41.gif'/>");
theText = theText.replace(/:d/gi, "<img src='http://lh3.ggpht.com/_u7a1IFxc4WI/TM-voxnkRKI/AAAAAAAAAS4/PjDn098vm3w/4.gif'/>");
theText = theText.replace(/:p/gi, "<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vpDb68dI/AAAAAAAAAS8/Yv0Uu3qzG_Q/10.gif'/>");
theText = theText.replace(/:\(\(/gi, "<img src='http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vt5z16MI/AAAAAAAAATE/Hx-7Thmr6do/20.gif'/>");
theText = theText.replace(/:\)/gi, "<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-voiNIw2I/AAAAAAAAASw/aav2hwqeG0c/1.gif'/>");
theText = theText.replace(/:\(/gi, "<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-voq7QQnI/AAAAAAAAAS0/UzoFJOCcPPU/2.gif'/>");
theText = theText.replace(/:-\?/gi, "<img src='http://lh5.ggpht.com/_u7a1IFxc4WI/TM-vua5MF2I/AAAAAAAAATU/N4X-ouMd1-I/39.gif'/>");
theText = theText.replace(/\[\-\(/gi, "<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vuMg6RQI/AAAAAAAAATQ/rWj7euuKOZs/33.gif'/>");
theText = theText.replace(/:-o/gi, "<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vpLiW1GI/AAAAAAAAATA/fPyPJcBks7s/13.gif'/>");
theText = theText.replace(/:-t/gi, "<img src='http://lh3.ggpht.com/_u7a1IFxc4WI/TM-vz4hwcNI/AAAAAAAAATo/4ySXuvQWma8/104.gif'/>");
theText = theText.replace(/:-ss/gi, "<img src='http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vzUOH79I/AAAAAAAAATc/oNE5H5vcNtI/42.gif'/>");
theText = theText.replace(/b-\(/gi, "<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vzrqI4MI/AAAAAAAAATk/BhfFnT0Gbro/66.gif'/>");
theText = theText.replace(/@-\)/gi, "<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vziH8NXI/AAAAAAAAATg/2evEbN2cJwc/43.gif'/>");
theText = theText.replace(/=\)\)/gi, "<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vuJ1G41I/AAAAAAAAATM/_jLHXvz6PTg/24.gif'/>");
bodyText.innerHTML = theText;
}replaceText();
//]]>
</script>

<script type='text/javascript'>
//<![CDATA[
function replaceText(){if(!document.getElementById){return;}
bodyText = document.getElementById("comment-holder");
theText = bodyText.innerHTML;
theText = theText.replace(/\[img\].*?'.*?\[\/img\]/gi, "");
theText = theText.replace(/\[nct\].*?'.*?\[\/nct\]/gi, "");
theText = theText.replace(/\[youtube\].*?'.*?\[\/youtube\]/gi, "");
theText = theText.replace(/\[img\]/gi, "<div style='clear:both'></div><img style='float:left;margin:10px 0;border:1px solid #DDD;max-width:590px;background:#FFF;padding:4px' src='");
theText = theText.replace(/\[\/img\]/gi, "'/><div style='clear:both'></div>");
theText = theText.replace(/\[youtube\]http:\/\/youtu.be/gi, "<iframe width='480' height='390' src='http://www.youtube.com/embed");
theText = theText.replace(/\[youtube\]http:\/\/www.youtube.com\/watch\?v=/gi, "<iframe width='480' height='390' src='http://www.youtube.com/embed/");
theText = theText.replace(/&amp;feature=/gi, "?rel=0' '");
theText = theText.replace(/\[\/youtube\]/gi, "?rel=0' frameborder='0' allowfullscreen></iframe>");
theText = theText.replace(/\[nct\]http:\/\/www.nhaccuatui.com\/nghe\?L=/gi, "<div style='overflow:hidden'><embed style='margin-top:-250px;width:300px;height:400px' src='http://www.nhaccuatui.com/l/");
theText = theText.replace(/\[nct\]http:\/\/www.nhaccuatui.com\/nghe\?M=/gi, "<div style='overflow:hidden'><embed style='margin-top:-350px;width:300px;height:400px' src='http://www.nhaccuatui.com/m/");
theText = theText.replace(/\[\/nct\]/gi, "' quality='high' wmode='transparent' type='application/x-shockwave-flash'></embed></div>");
}replaceText();
//]]>
</script>

Step 2

  • अब अपनी ब्लॉग टेम्प्लेट में <b:loop values='data:post.comments' var='comment'> कोड तलाशे
  • अब नीचे बताया गया पूरा कोड <b:loop values='data:post.comments' var='comment'> के ठीक पहले यथावत डाल दे

<div id='emocomments'>

Step 3

  • <b:loop values='data:post.comments' var='comment'> के बाद आपको </b:loop> कोड दिखाई देगा
  • इस कोड के ठीक नीचे </div> कोड रख दे

Step 4

  • अब अपनी ब्लॉग टेम्प्लेट में <data:blogTeamBlogMessage/> कोड तलाशे
  • अब नीचे बताया गया पूरा कोड <data:blogTeamBlogMessage/> के ठीक बाद यथावत डाल दे

<script type="text/javascript">
//<![CDATA[
function moreSmilies() {
    document.getElementById('smiley-more').style.display = 'inline';
    document.getElementById('smiley-toggle').innerHTML = '<a href="javascript:lessSmilies()">&#8592;</a></span>';
}
function lessSmilies() {
    document.getElementById('smiley-more').style.display = 'none';
    document.getElementById('smiley-toggle').innerHTML = '<a href="javascript:moreSmilies()">&#8594;</a>';
}
//]]>
</script>
<div class='emoticons'>
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-voiNIw2I/AAAAAAAAASw/aav2hwqeG0c/1.gif'/>:)
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-voq7QQnI/AAAAAAAAAS0/UzoFJOCcPPU/2.gif'/>:(
<img src='http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vt_XVZKI/AAAAAAAAATI/Q35_W0anT6A/21.gif'/>:))
<img src='http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vt5z16MI/AAAAAAAAATE/Hx-7Thmr6do/20.gif'/>:((
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vuJ1G41I/AAAAAAAAATM/_jLHXvz6PTg/24.gif'/>=))
<span id='smiley-more' style='display: none;'>
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vzUt1yQI/AAAAAAAAATY/QHNvnj0gYbU/41.gif'/>=D&gt;
<img src='http://lh3.ggpht.com/_u7a1IFxc4WI/TM-voxnkRKI/AAAAAAAAAS4/PjDn098vm3w/4.gif'/>:D
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vpDb68dI/AAAAAAAAAS8/Yv0Uu3qzG_Q/10.gif'/>:P
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vpLiW1GI/AAAAAAAAATA/fPyPJcBks7s/13.gif'/>:-O
<img src='http://lh5.ggpht.com/_u7a1IFxc4WI/TM-vua5MF2I/AAAAAAAAATU/N4X-ouMd1-I/39.gif'/>:-?
<img src='http://lh4.ggpht.com/_u7a1IFxc4WI/TM-vzUOH79I/AAAAAAAAATc/oNE5H5vcNtI/42.gif'/>:-SS
<img src='http://lh3.ggpht.com/_u7a1IFxc4WI/TM-vz4hwcNI/AAAAAAAAATo/4ySXuvQWma8/104.gif'/>:-t
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vuMg6RQI/AAAAAAAAATQ/rWj7euuKOZs/33.gif'/>[-(
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vziH8NXI/AAAAAAAAATg/2evEbN2cJwc/43.gif'/>@-)
<img src='http://lh6.ggpht.com/_u7a1IFxc4WI/TM-vzrqI4MI/AAAAAAAAATk/BhfFnT0Gbro/66.gif'/>b-(
</span>
<span id='smiley-toggle'><a href="javascript:moreSmilies()">&#8594;</a></span>
</div>

Step 5

  • अब अपनी ब्लॉग टेम्प्लेट में ]]></b:skin> कोड तलाशे
  • अब नीचे बताया गया पूरा कोड ]]></b:skin> के ठीक पहले यथावत डाल दे

.emoticons {-moz-background-clip: -moz-initial;-moz-background-origin: -moz-initial;-moz-background-inline-policy: -moz-initial;text-align: left;}
.emoticons a, .emoticons a:hover {font-size: 28px;margin-left: 20px;text-decoration:none;}

ध्यान दे :- प्रक्रिया पूर्ण करने के बाद कमेन्ट में image , youtube विडियो , Song लिंक आदि जोडने के लिए नीचे बताये कोड का उपयोग करे :-

  • image डालने के लिए [img] Link [/img] कोड के उपयोग करे //
  • Song लिंक डालने के लिए [nct] Link song [/nct] कोड का उपयोग करे
  • youtube विडियो डालने के लिए [youtube] Youtube Video Link [/youtube] कोड का उपयोग करे

Post a Comment

Previous Post Next Post