Blogger code 9 . Thumbs up 2

Compare this with : Blogger code 2 : thumbs up

Go To Blogger > Design > Edit HTML

Back up your template ,always beack . if there is any trouble you can upload the back up

Click the box "Expand Widget Templates"

Search for

<data:post.body/> 

 If you use Light template,Just above it paste the code below:

<b:if cond='data:blog.pageType == &quot;item&quot;'><div><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:400px; height:27px;'/></div></b:if> <br/>

If you use dark template ,Just above it paste the code below:

<br/>
<br/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:400px; height:27px;'/></div>
</b:if>
<br/>

change  standard by default to button_count if you want  to show number of likes. You can as well set show_faces which is false by default to true.
show photos is enabled, but it applies to the standard button only.
To make the like button appear on static pages,
remove two lines of codes:

<b:if cond=’data:blog.pageType == &quot;item&quot;’> 

</b:if>.
With those removed, the facebook like button appears on static pages and on blog post pages as well.


notes if you need converter(to PHP,ASP,JS,SP,Perl  you cam see our page Zoopy, or see in th top of this blog.. Zoopy..developer..etc

 <<<Code 8 | Code9>>>

Blogger code 8. Floating share button

Go to blogger>Design>layout> add gadget/widget

 Backup your template,find HTML script

 Copy paste in to your HTML 

script If you use lighting template 

<style>
#pageshare {position:fixed; bottom:15%; right:10px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;padding:0 0 2px
0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<br />
<div id="pageshare" title="Share This With Your Friends">
<div class="sbutton" id="gb">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1">
</script><fb:like font="" layout="box_count" show_faces="false"></fb:like></div>
<div class="sbutton" id="rt">
<a class="twitter-share-button" data-count="vertical" href="http://twitter.com/share">Tweet</a><script src="http://platform.twitter.com/widgets.js" type="text/javascript">
</script></div>
<div class="sbutton" id="gplusone">
<script src="https://apis.google.com/js/plusone.js" type="text/javascript">
</script><g:plusone size="tall"></g:plusone></div>
<div class="sbutton" id="su">
<script src="http://www.stumbleupon.com/hostedbadge.php?s=5">
</script></div>
<div class="sbutton" id="digg" style="margin-left: 3px; width: 48px;">
<script src="http://widgets.digg.com/buttons.js" type="text/javascript">
</script><a class="DiggThisButton DiggMedium" href=""></a></div>
<div class="sbutton" id="fb">
<a href="http://www.facebook.com/sharer.php" name="fb_share" type="box_count">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript">
</script></div>
<br />
<div style="clear: both; font-size: 9px; text-align: center;">
<a href="http://www.doncaprio.com/2011/09/sidebar-floting-share-buttons-large.html" target="blank"><span style="color: black;">[Get This]</span></a></div>
</div>
</div>

script If you use darkness template  

<!--SideBar Floating Share Buttons Code Start-->

<style>

#pageshare {position:fixed; bottom:15%; right:10px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#000000;padding:0 0 2px

0;z-index:10;}

#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}

.fb_share_count_top {width:48px !important;}

.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}

.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}

.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}

</style>
<div id='pageshare' title="Share This With Your Friends">
<div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div>
<div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class='sbutton' id='su'><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'><script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script><a class="DiggThisButton DiggMedium"></a></div>
<div class='sbutton' id='fb'><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div><br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://www.doncaprio.com/2011/09/sidebar-floting-share-buttons-large.html" target="blank"><font color="black">[Get This]<font></font></font></a></div></div>

<!--SideBar Floating Share Buttons Code End-->

 It is simple
