How to add images without gap in blogger Manually

This article shows you  how to add images without gap or space in Blogger Manually..

Follow these simple steps:

Create new post in blogger

click compose tab

click insert images tab 

Add any no. images which u want

Then click the html tab

copy the entire code

Now open MS word document and paste the code in it

Now click Ctrl + h (find and replace) 

1. Copy this code and paste it in Find what tab

      <div class="separator" style="clear: both; text-align: center;">

Now leave the Replace tab empty and  Press Replace all button

2. Now again copy this code and paste it in Find what tab

    style="margin-left: 1em; margin-right: 1em;"

Now leave the Replace tab empty and  Press Replace all button


3. Now again copy this code and paste it in Find what tab
    
             </div>

Now leave the Replace tab empty and  Press Replace all button
     

4. Now again copy this code and paste it in Find what tab
    
             <br />

Now leave the Replace tab empty and  Press Replace all button


5. Now if u want to change the height and width of the images all at once just copy this code and paste it in Find what tab

         height=^?^?^?^?^? width=^?^?^?^?^?
    
             

Now leave the Replace with height=200 width=140 and Press Replace all button
(change the numbers in green color if you want different sizes) 


6. Now lastly copy this code and paste it in Find what tab
    
             ^p

Now leave the Replace tab empty and  Press Replace all button


Now copy the converted code and paste the code in html tab then press the compose tab and check the result

Read More

Putting Adsense ads inside Blogger posts Simple way

This article shows you  how to place AdSense ad units right inside Posts or Pages on a Blogspot blog.

Once you have signed up for AdSense, you can easily put Adsense ads into blogs.  Blogger has options that let you place ads gadgets in the page template, without seeing any HTML code.  Ads may be placed in the sidebar(s) and in the footer of each post.

But there are limitations to this, and sometimes ads in your sidebar aren't the best approach, because readers easily become "ad-blind" and ignore them.

A Better Approach?

To make it more likely that readers will see your ads, you may want to put them into the body of your posts, as I have done underneath this paragraph.

This won't always be better than having ads in your sidebars or immediately above or below your posts - it all depends on what your blog is about, and how people read it.   But it may be worth doing to test to see which placement is better for your blog. 

How to put Adsense Ads into Posts or Pages:

Blogger doesn't have any tools to support this.  So you need to put the AdSense code into your posts yourself.   While this is a bit fiddly, it does mean that you have a lot of control over where the ads go, and how they look, including the option to  show image-only ads.

Follow these steps:

1. Get the ad-code, and copy into your clipboard.  (The AdSense help page for this is here.)
2. In the Blogger editor, write the contents of the post.
3. In  Options (under Post Settings in the bar on the right of the Post Editor), check that "Use <br /> tags" is chosen for the Line Breaks setting.
4. Go to the place where you want to put the ad.  Put in some "marker text" (a word that isn't used the post, eg "XXX" ).
5. Align the marker text  the way you want the ad aligned (eg centered).
6. Choose the "HTML" tab, and go to the marker-text.
7. Replace the marker-text with the ad-text from step 1 (ie paste it in)
8. If necessary, put line-breaks (<br />) before or after the ad.
9. Publish the post, and check that it looks the way you meant it to.

Read More

How to Add Facebook Like Box into Blogger Blog

Facebook fan Page are a great way to promote your blog or website and facebook like box is widely used social plugin from Facebook developers. This facebook like box will help your visitor to become regular reader just by clicking like button. So that this box will increase number of your facebook fans. To get this widget follow below procedure,

• Simple facebook like box

Let me explain how to add simple facebook like box.

1. Login To Blogger Account.
2. Click Layout > Add A Gadget.
3. Select HTML / Javascript > Paste The Following Code In content Box.

<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/ContestAdda/341263169402612&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&" style="border:none; overflow:hidden; width:292px; height:258px;" >

Replace my facebook page URL  with your page URL, Change Width And Height According To Your Template.

4. Now save and you are done.

• Floating facebook like box for Blogger

Now I came up with new tutorial for adding floating like box to blogger.

Adding Jquery Plugin

1. Go To Dashboard > Template > Edit HTML

2. Search for </head> teg in your template and just below it paste the following JQuery code (You can ignore this step if Jquery Link is already added in your template)

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

• Adding Widget Code

1. Go to Layout > Add A Gadget

2. Select HTML/Javascript

3. Paste the following code inside it,

<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/AVvXsEiFExJ3pMOgbTL5X1kRIiS-7-jgEdmhafJAxnLyrBqO_0MjL7AX3Yl8ccdGw3P-in7BW4h4L7isJAQ4cGc9ZDM8fkjJl8_tKYIRUsmHKn-ukG1aVS75iG5bKPow2xUZvhY0n_vMqZMYYvrZ/s1600/FloatingFB.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 300px;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=http%3A%2F%2Ffacebook.com%2Fpages/ContestAdda/341263169402612&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=9&amp;stream=false&amp;header=false&amp;height=292" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 292px; width: 245px;background:#fff;"></iframe><span><a style="font-family: arial, sans-serif; font-size: 9px; color: #999;" href="http://www.jobsmag.in" target="_blank"> JM</a></span> </div> </div>

4. Replace pages/ContestAdda/341263169402612 with your Facebook fan page URL.
5. Now save your template and you are all done!

Visit your Blogs to see it floating at the right side of your webpage.

Read More