How To Add Smart Jquery Featured Slider to Blogger/Websites



This is a another tutorial about, how to add great featured jquery content slider to your blogger blog or other website.Read the instruction given below to add this featured content slider to your blog with in few minutes.Remember to use 307px width and 254px height images for this slider.I recommend to DOWNLOAD java script files and host it yourself.Also you can see the DEMO of this slider HERE.

1.Login to your blogger dashboard--> Design - -> Edit HTML.

2.Scroll down to where you see tag .

3.Copy below code and paste it just before the tag .











4.Now save your template.

5.Go to Layout --> Page Elements.

6.Click on 'Add a Gadget'.

7.Select 'HTML/Javascript' and add the code given below:










NOTE : Replace,

SLIDE-X-LINK-HERE with your real featured posts links.

SLIDE-X-IMAGE-ADDRESS-HERE with your real slide images addresses.

Look at the example below:










You are done.




How To Create JQuery Featured Content Slideshow



In this tutorial I am going to explain,how to create a slideshow to show your featured content to visitors.This is very easy to add and configure.This slideshow is working using jquery.You do not want to host any java script file yourself to add this slideshow to your blog.So you can add this slideshow to your site with in few minutes.Default width=600px and height=240px.But you can change it easily to match it for your website.

If you like add this slideshow to your blogger blog or website,then follow the steps given below.



1.Login to your blogger dashboard--> Design - -> Edit HTML.

2.Scroll down to where you see tag .

3.Copy below code and paste it just before the tag .








4.Now save your template.

5.Go to Layout --> Page Elements.

6.Click on 'Add a Gadget'.

7.Select 'HTML/Javascript' and add the code given below:


You can add more slides as you like.

Note : Replace images URLs,"This is featured post X title","Replace This Text With Your Featured Post X Description" with your content.

You are done.




How To Add Random,Rotating Images for Blogger Header



In this tutorial I am going to explain how to add random,rotating images for your blogger header background.When after you adding this feature to your blogger blog,header image of your blog will rotate/change in each page refresh.Before doing this trick you must create header images for your blog.In this tutorial I am going to show how to rotate 5 header images.

1.Log in to your dashboard--> Design- -> Edit HTML

2.Scroll down to where you see tag.

3.Now copy below code and paste it just after the tag.


NOTE :

Replace "URL-OF-HEADER-IMAGE-X" with your image URLs.

If above code doesn't work for your blog,then replace "#header-wrapper" with "#header".(ID or Class of your header section).

You can add different number of images than 5.But remember to change "4*Math.random()" according to the number of images you add.For example,when you want to add 8 different images for your blog header background, then code should be change as "7*Math.random()".Look at the example below:


4.Now save your template and your done.Refresh your site few times to see the result.Your header image will be rotate.




How To Add Twitter Follow me Button to Blogger/Website



This tutorial will explain to you how to add Twitter Follow me Button to your blogger blog or any other web site.This service is provided by Tweetmeme.com.This Follow button is for website and blog publishers that want to encourage their audience to follow them on twitter. This button provides the interface to see the follower count of a particular user and a button which upon pressing opens the follow pop-up providing a number of different views and statistics about the user from additional services such as Twitter Grader, Twitalyzer and Twitter Counter.

If you are a blogger then follow the steps below to add this 'Twitter follow button' to your blogger post.

Twitter Follow Button

1.Login to your blogger dashboard--> layout- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see below code:


4.Now Copy your "Tweetmeme Follow Button" code and paste it just below the above code.

NOTE: If you can't find
in your template, paste your "Tweetmeme Follow Button" code just before .

Code 1:






Result:


Code 2:







Result:


Code 3:







Result:


NOTE : Remember to replace yourtwitterusername with your real twitter username.

If you are not a blogger,you can too add this code simply your website.

5.Now save your template and you are done.




New Stats Feature on Blogger in Draft



Is there a statistics feature on Blogger?
How to check traffic on Blogspot?
How to see statistics and analytic of my blog?

Here's a new feature implemented by Blogger, however in Blogger in Draft for the moment. Once it's finalized, it will probably be implemented on Blogger as well.

blogger in draft stats

Once you're on the Stats page, navigate yourself on the navigation to see more detailed information. The stats can be changed depending on your choice - Now, Last Day, Last Week, Last Month or All Time.

