Adding a horizontal Random post gadget to a blogger blog is
climbing climax each day as the number of bloggers are increasing daily. Today
in just 5 steps your blogger blog will be made professional and awesome with
the Stylish random post gadget. Just so you know it has nothing to do with
editing your template because most bloggers always find it difficult.
Features
With the random post gadget placed on your blog, your blog
definitely can stand out among ,many other bloggers in terms of look,
readership and also page views.
- Increase your page views and definitely engage your readers
- Quick to load and yes easy to install
- Pure Javascript code and no JQuery, with also stylish hover effect with thumbnails
Now how to add to your Blog
Step 1
Log on to your Blogger account and select your desired blog.
Step 2.
Go to ‘layout’ in your blogger drop down list
Step 3.
Now clink on ‘Add a Gadget’’ where you want it.
Preferably in your footer or above your post because the gadget is Horizontal
not vertical.
Step 4.
Scroll to ‘HTML-JAVASCRIPT’, clink on the + beside it to add
it, Now Copy the Code below and paste it inside the text box. And also leave
the Title empty that’s if you don’t want to add any title to it
Code:
<!-- This Is A CopyRight Code Of EXEIdeas (www.exeideas.com).It Is Free To Use But With HTML Design Code.If AnyOne Found To Be Changing This Code Should Be Under Legal Action Via DMCA. -->
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#random-posts {float: center;text-transform: none;height: 130px;background-color: #f4f4f4;box-shadow: 0 0 0 1px white inset;-moz-box-shadow: 0 0 0 1px #fff inset;-webkit-box-shadow: 0 0 0 1px white inset;padding: 5px;}
#random-posts h2 {padding: 10px 15px;margin: -5px 0px 5px -5px;font-family: Helvetica, Arial;line-height: 1.1em;font-weight: bold;text-shadow: 0 1px 0 white;font-size: 20px;letter-spacing: -1px;color: #333;background: #E4E4E4;border: 1px solid white;width: 658px;box-shadow: 0 0 0 1px white inset;-moz-box-shadow: 0 0 0 1px #fff inset;-webkit-box-shadow: 0 0 0 1px white inset;}
#random-posts li{float:left;list-style:none;position:relative}
#random-posts li:last-child{margin-right:0}
#random-posts li img{width:72px;height:72px;padding:6px;}
#random-posts li img:hover {background-color: #444444;color: white; font-weight: bold; text-decoration: initial;}
#random-posts li .rp_animation{position:absolute;width:250px;top:-200px;z-index:2;background-color:#F0F0F0;padding:5px;font-size:90%;border:1px solid black;transition:all 0.6s cubic-bezier(1,2,0,0) 0s;-moz-transition:all 0.6s cubic-bezier(1,2,0,0) 0s;-webkit-transition:all 0.6s cubic-bezier(1,2,0,0) 0s;-o-transition:all 0.6s cubic-bezier(1,2,0,0) 0s;visibility:hidden;opacity:0}
#random-posts li:last-child .rp_animation{right:0}
#random-posts li:hover .rp_animation{top:-90px;opacity:1;visibility:visible}
.rp_animation span{font-size:90%;color:#B30B0B}
.rp_animation p{font-size:90%;}
</style>
<ul id='random-posts'>
<h2>Random Posts...!!!</h2>
<script type='text/javaScript'>
//<![CDATA[
var rdp_numposts = 8; //Number Of Random Postsvar rdp_snippet_length = 110; //Length Of Description Text, 0 To Hidevar rdp_datecomment = 'yes'; //Show Date And Comment 'yes/no'var rdp_comment = 'Comments'; //Text For Comment Countvar rdp_disable = 'Comments Are Off Here...'; //Text If Comment Is Disabled On Post/Blogvar rdp_current = [];
var rdp_total_posts = 0;
var rdp_current = new Array(rdp_numposts);
function totalposts(a){rdp_total_posts=a.feed.openSearch$totalResults.$t}document.write('<script type="text/javascript" src="/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts"></script>');function getvalue(){for(var b=0;b<rdp_numposts;b++){var d=false;var c=get_random();for(var a=0;a<rdp_current.length;a++){if(rdp_current[a]==c){d=true;break}}if(d){b--}else{rdp_current[b]=c}}}function get_random(){var a=1+Math.round(Math.random()*(rdp_total_posts-1));return a};
//]]>
</script>
<script type='text/javaScript'>
//<![CDATA[
function random_posts(n){a=location.href;y=a.indexOf("?m=0");for(var f=0;f<rdp_numposts;f++){var l=n.feed.entry[f];var m=l.title.$t;if("content" in l){var o=l.content.$t}else{if("summary" in l){var o=l.summary.$t}else{var o=""}}o=o.replace(/<[^>]*>/g,"");if(o.length<rdp_snippet_length){var k=o}else{o=o.substring(0,rdp_snippet_length);var b=o.lastIndexOf(" ");k=o.substring(0,b)+"…"}for(var e=0;e<l.link.length;e++){if("thr$total" in l){var h=l.thr$total.$t+" "+rdp_comment}else{h=rdp_disable}if(l.link[e].rel=="alternate"){var d=l.link[e].href;if(y!=-1){d=d+"?m=0"}var g=l.published.$t;if("media$thumbnail" in l){var c=l.media$thumbnail.url}else{c="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8miy5JvNW3QXoeqqCgnquphEgaEc9TlJfmJSaspf44yumk_HJK8Omf9PFmYd5PWJqbqGMT_L0_sTuBlJmVK093iphbayYR2hxxX6-t5bXUxXeZNfaB2nwmn2bbk8_id9VSyLB2LeA-nk/s400/noimage.png"}}}document.write("<li>");document.write('<a href="'+d+'" rel="nofollow"><img alt="'+m+'" src="'+c+'"/></a>');document.write('<div class="rp_animation"><h5>'+m+"</h5>");if(rdp_datecomment=="yes"){document.write("<span>"+g.substring(8,10)+"/"+g.substring(5,7)+"/"+g.substring(0,4)+" - "+h+"</span>")}document.write("<p>"+k+"</p></div>");document.write('<div style="clear:both"></div></li>')}}getvalue();for(var i=0;i<rdp_numposts;i++){document.write('<script type="text/javascript" src="/feeds/posts/default?alt=json-in-script&start-index='+rdp_current[i]+'&max-results=1&callback=random_posts"></script>')};
//]]>
</script>
</ul>
<div style='clear:both'/>
</b:if>
<!-- This Is A CopyRight Code Of EXEIdeas (www.exeideas.com).It Is Free To Use But With HTML Design Code.If AnyOne Found To Be Changing This Code Should Be Under Legal Action Via DMCA. -->
Step 5.
Click on the save and yes you are done.
Customization
- Change 8 to show your desired number of random post
- Change 110 to show your desired length of description text, and add 0 to remove description
- Change yes to no to remove date and comment in description
- Change comment to your desired text for comment count
- Change comments are off here… to your desired text if comment is disabled on post blog
- Change random posts..!!! with your desired title
- Save and done
Have any Problems??? share your thoughts in our comment box
0 comments:
Post a Comment