See Latest Post

How to set a Floating Random Post+ MP3 Player + Share Button for Blogger site

We who have websites very often need  good SEO for our sites. For this our websites need to be favorable to   SEO. There are many kinds of SEO. However, I will not discuss about SEO here. If you have a blog in blogger.com, this post is for you. Today I have brought a stylish floating Random Post widget with an  amusing MP3 player and Share button for blogger. This will enhance the beauty of your blog and will assist you to get more visitor for your site and visitors will be able travel every pages of your blog. This is complete free blog widget  for blogger sites. This is one kind of SEO we know. So let's start our discussion on how to set this amusing Floating Random Post widget to your blogger sites.
Random Post Widget image
Random Post Widget Image


Finding code in Blogger Template Editor


Now copy the following codes and convert/Parse these codes into HTML escaped texts. To parse these codes Go to this link and  Paste the codes into  the box and  click on Parse button. You will get the parsed/converted  code.
 
<div id='DVS_scroll_env' align='center'>
 <div id='DVS_content'>
 <div class='social_share_dd'>
 <div class='addthis_toolbox addthis_default_style'>
 <a class='addthis_button_compact'></a>
 <a class='addthis_counter addthis_bubble_style'></a>
 <a class='addthis_button_preferred_3'></a>
 <a class='addthis_button_preferred_11'></a>
 <a class='addthis_button_preferred_12'></a>
 <a class='addthis_button_google_plusone' g:plusone:size='small'/></a>
 <a class='addthis_button_facebook_like' fb:like:layout='button_count'style='margin-left:-21px'></a>
 <script type='text/javascript' src='http://s7.addthis.com/js/300/addthis_widget.js'></script>
 </div>
 </div>
<div class='dvs_random_posts'>
 <div class='randpostscroll' id='recommend'>
  <div class='boxBody'>
   <div id='scrollRow'>
 <a class='goLeft' id='slide_left' href='javascript:void(0);'>
 <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0s9b2xgUbkXmdwG7bmAIaATw8sxEf7-IBaR8ywYBKOQwNFk-SxNVZ8WkDIKS_jH66C14A3Y5jn3WLgxLBceqwLIVAvAlFv71JxObsxRphqZGHD_1VmVATao_ts6Mh0KoqhcxkXmSP4oA/s1600/leftgree.png' width='13' height='17' style='padding-top:3px' /></a>
 <a class='goRight' id='slide_right' href='javascript:void(0);'>
 <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhq4VU1ufQOF9EkKWshIf-BZS_TbBjogKuywHC4ztW2C3EX4sPBLxxDOAdhCEr6xAP-SvR0yTcpmWDTGcYxJSa0wgHrq6v1ZIU1airduglGt2St5XR_i_EPg2gYM7PyhcxNS0uUE0qlf_k/s1600/rightgree.png' width='13' height='17' style='padding-top:3px' /></a>
     <div id='gscroll'>
      <div id='gsub'>
<script type='text/javascript'>   eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('2 3=y z();2 l=0;2 5;2 7=H;L v(c){2 f=B(c.o.F$G.$t,K);6(i=0;i<7;){5=0;3.g=7;l=m.A(m.M()*f);6(j u 3){8(l==3[j]){5=1}}8(5==0&&l!=0){3[i++]=l}}9.b(\'<h w="x">\');6(n u 3){2 p=3[n];2 4=c.o.4[p-1];6(k=0;k<4.d.g;k++){8(4.d[k].D==\'E\'){2 q="<r><s I=\'J\'>"+"<a e="+4.d[k].e+">"+4.C.$t+"</a> </s></r>";9.b(q)}}}9.b(\'</h>\')}',49,49,'||var|randarray|entry|flag|for|numofpost|if|document||write|json|link|href|total|length|ul|||||Math||feed||item|li|div||in|nooprandomposts|id|holder1|new|Array|floor|parseInt|title|rel|alternate|openSearch|totalResults|7|class|slidercontent|10|function|random'.split('|'),0,{}))
    </script>
<script type='text/javascript' src='/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=nooprandomposts'></script>
<ul id='holder2'></ul>
     </div>  
    </div>
   </div>
  </div>
 </div>