stats navigation

Overview Section

On the Overview page, the page views is shown.

page views

Blog posts with the highest page views.

blog posts with page views

Short summary of the traffic sources and audience.

traffic sources and audience

So basically it's like a summary. The stats of the blog can be roughly seen on this page.

Posts Section

On the next page, the Posts page, the more blog posts with the top highest page views will be shown.

top highest page views

From this, blog posts are giving the blog most traffic can be identified.

Traffic Sources Section

On the Traffic Sources page, more details can be obtained. The referring URLs, also known as links, that direct traffic to your blog.

referring links

The referring websites. Shows which website gives the blog the organic traffic.

referring sites

And the referring keywords as well. Usually these are the keywords people search on Search Engines and got into the blog.

referring keywords

So these information is basically the sites and links that has given traffic to the blog.

Audience Section

On the last page, the Audience page, there's a page views statistics categorized by countries. Visitors' location can be identify by looking at the illustrated map and list.

page views by countries

Also, page view categorized by web browsers. The top used browsers used to access the blog can be known too.

page views by browsers

And lastly, page views by operating systems. Pretty self-explanatory.

page views by operating system

All in all, a little information about the visitors can be seen here.

Besides this default stats feature, other external Traffic Tracker and Statistics on your Blogger blog as well.




"Blogger Stats" - Check Traffic of Your Blog through Blogger



Few days ago, Blogger, has introduced a full-featured, real time stat service for your blogspot blog.The new Stats feature shows all traffic stats data of your bloggger blog, in a simple, easy-to-understand graphical user interface.

So now you can check traffic stats of your blogger blog without using any third party services.You have nothing to install or configure.It monitors and analyzes your visitor traffic in real time, which technically is not possible with other tools, not even in Google Analytics.

The coolest thing about the new Blogger Stats is that it monitors and analyzes your visitor traffic in near-real-time. You can see which posts are getting the most visits and which sites are sending traffic to your blog right now. For example, if a reader shares one of your blog posts on Twitter and the post is getting lots of clicks, you will see a traffic increase in Blogger Stats almost instantly, with the particular Tweet mentioning your post being identified as the traffic source. Of course, traffic data across longer time periods (day/week/month) and all-time historical data are available as well.

From Blogger in draft




Right now it's available for Blogger in Draft only, but soon you can see this feature in your main Blogger dashboard.To check this feature,Login to your Blogger in Draft dashboard.You can see a link called "Stats".Look at below:



Click on that link and now you can check your blog traffic stats directly from blogger.Here you can check features like page views of your blogger posts,Traffic Sources of your blog,popular search keywords that send visitors to your blog, which country your visitors come from, and which web browsers they are using,etc...



This new feature will helpful to all blogger users to know what's going on with your blog right now.As a blogger I am very happy with this new feature of blogger.






How to delete navigation bar on Blogger Draft template?
How to remove default bar on Draft Template Designer?

blogger draft navigation bar

It can also be done via this method. Navigate yourself through:

Dashboard > Design > Template Designer > Advanced > Add CSS

And then add this:

#navbar-iframe {display: none !important;}

Click "Apply to Blog" and you're done.

Credit: Comment by Bytexpert

P/S: Click here for the previous workable method.




How To Add Blogger Official Share Buttons



In this tutorial I will explains, how to add blogger new share buttons to your blogspot blog.This will more helpful if your template is a highly customized blogger template.But your template is a blogger default template, then you can add this share buttons editing the Blog Posts widget and enabling Show Share Buttons in Page Elements section.



But this method does not work for you,follow the steps given below to add blogger share buttons to your blog.


Blogger now offers new share buttons. The new buttons can be placed under each post and let your blog readers easily share your post via email, Blogger, and popular social networks—we now support Google Buzz, Twitter, and Facebook, and we plan to add more services in the future.
-From Blogger Buzz


1.Login to your blogger dashboard--> layout- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see below code:

Blogger Share Buttons


4.Now Copy below "Blogger Sharing buttons" code and paste it just below the above code.

NOTE: If you can't find
in your template, paste "Blogger Sharing buttons" code just before .







This will show blogger sharing buttons below post header.But if you want to show share buttons below blogger post,then paste your code just after .

5.Now save your template and you are done.