Skip to main content

Posts

Showing posts with the label Widget

How to add auto scrolling recent posts widget for blogger

Many blogspot users always wants to manage their posts with different methods. Like so, some use auto scrolling technique to manage or update their posts to the visitors. Actually, scrolling is also known as marquee behavior. Here I have shared a bunch of codes to make auto scrolling for recent blog posts.

By the way, it is nothing except managing latest blog posts like displaying posts in the sidebar. So if you wish to add this widget into your blogspot blog, then follow the following steps properly.


Step 01: Just login into your blogger dashboard and go to blogger layout.
Step 02: Now just click on add widget link.
Step 03: Add the following bunch of codes there and save it.

<script type='text/javascript'>
var jnWidth="110";
var jnScrollAmount="15";
var jnScrollDelay="55";
var jnDirection="left";
var jntargetlink="yes";
var jnnumPosts="12";
var jnBulletchar =">>";
var jnimagebullet="yes";
var jn…

How to add Facebook share button in blogger posts

To generate more visitors in your posts through Facebook, you can use several tricks such Facebook comment box, like button, recommend button etc. Among all, Facebook share button is one of the good tricky ways. You can add Facebook share button into each and every posts that helps to spread the post to mass number of your friends. It means it brings visitor on the post or article. Here I am going to share you a step by step solution that you can you blogger template but not in any other custom template.
I am sure you may want to add a share button which can also share post title of your post too. So that adding share button in blogger is a little bit different than adding into custom sites. Such kind of code you could not find in Facebook plugin documentation.
Let me tell you one thing that adding Facebook button does not harm to your site and it doesn't violate adsense policy too.
Let add Facebook share button in each and every blogger posts just through a single block of codeS…

CSS 3 Mega Menu For Blogger

CSS stands for Cascading Sheet Style. CSS gives the style to the HTML tags. In earlier phase of web, there had not been developed the CSS 3. Now CSS 3 has reduced the long and vague and more difficult codes of javascript and jquery. CSS 3 is the latest version of CSS.

