Web Toolbar by Wibiya

Dec 17, 2011

Add Sliding Facebook LikeBox To



How to add a pop out facebook like box with slide effect like as you see in the image above. Basically it uses JQuery effect for sliding.
The image floats on the left side of the page when you put your mouse pointer on it. The image slide has a facebook like box with a cool style.
To get a facebook sliding likebox like this one , just follow as below:

Dec 9, 2011

Create forums for blogger (blogspot)

Creation of forums for your blogger (Blogspot) becomes very eazy today . if you want to create one as the image you see above, just follow the steps below:

1. Create and publish a new static page on your blog, exclusively for a forum.
      check out my forums-static-page here, just for example:

http://nadori-news.blogspot.com/p/forums.html

2. Create a new forum by Signing  to Free Forums at Nabble .then  activate your account via registred e-mail  within this site
3.1 Click on " Embedding Options " like in the image bellow: 


 3.2 Copy the javascript code generated in the widow after:


4. Go to Blogger Dashboard -> Design -> Edit HTML and mark the tick-box "Expand Widget Tempaltes".
5. Find (CTRL+F) this code, in your template:
 <div id='content-wrapper'>

6. If you don't find the above mentioned code, then search for (CTRL+F) this one (for new templates made for Blogger Template Designer)

 <div class='columns fauxcolumns'>

7. immediately ABOVE / BEFORE it, paste the code you got from Nabble, with this ADDITIONAL code (Highlighted in BLUE and RED):

<b:if cond='data:blog.url == &quot;http://nadori-news.blogspot.com/p/forums.html&quot;'>
PASTE_CODE_FROM_NABBLE_HERE
</b:if>

NB1 : Replace the code in RED, with the link to your forum-page

8. Save your temaplate.

++++  The step below  will HIDE everything from your blog (post content, sidebar widgets etc.) and ONLY forum will be visible in your forum-page. ++++

9. Find this code in your template:

 </head>

10. ABOVE/BEFORE it, paste this code:

  <b:if cond='data:blog.url == &quot;http://nadori-news.blogspot.com/p/forums.html&quot;'>
<style type='text/css'>
#content-wrapper {
display:none !important;
}
.columns, .fauxcolumns {
display:none !important;
}
</style>
</b:if>

 NB 2 : Replace the code in RED, with the link to your forum-page

11. save and view your new forums

NOTE:  to replace an entire blog with a forum, as shown in the first example (Forum In A Blogger Blog), then, first create a new blog. Download the template as a backup. Now, replace everything between the BODY tags in the template:

...
<body>
...
...
...

</body>
...

 with the code copied from Nabble. So your template, code will look something like this:

it will seem like this:
...
<body>
<a id="nabblelink" href="http://nadori-news-forums.******.n4.nabble.com/">nadori-news-forums</a>
<script src="http://nadori-news-forums.******.n4.nabble.com/embed/f******"></script>
</body>
...

Save the template and enjoy.

Dec 8, 2011

create a sitemap of blogger (blogspot)


Let us see how to create a sitemap (site map) of blogger blog . Once you have added your blogger blog to Google Webmaster Tools you need to add Sitemap of your blog to Google Webmaster Tools.

But how do you create sitemap for your blog?


It is simple.
You can either use your RSS feed or ATOM feed as sitemap in Google Webmaster Tools.
First find your RSS feed or ATOM feed URL.Normally it will be in the following format.
http://yourblog.blogspot.com/rss.xml
or
http://yourblog.blogspot.com/atom.xml
Normally the feed will not have all your blog entries,it will have the latest ‘n’ number of entries.

So how do you create a feed URL with all the blog entries?


You can do it as follows.
Just add the ‘start blog index’ and ‘number of blogs’ in the feed url as parameters as below.
http://yourblog.blogspot.com/rss.xml?max-results=500&start-index=1
The above url will include maximum 500 feed entries in the sitemap.

now add your feed to google sitemap and it's done

Dec 6, 2011

twitter flying bird for blogs


Harish of way2blogging has coded a beautiful  twitter bird that flies from corner to corner of your web page as you scroll up or down your posts content. It has a follow me link as well as tweet link.
We have added it to Nadori-News   and we are happy to share it with you.


 So to implement this twitter addon to give your site more attractive view , just follow these few steps below:
  1. Go To Blogger > Design > Edit HTML and check the  box near "Expand Widget Templates"
  2. Backup your template
  3. Search for </body>
  4. And just before it paste the code below.
<script src='http://bloggerblogwidgets.googlecode.com/files/way2blogging.org-tripleflap.js' type='text/javascript'>
</script>
<script type='text/javascript'>
var twitterAccount = &quot;Your Twitter Username goes here&quot;;
var tweetThisText = &quot; <data:blog.pageTitle/> : <data:blog.url/> &quot;;
tripleflapInit();
</script>

Just replace " Your Twitter Username goes here" with your twitter UserName

     5.  save templte and open a post in your site.
wow... do you see the cute bird following you from cornr to corner of your page?

To see a DEMO  , just open this post in our blog .

Related Posts Plugin for WordPress, Blogger...

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More