</div>
 <div class='dvs_cret' style='margin-left:-2px'><script type='text/javascript' src='http://dvslabs.googlecode.com/files/scrollercontroll.js'></script>
 </div>
 <div class='dvs_mp3_player'> 
 <object type='application/x-shockwave-flash' data='http://dl.dropbox.com/u/54221966/DVS-Mp3Player.swf?soundFile=http://a.tumblr.com/tumblr_m95mddcnAz1rqgo6wo1.mp3|http://n1.vmuzike.net/a/take_that/The_Flood|http://a.tumblr.com/tumblr_m0lvrmyikC1qaouiwo1.mp3' width='233' height='27' id='DVS-Mp3Player' style='margin-top:-1px; margin-left:-3px'><param name='wmode' value='transparent' /><param name='movie' value='DVS-Mp3Player.swf?v1.2' /><param name='flashvars' value='autoplay=no&loop=yes&volume=100&shuffle=no' /></object>
 </div>
 <div class='go_up'> 
 <a title='Go to Top' href='#' onclick='MGJS.goTop();return false;'>
 <img class='go_up' border='0' width='19' height='18' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSTD82BLz8ibCy3K7uq90oAcxrT86BzvZazyRzywE-UgqrXwcbq0M8m0TVKZ_oNFGUeik8Y8oa4lIs-ISp_sixVkddLbiSmQCyVFj3i_T6uUmbQ_ZnOd1owU0djHq9C-L8xpOOi4_rUXc/s1600/up2.png' /></a>
 </div>
 <div class='tootoop'> 
 <a href='#' onclick='document.getElementById("DVS_scroll_env").style.display="none";return false;'title='Close'> 
 <img class='tootoop' border='0' width='13' height='13' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjANCwYY1lC0UDlD_1ygKl0v2chdfVBcwdnEuNjdS3LojDe3CLhY-3nt23gYj7TLYFVbmbljXfpS4na-ppFu5EOxVdKNo4Q_AWoFUvFu_GWLZGy0Pw8mmgxRtvWUR_vxfT8Dn4dIYoi55I/s1600/close.png' /></a>
 </div>
</div>
</div>
<script type='text/javascript'>
if (screen.width >= 800) {
document.write ("<style type='text/css' media='screen'>#DVS_scroll_env{width:100%;height:29px;padding-top:4px;margin:0;background:blue url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgbWFNKt5RziGbWUtoNS8d7BaqaqnOn1YrMH-gYiJZsKcwQOdkv2Yg_85xOzl0Dz40_KgxOxuuW0mOF7btr33QEdZOmcMiKlZptTeS0hfkzflxCT3edmbJtjr_iC7jZWk4dTzp9-RJ_Qc/s1600/bg.png) right top;position:fixed;bottom:0px;left:0px;z-index:99999;}</style>");
}else{document.write ("<style type='text/css'media='screen'>#DVS_scroll_env{visibility:hidden;display:none}</style>");}
</script>
<!-- Floating Random Post Mp3 Player Share Button by http://www.amiodhara.blogspot.com -->
<noscript><style type='text/css' media='screen'>#DVS_scroll_env{visibility:hidden;display:none}</style><h5 align="center">Your browser does not support JavaScript!</h5></noscript>
 
[N.B-Your codes must be parsed/converted, otherwise it will not work So Parse the codes here ]


Firstly go to blogger Dashboard and click on Tempate >> Edit HTML.(N.B- Before going to the Edit HTML section please back up your whole template. How to backup blogger template, to know this  see the tutorial 's upper part) And then  Click on Edit Template.  Now Press Ctrl+F and  Write the
 tag in the search box and hit Enter Key. You will see the tag in the following window. See here...


Now copy the parsed/converted codes and paste it just before the  
tag. See the following  image bellow before doing that.

Finding code in Blogger Template Editor

If you do these stages stated above correctly, I  am  sure that you will get results.

Modification of Coding
  If you want to modify something according to your own, Please read this following instructions and follow appropriately.

1.Change Widget Position

You can place the widget at the top or bottom, find this code and  replace with the  following codes.

/s1600/bg.png) right top;position:fixed;bottom:0px;...

If you want to see your widget at the bottom, Keep it unchanged but if you want it at the top change/replace botom with top


2. Modify the Background Color


You will see blue as background color. You can  change it with  any   color or color code. Just  copy any  color code  and paste it  in place of blue.

#DVS_scroll_env{width:100%;height:29px;padding-top:4px;margin:0;background:blue...


3. Change the URL of MP3


You can  change the URL of MP3 Player according to  your own. Now change the following  URL  according to  your own.

http://a.tumblr.com/tumblr_m95mddcnAz1rqgo6wo1.mp3

4. Set Random Post number

Default Random post number is 7 you can  change it any number up-to 21. Just find the following code and replace with your own.

alternate|openSearch|totalResults|7|class|


5.Activate AddThis Analytic Option
One of interesting stuff from Random Post MP3 Player + Share Button for Blogger widget is the share button. I like AddThis share button service, it has the share networks over 300 popular sites, and I guess this is the most complete so far. Besides, Addthis share button also comes with analytic option, so you can track how many shares have been made from your contents. Off course you'll have to be registered before you can use this service (It's totally free).



 If you are registered, find your publisher ID then insert it to this widget. Seek this:


...http://s7.addthis.com/js/300/addthis_widget.js...
insert your ID to »
...http://s7.addthis.com/js/300/addthis_widget.js#pubid=yourID...

Now, your AddThis analytic will give you report periodically to your email.

No comments