By the way making mega menu using jquery and javascript is very hard to understand. Most of the designers just copy and paste to use the mega menu. But using CSS 3 is very easy to make mega menu. Here I am just showing tips to create mega menu using CSS 3. Follow the bellow steps and make a mega menu for your blogger and your html/css website.
How to make mega menu using CSS 3?Step 1: Open any platform like Notepad or Dreamweaver. Step 2: Put the below code into the middle of <style> </style>. .main_menu{ background:#006;}
.main_menu ul li a{ font-size:15px; font-weight:bold; text-transform:uppercase; color:#fff; padding-right:25px !important; padding-left:25px !important;}
.main_menu ul li a:hover{ background…

How to add fixed facebook like box in the blogger Right Scroll

One of the most useful and popular way of getting more likes into your business's facebook page is to put facebook like box into your blog or sites. Basically, you should copy the script given by facebook to add facebook like box into your site as documented by Facebook developer. However, there may be difficult to add any facebook plugins in blogger template, because blogger template has xml codes whereas facebook plugins has html and javascript codes.

Different looks of Facebook like box can increase more likes in your business's Facebook page. So you should apply different techniques. Like you can pop up like box and you also can fix facebook like box in blogger. This time, I am giving a block of code that helps you to add fixed facebook like box in the right sidebar of blogger, in which a facebook img is attached. When you point Facebook img, it hovers and slide on left. Then you can see Facebook like box.
Follow the given steps to add fixed Facebook Like Box in the side…

Dynamic Adsense Placement - After First Paragraph of Post

Bloggers use different techniques of ads placement to get more clicks on their adsense ads and any other. Like, placement of ads inside blog post, bottom of the post, sidebar placement, header placement etc. But I think many may not have appliedadsense placementunder the first paragraph of the post. This technique is new and I hope this will definitely help to make more money from ads publishers like adsense,infolinks , chitika etc.

Create Infolinks Account and Earn Money

Here is straight process of placing adsense ads just after the first paragraph of a post. This is only applied in blogger blog. Indeed, this technique is for blogger but if you also want to place in other platform like wordpress and joomla. There you may find plugins or you have to put using some codes like below:

How to put ads just below the every blogger post?
Step 01: Login blogger dashboard>>template. And click on edit html . 
Step 02: Just search for <data:post.body/>. Use CTRL + F button to search.
St…

How to Add Smileys on Blogger

Using Smileys and Emoticons in chatting, commenting and in messaging have become a very popualar. This can be the great way to make the discussions and debate very interesting and fun. Emoticons and smileys can be angry, happy, teasing, laughing, crying, smiling etc. So using it in the blog comment can be more enjoyable.

I always recommend you all not to change any code without keeping back up your template.

Here is very easy steps to add smileys and emoticons.

Step 1: As usual Login to your dashboard of blogger.
Step 2: Then go to template and click on edit html

Step 3: Find </head> Section
Step 4: After that paste the following code above </head> Section

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>Step 5: Then here we go to add the images of smileys on the comment box.
find the give codes

Note: click ctrl and f to find out the code.
</body>Step 6: Paste these code just above </body>
<…

How to Hide Content of Website and Blogger

Most blogger wants to hide some content from sites and blogger blogs because they try to make their blogs different one. When a blogger ads a content to header like all blog solution which has a header bar for recommended article, it must be flexible that is it must be removable. So that you need to add hiding jquery codes along with some html code. Lets follow the following steps to hide a block of content.

First Step: Log on your blogspot dashboard and go to template > edit html, now add id='remove' and <span id='hide' style='float:right; font-size:18px; font-weight:bold; padding right:15px;'>X</span>


eg: <div id='remove' style='background:red;  padding:7px 2px; color:blue; text-align:center;'>Les remove this content now<a href='http://allblogsolution.blogspot.com' style='font-weight:bold; color:white;' target='new'> Download This Template Now For Free </a>                 <span id=…

Random Thumbnail Posts Widget for Blogger

There may be several posts in a blog and it is not possible to show all of your posts on home page of any site and blog. In fact all the posts can be equal important for any time. In that case you should update your posts repeatedly to show older posts in home page.

Yes there is also another way to show your older posts in home page and that technique is to show random posts. Random posts widget is a block of codes for blogger which shows a no of list of blogger posts. Adding this widget may help you to increase the visiting time of visitor in your blog or site and also decrease users flow to another site. Here is the block of codes of random thumbnail posts. I hope, this will enjoy you on blogging.

How to Add Random Thumbnail Posts Widget for Blogger ?
Step 01: Login >>Blogger Dashbord.
Step 02: Go to Layout >> Add Widget >> HTML/JavaScript.
Step 03: Copy the following code and paste it

<style>
#random-posts img{border-radius: 10px;float:left;margin-right:5px;
w…

Add Simple Facebook Like Box To Blogger Blog

Do you guys want to know the fans of your blog/site ? Of course there are several tools or widget that helps you to find the followers or fans of your blogger blog. But among them, using of Facebook like box now is the best and easy way. The Facebook offers many open plugins or widgets and Facebook like box is one of the most popular plugin/widget of Facebook.

In this tutorial you can find a simple Facebook Like Box that you can customize easily using some css. If you have little bit knowledge about html/css, then you can easily customize this like box. Customized Facebook Like Box may be colorful and beautiful if you want. This may grow number of fans and followers into your blog.

How to Add default/Simple Facebook Like Box to blogger blog Lets follow step by step solution to add simple/default like box to your blog.
Step 01: Go to Login page of blogger and enter into dashboard. Step 02: Now move to Layout page and click on Add Gadget link. Step 03: Find Html/Javascript gadget and sele…

Show Particular Label Posts in Homepage

If everything is perfectly organized in your site or blog, then all the pages or post of your blog can be reached by the visitors easily. Like when we visit a news portal we can see there every news is categorized into different categories. Such as Asian news, european news, sports news, entertainment, etc. So that the visitors can find each and every news easily. Likewise some of the blog and site should be categorized into different categories. But there is little difficult to make the blogger post into categories. To categorize the recent post, we should use the lebel as category. It is a process of showing particular label's post in homepage. This kind of widget, you cannot find in blogger.

As usual we always advised you all not to change any code before keeping back up your templates because if you accidentally missed placed the codes, you can restore the template.

Here is techniques to make the particular label's posts showing in homepage:Step 01: In First as usual Go t…

Recent Posts Wigdet for Blogger With Thumbnail

Actually blogger shows the recent posts in default. Blog means to reveal the ideas, describing something that you like, criticizing or sharing about your personal or business matters. So that blog always should be representative, then blogs can be useful to every people. Therefore you should make  more useful. To make , your blog useful, your blog should be representative first. There are several factors that you must apply to make your blog good representative. Among them, proper showing the information revealed in your blogs are very important. To manage the information of your blog properly, you must add many widget likewise recent post, popular post widget etc. Among them, here I have just told you how to add recent post widget in your blogger blog.
How to Add Recent Post Widget in Blogger Manually?Step 1: Login In into Blogger. Step 2: Go to Layout>>Html/Javascript Step 3: Click on Html/Javascript  Step 4: Just add the below code and save it. <script src="http://ajax.…

Blogger And Google Plus Comment System in Blogger Blog

Blogger has its own default commenting system and instead of it Google also offers google+ commenting system in the blogger blogs but many bloggers got this often difficult and not good because google+ comment system forces visitors to make google account to comment using google+ comment box. And it seems that this discouraged many visitors to comment constantly on the any blogger blog and among those visitors I am the one. If you get comment from the google+ comment box, then blogger never notify you. So that you can not respond to the visitors and this makes you unfriendly behavior with your visitors which can be a worst reason of decreasing of visitors on your blogs and sites.

The one and only way of solving this problem is adding of the both the commenting system: Blogger Default Commenting System and Google Plus Commenting System on your blog which can be a good for your blogger because if a visitor want to comment using google+ commenting, he/she can and if he/she want to comme…

How to Put Facebook Like Button on Each Blogger Post

Friends, we have already added the different Facebook like box like sidebar static Facebook Like Box, Facebook Pop Up Like Box and many other Facebook widget. But We had forgotten about Facebook like button, so here I am just giving a bunch of code to add the Facebook like button in the every blog posts of the blogger blog. But this do not work in the blogger page. This only works on the posts of blogger blog.

Because of the popularity of the Facebook, its every widget is valuable for every business work. So as Facebook Like button is very significant for a blogger article because, if we use Facebook like button, then readers can like that article which helps to increase the visitors on your article through Facebook.

Lets just move toward the steps that you should apply while adding facebook like button in every blogger posts:

Facebook Like Button On Every Blogger PostStep 01: As usual login to your blogger account Step 02: Now go to template>>edit html Step 03: Then just find ou…

Percentage Calculator Widget for Blogger and Website

Friends, this time I have come bringing a percentage calculator widget for you. This widget just calculate the percentage of any given number. This is just a simple html and javascript widget which is very easy to make it if you are familiar with basic html and javascipt. You should only put the base number and the real number, the which percentage is you would like to find out. Just copy the below code into your blogger and in order to do so, you just login into your blogger account and then go to the layout and click on add gadget. Now you choose html/javascript and paste the below code.

And if you want to show into your site, then just paste the css in between the <style>and </style> and javascript code in between the <script> and </script>
Javascript Percentage Calculator <style>
input{ height:20px; border-radius:5px; margin-top:10px;}
a{font-size:8px;} </style>
<script>
function myfunction()
{
var a=document.f1.first.value;
var b=document.…

How to Add Tabs in Blogger Blog

In fact tabs in the sites and blogs are a way of managing bulk of content in a page easily. Tabs help to manage your bulky content easily. If you have lots of content in a single page then, there become difficulty to the viewers/visitors to read all of them content. Instead if you have put content in tabs then visitors can read all of them clicking tabs one by one.

Here is the step by step process of adding the tabs in the blogger blog's sidebar.
Add Tabs Button in the Sidebar and a single page of Blogger:Step 1: Login to blogger and then go to template and click on edit html. Step 2: Now just find the </head> code just press CTRL+F to find it. Step 3: After finding the </head>, you just put the below code just above it. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js">
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js">
</script>
<script>
$(document).rea…

How to Add Twitter Feeds in Blogger Blog

Hi Friends, after long time I am here and I have brought a tip for you and I think you might have already known after seeing the title. Yes Indeed if you want to show your Twitter twits to show in your blogger, then adding twitter feeds widget can be a right way to do so. Actually, this is not difficult any more if you use twitter before. You just need one twitter account to put twitter feeds into blogger blog.

Adding Twitter Feeds in BloggerStep 1: Login to your twitter account if you are an user otherwise create new.



Step 2: Now go to the Setting>>Widgets
Step 3: Create a new widget. Step 4: Then fill all the necessary things there. Step 5: Now Click Save Button Step 6: Copy the widget code as shown in the figure below from your widget.
Step 7: Go to your blogger and layout>>add widget>>html/javascript. Step 8: Now paste the copied code here in html/javascript widget. Step 9: Save it. 
After completing these above steps, your twitter feeds will definitely appears in your …

Script Hosting in Google Drive

Hosting and choosing hosting of a site is too important. Likewise script hosting for a site is also important. If you want to use any script in the blogs and sites, then you should either write those script into the blogger template and site's template or you also can host your script into other platform. But if you want to host, then you need memory or space for which you should pay. But here I just wanna tell you a simple and free way to host any script.

You may not know that you can host script freely in Google drive. And this platform is not only easy and free way but also very flexible and hosting in Google drive makes your site faster than hosting in other platforms.
How to Host Script into Google Drive?Learn step by step way to host script into Google Drive:- Step 01: Login into Google Drive. Step 02: Click on Create>>Script. Step 03: Write your script in there. Step 04: Click on run whether it is ready to use or not. Step 05: Finally click on Publish.
After clicking publ…