Preview (you can see in my page the floating share button

<<<code 7| code9>>>
 

Blogger code 7: newsticker

It is the html to make a newsticker for your site,this new ticker is imporatant for your rieader and blogger to exhange the content of the website or  blog, 

you can gat this newsticker in

spiralaxis.com"dowload it.

rsspump, very easy to make newsticker

Noozilla, you can make newsticker widget in ther. very simple

You will get the html code snippet like this

<iframe src="http://s1.rsspump.com/rss.aspx?s=a833d0a5-4c6c-4630-ba0d-6b0a969f202f&amp;speed=2&amp;t=1&amp;d=1&amp;u=0&amp;p=1&amp;b=1&amp;ic=9&amp;font=Verdana&amp;fontsize=12px&amp;bgcolor=&amp;color=000000&.........

Copy and paste it in your blogger

Go to blogger>Design>layout> add gadgett/widget

For  Wordpress.org not wordpress.com you can download and  instal the newsticker extension from here 
For Drupal,in this blog you can follw that instruction and make newsticker,,
For Joomla, download and instal it in your joomla

If you have any quesion, please check www.zoopy.tk (find free blog)

<<<Code6 | Code8>>>

Blogger code 6: Automated Content

There are many content that you can add in your blog,And the blog can automated feeds in news. you can choice in this severall website

http://www.rssfeedreader.com/

Simply Add A Few Lines of Code on Your
Web Pages and the Articles Will
Self Update Every Day!

 there are many ways to make you enjoy your blog, if you are a busy people, and you have no time to fill your blog, this is a choice...........

We will update the listing next time 

 http://www.rapidfeeds.com/

For the wordpres

WP-o-Matic

<<<Code 5 | Code 7>>>

Blogger code 5 : Bookmarks

bookmarks is

Record the address of (a Web site, file, etc.) for quick access by a user: "be sure to bookmark eVote"

Bookmarks is important widget because the visitor can mark your site and easy to caomeback to visit your blog for a next time

LOGO in general

but in the several website bookmark and share will get together

 

For make this simple button you can use this seocentro

Step 1: Select menu type

Drop Down  Pop Up  Direct Links with icons (You can choice what menu list)

Step 2: Enter bookmark Title (optional)

Name the bookmarks ( I only advise use a general name like bookmark,why because every people know , what that means, but it is depend on your self)

Step 3: Enter bookmark Url (optional)

Put your address (http://www.Yournamesite.com or another)

Step 4: Select display Image
   

Step 4: Get code

click on this

you will see, looks like this script, some will change after you put the above text

<script type="text/javascript"><!--
  // Bookmark Url (optional).
  dbm_bookmarkUrl    = "";
  // Bookmark Title (optional).
  dbm_bookmarkTitle  = "";
//-->
</script>
<script type="text/javascript" src="http://www.seocentro.com/bookmark/bmdirect.js"></script>

Copy the html script in your html editor on your blog, save it.

just another simple step for blog

<<<Code 4 | Code 6>>>

Blogger code 4: RSS

abbreviation 

 Really Simple Syndication, a standardized system for the distribution of content,

 esp. news, from an online publisher to Internet users

Web definitions

• RSS (most commonly expanded as Really Simple Syndication) is a family of web feed formats 
• used to publish frequently updated works—
• such as blog entries, news headlines, audio, and video—in a standardized format. ...

General code

you can find a similar logo with another texture or colour

For make this simple button you can use this seocentro

Step 1: Select menu type

Drop Down  Pop Up  ...........choice will the menu will look in dropdrown or pop up windows

Step 2: RSS Button displayed on   ... where you want to show this button
Web Site,some website editor do not include this button so you must make this button your self
WordPress, in wordpress you must make this button
Movable Type
Blogger, in blogger ussualy you can choice in "add widget button" and put them automatically

Step 3: Enter Feed URL
Feed URL (ex. http://yournameblog.blogspot.com or

                                                                                       http://www.yourname site.com)

Step 4: Select display image  ... choice this button you like logo or text

   

After you click it you will see

<script type="text/javascript"><!--
  // RSS Subscribe Feed URL.
  rssbm_subscribeFeed  = "<$BlogSiteFeedUrl$>";
  // Button Image URL.
  rssbm_buttonImageUrl = "http://www.seocentro.com/bookmark-rss/images/rss_button01.gif";
  // Set this to yes if you put your image on the right side of
  // the page and the drop down menu goes outside the window.
  rssbm_imgRightSide   = "no";
//-->
</script>
<script type="text/javascript" src="http://www.seocentro.com/bookmark-rss/rss.js"></script>

Copy all of that and put in your HTML Editor/ Html widget etc, to put in your website

You can try it just a little step

<<<code3 | code5>>>

Blogger code 3 : sidebar

Go to "Design->Edit HTML

backup of your template 

Search for

<body>

put in the blow body

copy this script

 (rename in the bold Text with your and  change the symbol # = with you link url ), 

<script  type="text/javascript"></script>

<style>
body{
    font-size:75%;
}
a{
    outline: none;
}
a:active{
    outline: none;
}
#sideBar{
text-align:left;
}
#sideBar h2{
    color:#FFFFFF;
    font-size:110%;
    font-family:arial;
    margin:10px 10px 10px 10px;
    font-weight:bold !important;
}
#sideBar h2 span{
    font-size:125%;
    font-weight:normal !important;
}
#sideBar ul{
    margin:0px 0px 0px 0px;
    padding:0px 0px 0px 0px;
}
#sideBar li{
    margin:0px 10px 3px 10px;
    padding:2px;
    list-style-type:none;
    display:block;
    background-color:#DA1074;
    width:177px;
    color:#FFFFFF;
}
#sideBar li a{
    width:100%;
}
#sideBar li a:link,
#sideBar li a:visited{
    color:#FFFFFF;
    font-family:verdana;
    font-size:100%;
    text-decoration:none;
    display:block;
    margin:0px 0px 0px 0px;
    padding:0px;
    width:100%;
}
#sideBar li a:hover{
    color:#FFFFFF;
    text-decoration:underline;
}
#sideBar{
    position: fixed;
    width: auto;
    height: auto;
    top: 140px;
    left:0px;
    background-image:url(http://your image location in format:.jpg:jpeg:png);
    background-position:top right;
    background-repeat:repeat-y;
}
#sideBarTab{
    float:left;
    height:137px;
    width:28px;
}
#sideBarTab img{
    border:0px solid #FFFFFF;
}
#sideBarContents{
    float:left;
    overflow:hidden !important;
    width:200px;
    height:320px;
}
#sideBarContentsInner{
    width:200px;
}</style>
<div id="sideBar">
        <div id="sideBarContents" style="display:none;">
        <div id="sideBarContentsInner">
            <h2><div style="text-align: justify;"><span style="font-family:Arial;">Useful Links</span>
