Amazing plugins for social networks

Add Animated Flying Twitter

Apply the code ay html/JavaScript plugin

-------------------------------------------------------------------

The Code

 <!-- Twitter Bird Widget for Blogger by Way2blogging.org --> <script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/files/way2blogging.org-tripleflap.js"> </script> <script type="text/javascript"> var twitterAccount = "إسمك على تويتر"; var tweetThisText = " <data:blog.pageTitle/> ~ <data:blog.Url/> "; tripleflapInit(); </script> <span style="font-size:11px;position:absolute;"><a title='blogger widget by way2blogging.org' href="http://www.way2blogging.org" target='_blank'><img border='0' src='http://img1.blogblog.com/img/blank.gif'/></a></span><a href="http://www.spiceupyourblog.com" target="_blank"></a> <!-- Twitter Bird Widget for Blogger by manba3.co.cc -->

---------------------------------------------------------------------

Add Facebook like box With hover effect

1. Go to Blogger Dashboard < Design tab > Edit Html
    
2. Search for tag 
3. Add below line of code Before tag

Step 2: Adding Widget Code it's Simple Replace my facebook page URL below with the URL for your page. (Note:- Facebook URL Must starting with "http://" and it contains no space or illegal Characters )

 Live Demo معاينة الاضافة :-

Watch the live demo at Right of this Page

Here There are 2 Simple Steps
 

Note: Adding Jquery JavaScript Plugin(Ignore this step if your blog have already a Jquery Plugin)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

ثم توجه الى تصميم/اضافة اداة/html/java ثم اضف الكود التالي

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu6pKiTL2mZy0nI3Tl16RUuIqlTj1DtZ_JMceE72xdlKdbDW_AA-RG_v4k4dSLP1fTxN4oPmKn9xQgaXuqi670K_LfAXOdifaaeMkS_6D9CSzUboM3t0vcCgVulayYwBIZXuVnsOZP5J1a/s150/w2b_facebookbadge.pn") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div><iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Over-the-World/255991854431966&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe><span>By <a href="http://www.way2blogging.org/">Way2blogging</a> / <a href="http://www.way2blogging.org/2011/06/add-static-facebook-pop-out-like-box.html">+Get This!</a></span></div></div>

finally replace my page link with yours

-------------------------------------------------------------------------

Animated Sliding Panel with content

Live Demo :-

Click here! to See Live Demo
Watch the live demo at top left of this Page

there are three steps

Step 1: Adding Jquery JavaScript Plugin(Ignore this step if your blog have already a Jquery Plugin)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"
 type="text/javascript">script>

Step 2:

<script src="http://bloggerblogwidgets.googlecode.com/files/jquery.slidePanel.min.js"
 type="text/javascript">script>

Step 3: Adding Jquery Slide Panel Widget Code

Here i am Giving Widget Code generator Form and i Include all possible Options with advanced CSS Styling. You can add multiple pannels.

Customize the Trigger CSS & Panel Content CSS Fields as you need.

For Color Code please use our HTML Color Code Generator Tool.

Settings :

"Put any Unique Number" means, if you add multiple Sliding panels the each slide panels have special CSS and Jquery Callings. so you put any Unique number, for Ex:- 3, 7, 6, 8, 12, 26, 56 ...

for Trigger Name and Panel Content please See the Image Below.

------------------------------------------------------------------------------

Auto Scrolling Recent posts

Auto Scrolling Recent Posts Widget, Blogger recent posts in your blog which looks Good in your Blogger blog. This is similar to display recent posts in your side bar or any where you want, but this will have marquee effect in this widget. You can scroll recent posts horizontally or vertically according to your need.

How to Install This Widget On 'Blogger' ?

1. Customize Options in Given Widget Generator Form
2. Click on Generate Button
3. Click Preview** Button to see your widget Preview
4. Finally Click Add to Blogger Button to add this widget on Your blog

**Note:- After changing any values, First Click Generate Button and then See Your Preview

 Note:- Choose appropriate Image Bullet or Icon That have transparent Background and small in Size 

=========+++=======