How to Add a Widget Below FirstPost in Blogger alphause

Po ... How to Add a Widget Below First Post in Blogger 28 comments This tutorial will show you how to make a gadget/widget to appear just below the first Blogger post. First, you must understand that the usual gadgets provided by Blogger can be added only where the design section allows this. Yet, we can show any element, for example, an AdSense ad, an image, a flash file or a video etc... So, what we will do in this tutorial is to display an element under the first post, this means that it will not be visible below the other posts. This is great when you use any automatic summary, although it is not a requirement. This is easy to do and we will use theisFirstPostconditional tag for that element to show it under the first post published on our blog. Adding A Gadget or Widget Below First Post in Blogger Step 1.From your Blogger dashboard, go toTemplateand click on theEdit HTMLbutton: Step 2.Click anywhere inside the code area and press the CTRL + F keys to open the Blogger search box Step 3. Type or paste this line below inside the search box and hit Enter to find it: Step 4.Just below it add this code:

Here goes the code of the element you want to show

Note: - The bolded text indicates to where you should paste the code of the element (eg. AdSense ad, a widget). - In red are the top margins (margin-top) and the bottom margins (margin-bottom), this is in case you want the element to move towards or away from the entries, also you can add any style like a background color, border etc.. Step 5.Preview to make sure everything is ok, then Save your Template by clicking on theSave templatebutton. That's it! Like 4 Random Posts Add Facemoods Emoticons To Your Blogger Comments12/05/2012 - 40 Comments Add Static Facebook Pop Out Like Box with Smooth Jquery Hover Effect06/04/2012 - 35 Comments Create A Rollover Image Effect (change image on mouseover)31/05/2012 - 55 Comments Related Posts: Add A CSS Animated Share Button on ... Orbit - jQuery Image Slider Plugin ... How to Add Numbered Page Navigation... Add a Custom jQuery Lightbox To Blo... How to Add CSS code To Blogger usin... 28 comments: Julz 3/05/2013 Thanks, Iv'e been using automatic summary for a while, it blends well... Reply Achin Jain 3/05/2013 That is a great tip and very useful, Thanks for sharing such good article.. Reply Akhil Swatantra 3/06/2013 Really Awesome Trick Thank You For Sharing Reply Vita Kranz 3/06/2013 It says, that b:if isnt closed, when I copy the code :/ Reply Replies Admin 3/06/2013 Hi Vita, Thanks for telling me about the problem. Sorry, there was a gap in my code, now I corrected it. Please add it again, it should work now. Thanks for visiting! Md Azeem 3/09/2013 Hey, Admin is there any css code for adding background image for sidebar gadgets! Like Yours.... Ex: In your gadgets In i.e.. Recent Comments The Title Of the Gadget!! Thanks, Md Azeem Admin 3/10/2013 Go to your template and search for the widget's title and when you found it, copy its id (the line should start with "b:widget id='WIDGET-ID-HERE'"). Next, go to the second b:skin and just above it, add the widget's id along with#symbol and ah2tag. For example: #HTML5 h2{ background: url(image-url-here); color: #000000; /* title color */ } I hope this will help. Sokly 3/14/2013 Dear admin, How do I know the code of the element I want to show (for example the the "RSS" Feed)? Reply Nitheesh 4/14/2013 Admin, Can I show a widget named 'incoming search terms' below all of my posts, exactly below author bio ? Reply Replies Admin 4/14/2013 Hi Nitheesh, Find this code in your Template