How to Add Widget Codes below First Post in Blogger

So do you need to add one more ad unit and you just need to direct advertise your friends website or anything now you can add that unit right below your first post in blogger blog. Yes this method is already used by blogger itself when you choose monetization option in blogger blog, so now you can manually add anything right below your first post, like I have also added an AdSense ad as I was using only two ad units earlier on my homepage so I added this third ad unit.

So now if you need to add any widget code or ad code then you can check out below easy steps and you will be able to add anything right away. For demo you can check out my homepage of this blog.

1. Open Blogger.com –> Template –> Edit HTML.
2. Now click on Expand Template Widgets option and press Ctrl + F and make a search for <b:include data='post' name='post'/> & add below code below it.<b:if cond='data:blog.url == data:blog.homepageUrl'>
   <b:if cond='data:post.isFirstPost'>
   <div style='border:1px solid #ccc;background:#f9f9f9;margin-bottom:15px;padding:10px;text-align:center'>
   "ad code here"
   </div>
   </b:if>
   </b:if>
3. Now just replace the "ad code here" with your code for ad or anything you would like to display below your first post.
4. So now if you want to have that widget loading when the first post is open then you can remove that red line's from above code.
5. So I have added default styles I am using on my website, so if you are good at CSS you can customize this widget more further.