Showing posts with label WIDGETS. Show all posts
Showing posts with label WIDGETS. Show all posts

Sunday, June 5, 2011

Add Three New Widgets At The Bottom Of Blogger/Blogspot Blog

You would have seen many new modified blogger templates with additional 3 widgets at the bottom (footer) of the blog, and they are very useful for bloggers, as you can place widgets like Recent posts, Recent comments, Top posts and Top commentators etc in these widgets.
It is very important to add these widgets in a blog, as when readers finish reading the post, they may immediately leave the blog if no other interesting article is found. Moreover these widgets help new visitors to understand the blog's main content.

Add Floating Hover Text - Which Trails Mouse Cursor

If you want to show any text like "Welcome Here" or "Sign My Guestbook", which follows the mouse cursor (trail text effect), like the one displayed in the image, or in this demo.

Then, simply add the code in any HTML/JavaScript widget (Log in -> Layout  -> Add a Gadget).

New Customized Popular Posts Widget For Blogger


Here's the code for the above widget:

Add 125x125 Ad Slots To Your Blogger/BlogSpot Blog


Presently 125x125 ad-spots are the most famous ad dimensions in the blogosphere. For both publishers and advertisers these dimensions are perfect to display text & pictures attractively and at the same time these ads do not interfere much with the blog's content.

Customize Blockquote In Your BlogSpot Blogs

First of all, if you don't know what a <blockquote> tag is, then edit any of your previous posts and add this code to it (anywhere in the post):
<blockquote>I am learning about blockquotes</blockquote>
Save the post, and check it out.
You will see that the text "I am learning about blockquotes" is separated from your regular content. At BloggerStop, you would have seen these blockquotes a number of times as gray text boxes, just like the one above.

Display Your HomePage Like BING


Click on the image

Or check out the Live Demo

Follow these instructions to add a BING like homepage to your blog...

Dancing Links - That's Jquery Link Nudging

This is done using Jquery - Link Nudging.

Here's the live demo (hover your mouse cursor on these links):





BloggerStop.Net



Nudging in Images:




Dancing Blogger Icon Dancing Delicious Icon Dancing Digg Icon Dancing Digg Icon

Instructions to add similar dancing links to your blog:

Saturday, May 7, 2011

SCROLLING RECENT POSTS WIDGET

<script style="" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/recentpostsscrollerv2.js"> </script><script style=""> var nMaxPosts = 15; var sBgColor; var nWidth; var nScrollDelay = 175; var sDirection="left"; var sOpenLinkLocation="N"; var sBulletChar="»»"; </script> <script style="" src="http://TELUGUBLOGTRICKS.blogspot.com/feeds/posts/default?alt=json-in-script&amp;callback=RecentPostsScrollerv2"> </script>

VISITORS WIDGET

<script type="text/javascript" src="http://feedjit.com/serve/?vv=693&amp;tft=3&amp;dd=0&amp;wid=f06c6f5ca0543daa&amp;pid=0&amp;proid=0&amp;bc=FFFFFF&amp;tc=000000&amp;brd1=012B6B&amp;lnk=135D9E&amp;hc=FFFFFF&amp;hfc=2853A8&amp;btn=C99700&amp;ww=200&amp;went=10"></script><noscript><a href="http://feedjit.com/">Feedjit Live Blog Stats</a></noscript>

ADDRESS WIDGET

<marquee behavior="alternate" direction="left" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" scrolldelay="50" style="color:#fdd017;">  శ్రీ సాయి జ్యోతిష్య
కేంద్రం,
షాప్ నెం-4& 6,
ప్లాట్ ఫాం నెం-1,
మహాత్మగాంధీ
బస్‌కాంప్లెక్స్,
హైదరాబాద్,
పోన్ నెం-
040-32477077,
email id-
astrojothi@
gmail.com.
website-
astrojoti.
com.
</marquee>

TOTEL POSTSAND COMMENTS WIDGETS