</div></h2>
                    <ul>
                <li><a href="#">Put Your Link here 1</a></li>
                <li><a href="#">Put Your Link here 2</a></li>
                <li><a href="#">Put Your Link here 3</a></li>
                <li><a href="#">Put Your Link here 4</a></li>
                  </ul>
                </div> </div>
    <a id="sideBarTab" href="#"><img alt="sideBar" src="http://where your pic store" title="sideBar"/></a>
</div>

Save your template and view your blog
...............................just it

notes if you need converter(to PHP,ASP,JS,SP,Perl  you cam see our page Zoopy, or see in th top of this blog.. Zoopy..developer..etc

<<<Code 2 | Code4>>>

Blogger code 2 : Thumbs up

Compare this with : Blogger code 9 : thumbs up~2

Go To Blogger > Design > Edit HTML

Back up your template ,always beack . if there is any trouble you can upload the back up

Click the box "Expand Widget Templates"

Search for

<data:post.body/> 

 Just above it paste the code below:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='js-kit-rating' expr:path='data:post.url' expr:permalink='data:post.url' expr:title='data:post.title' view='score'>
</div>
</b:if>

The widget will display only at post pages

Now search for

<body>  or another related dont confuse with body of the head

Just above it paste the following code:

<script src="http://js-kit.com/ratings.js"></script> 

Save your template

notes if you need converter(to PHP,ASP,JS,SP,Perl  you cam see our page Zoopy, or see in th top of this blog.. Zoopy..developer..etc

<<<Code 1  | Code 3>>>

if the continues link like code3>>> or  page 4>>> in this blog blank it' means that we will continues in other day

Blogger code 1: sticky bar

Go To Blogger > Design > Edit HTML

Backup your template

Search for this,

 ]]></b:skin>

Just above it paste the CSS code below

#fry-stickybar{
background:#0080ff url('http://your image link background for sidebar.png') repeat-x;
width:100%;
margin:0 auto;
text-align:center;
padding:0px 0;
border-bottom: 1px solid #888888;
  -moz-box-shadow: #666666 0px 1px 3px;
  -webkit-box-shadow: #666666 0px 1px 3px;
  box-shadow: #666666 0px 1px 3px;
  z-index: 999;
height: 28px; position:fixed;
line-height: 1.85em;
vertical-align: baseline;
letter-spacing: 1px;
}
#fry-stickybar a{
text-decoration:none;
color:#fff;
font-size:13px;
font-weight:bold;
font-family: arial,"Helvetica",sans-serif;
line-height: 24px;
}
#fry-stickybar a:hover{
text-decoration:underline;
}
#fry-stickybar p {margin:0; list-style:none;}
#fry-stickybar img {vertical-align: middle;
      margin-right: 6px;}

To change the background colour : #0080ff  Use our Color code generator.

Next search for this code

<body> or  related code, dont fill in the body of head there are different path 

Just below it paste the following code, which you you choice only text or image

FOR TEXT ONLY

<div id='fry-stickybar'>

<a href='#'>ADD TEXT HERE</a>

</div>

FOR IMAGE

<div id='fry-stickybar'>

<img src='IMAGE LINK'/><a href='#'>ADD TEXT HERE</a>

</div>

....................................Only that..........

# change with your Url link,or blog link

ADD TEXT HERE rename it

IMAGE LINK where is your image link

notes if you need converter(to PHP,ASP,JS,SP,Perl  you cam see our page Zoopy, or see in th top of this blog.. Zoopy..developer..etc

Home | Code 2 >>>