<script style="text/javascript">
function numberOfPosts(json) {
document.write('Total Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
function numberOfComments(json) {
document.write('Total Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<font color="red"><script src="http://TELUGUBLOGTRICKS.BLOGSPOT.COM/feeds/posts/default?alt=json-in-script&callback=numberOfPosts"></script>
<script src="http://TELUGUBLOGTRICKS.BLOGSPOT.COM/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></font>

SCROLLING RECENT POSTS

<script style="" src="http://bloggerblogwidgets.googlecode.com/files/recentpostsscrollerv2.js"></script>
<script style="" >
var nMaxPosts = 10;
var nWidth = 100;
var nScrollDelay = 175;
var sDirection = "down";
var sOpenLinkLocation ;
var sBulletChar = ">>";
</script>
<script style=""  src="http://telugublogtricks.blogspot.com/feeds/posts/default?alt=json-in-script&amp;callback=RecentPostsScrollerv2&amp;max-results=10 " ></script> <noscript><a href="http://www.way2blogging.org/2010/06/auto-scrolling-recent-posts-widget-for.html">+ Grab this Widget</a></noscript>

PDF WIDGET

<!-- START: PDF Online Script -->
<script type="text/javascript">
    var authorId = "1FD3272A-A5F9-4F98-B5F2-1A92D95AAEF7";
    var pageOrientation = "0";
    var topMargin = "0.5";
    var bottomMargin = "0.5";
    var leftMargin = "0.5";
    var rightMargin = "0.5";
</script>
<script type="text/javascript" src="http://web2.pdfonline.com/pdfonline/pdfonline.js">
</script>
<!-- END: PDF Online Script -->

SCROLLING UP AND DOWN WIDGET

<div class="textwidget"><marquee direction="up" width="105" onmouseover="this.stop()" scrollamount="2" onmouseout="this.start()" height="200" align="left">
RAJASEKHAR
NERELLA.
nsekhar16@
gmail.com

</marquee></div>

RECENT POSTS WIDGET

<script>
function rp(json) {
document.write('<ul>');

for (var i = 0; i < numposts; i++) {
document.write('<li>');
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;

if (i == json.feed.entry.length) break;

for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}

posttitle = posttitle.link(posturl);
var readmorelink = "(more)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdyear = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdday = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "Jun";
monthnames[7] = "Jul";
monthnames[8] = "Aug";
monthnames[9] = "Sep";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";

if ("content" in entry) {
var postcontent = entry.content.$t;
} else if ("summary" in entry) {
var postcontent = entry.summary.$t;
} else
var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
document.write(posttitle);

if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);

if (showpostsummary == true) {
if (postcontent.length < numchars) {
document.write(postcontent);
} else {
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent + '...' + readmorelink);
}
}
document.write('</li>');
}
document.write('</ul>');

}
</script>

<script>
var numposts = 7;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
</script>

<script src="http://TELUGUBLOGTRICKS.BLOGSPOT.COM/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp"></script><br/><span style="font-size: x-small;"><a href="http://bloggerstop.net">Blogger Widgets</a></span>

POST FEEDS WIDGET

<script style="text/javascript">
function numberOfPosts(json) {
document.write('Total Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
function numberOfComments(json) {
document.write('Total Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<font color="red"><script src="http://TELUGUBLOGTRICKS.BLOGSPOT.COM/feeds/posts/default?alt=json-in-script&callback=numberOfPosts"></script>
<script src="http://TELUGUBLOGTRICKS.BLOGSPOT.COM/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></font>

GOOGLE NEWS WIDGET

<!-- Google News Element Code -->
<iframe frameborder=0 marginwidth=0 marginheight=0 border=0 style="border:0;margin:0;width:300px;height:250px;" src="http://www.google.com/uds/modules/elements/newsshow/iframe.html?rsz=large&format=300x250&ned=te_in&topic=h&element=true" scrolling="no" allowtransparency="true"></iframe>

CLOCK CALENDER WIDGET

<object><param name="movie" value="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-1.swf" /> <embed src="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-1.swf" width="150" height="250" wmode="transparent"></embed></object>

ALL POSTS WIDGET

<style type="text/css">
.gfg-root {
width : 75%;
height : 400;
position : relative;
overflow : hidden;
text-align : center;
font-family: "Arial", sans-serif;
font-size: 12px;
border: 1px solid #BCCDF0;
}

.gfg-title {
  font-size: 10px;
  font-weight : bold;
  color : #3366cc;
  background-color: #E5ECF9;
  line-height : 1.4em;
  overflow : hidden;
  white-space : nowrap;
}

.gfg-title a {
  color : #3366cc;
}

.gfg-subtitle {
  font-size: 10px;
  font-weight : bold;
  color : #3366cc;
  background-color: #E5ECF9;
  line-height : 1.4em;
  overflow : hidden;
  white-space : nowrap;
  margin-bottom : 0px;
}

.gfg-subtitle a {
  color : #3366cc;
  display:none !important;
}

.gfg-entry {
  background-color : white;
  width : 100%;
  height : 20em;
  position : relative;
  overflow : hidden;
  text-align : left;
  margin-top : 3px;
}

/* To allow correct behavior for overlay */
.gfg-root .gfg-entry .gf-result {
  position : relative;
  background-color : white;
  width : auto;
  height : 100%;
  padding-left : 20px;
  padding-right : 5px;
}

.gfg-list {
  position : relative;
  overflow : hidden;
  text-align : left;
  margin-bottom : 5px;
  display:none !important;
}

.gfg-listentry {
  line-height : 1.5em;
  overflow : hidden;
  white-space : nowrap;
  text-overflow : ellipsis;
  -o-text-overflow : ellipsis;
  padding-left : 15px;
  padding-right : 5px;
  margin-left : 5px;
  margin-right : 5px;
}

.gfg-listentry-odd {
  background-color : #F6F6F6;
}

.gfg-listentry-even {
}

.gfg-listentry-highlight {
  background-image : url('garrow.gif');
  background-repeat: no-repeat;
  background-position : center left;
}

/*
* FeedControl customizations.
*/

.gfg-root .gfg-entry .gf-result .gf-title {
  font-size: 24px;
  line-height : 1.2em;
  overflow : hidden;
  white-space : nowrap;
  text-overflow : ellipsis;
  -o-text-overflow : ellipsis;
  margin-bottom : 2px;
}

.gfg-root .gfg-entry .gf-result .gf-snippet {
  height : 3.8em;
  color: #000000;
  margin-top : 3px;
}

/*
* Easy way to get horizontal mode, applicable via js options to gadget.

*/

.gfg-horizontal-container {
  position : relative;
}

.gfg-horizontal-root {
  height : 1.5em;
  _height : 100%;
  position : relative;
  white-space : nowrap;
  overflow : hidden;
  text-align : center;
  font-family: "Arial", sans-serif;
  font-size: 13px;
  border: 1px solid #AAAAAA;
  padding : 5px;
  margin-right : 80px;
}

.gfg-horizontal-root .gfg-title {
  font-weight : bold;
  background-color: #FFFFFF;
  line-height : 1.5em;
  overflow : hidden;
  white-space : nowrap;
  float : left;
  padding-left : 10px;
  padding-right : 12px;
  border-right: 1px solid #AAAAAA;
}

.gfg-horizontal-root .gfg-title a {
  color : #444444;
  text-decoration : none;
}

.gfg-horizontal-root .gfg-entry {
  width : auto;
  height : 1.5em;
  position : relative;
  overflow : hidden;
  text-align : left;
  margin-top : 0px;
  margin-left : 0px;
  padding-left : 10px;
}

/* To allow correct behavior for overlay */
.gfg-horizontal-root .gfg-entry .gf-result {
  position : relative;
  background-color : white;
  width : 100%;
  height : 100%;
  line-height : 1.5em;
  overflow : hidden;
  white-space : nowrap;
}

.gfg-horizontal-root .gfg-list {
  display : none;
}

/*
* FeedControl customizations.
*/

.gfg-horizontal-root .gfg-entry .gf-result .gf-snippet,
.gfg-horizontal-root .gfg-entry .gf-result .gf-author {
  display : none;
}

.gfg-horizontal-root .gfg-entry  .gf-result .gf-title {
  color: #0000cc;
  margin-right : 3px;
  float : left;
}

.gfg-horizontal-root .gfg-entry .gf-result .gf-spacer {
  float : left;
}

.gfg-horizontal-root .gfg-entry .gf-result .gf-spacer,
.gfg-horizontal-root .gfg-entry .gf-result .gf-relativePublishedDate {
  display : block;
  color: #AAAAAA;
}

.gfg-branding {
  white-space : nowrap;
  overflow : hidden;
  text-align : left;
  position : absolute;
  right : 0px;
  top : 0px;
  width : 80px;
}

.gfg-collapse-open, .gfg-collapse-closed {
  background-repeat : no-repeat;
  background-position : center;
  cursor : pointer;
  float : right;
  width : 17px;
  height : 20px;
}

.gfg-collapse-open {
  background-image : url('arrow_open.gif');
}

.gfg-collapse-closed {
  background-image : url('arrow_close.gif');
}

.gfg-collapse-href {
  float : left;
}

.clearFloat {
  clear : both;
}
body {
      background-color: white;
      color: black;
      font-family: Arial;
      font-size: small;
      margin: 0;
    }
    #feedGadget {
      margin-top : 5px;
      margin-left: auto;
      margin-right: auto;
      width : 270px;
      font-size: 16px;
      color: #9CADD0;
    }
</style>
<script src="http://www.google.com/jsapi/?key=internal-sample"
type="text/javascript"></script>
  <script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script>

  <script type="text/javascript">

    function showGadget() {
      var feeds = [
       {title:'title',
        url:'http://telugublogtricks.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=999'},
     
       ];

      new GFdynamicFeedControl(feeds, 'feedGadget',
                               {numResults : 1000, stacked : true,
                               title: "నాడైరీ ~ All Posts."});
    }
    google.load("feeds", "1");
    google.setOnLoadCallback(showGadget);
  </script>
<div id="feedGadget">Loading...</div>

FLOWER WIDGET

<script language="JavaScript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/falling_leaves.js">
</script>
Related Posts Plugin for WordPress, Blogger...