How to Create Custom Widget Section to Blogger Theme (Free)

As you know if you are using a free Blogger theme, then you might see less customization options and if you want to Add more widgets to your website then it is not possible or has limited options.

What if you want to Add a hero section to your Blogger website or want to create New Adsense Widgets in your Free Blogger theme.

Well, You can now create your Own widget sections where you can customize the number of widgets, It’s position and visibility. You can add widgets at the top and bottom of the homepage, Post page or any other pages like category and search pages.

This is going to be super helpful for you. So, Follow the video Guide and Implement it on your Blogger website.

Here is the code you need to Add in your Blogger theme.

<b:if cond='data:blog.pageType == "index"'>
  <b:section id='NewSection' class='widget-area' maxwidgets='3' showaddelement='yes'>
    <b:widget id='HTML1' type='HTML' title='Homepage Widget'>
    <!-- Add your custom widget content here -->
    </b:widget>
  </b:section>
</b:if>

Here, You need to Change the Section Id which will also show in the layout page and You can assign the maximum number of widgets you want to add in that section.

You also need to change the widget Id and title before saving it.

Here, this code will create a New section along with the option to add more widgets in your Free Blogger theme. This will show the widgets only on Homepage of your Blogger website.

If you want to display this only on Post page then you can change the Blogger conditional Tag given below.

<b:if cond='data:blog.pageType == "item" or (data:view.isLayoutMode)'>
  <b:section id='Ad Section' class='widget-area' maxwidgets='3' showaddelement='yes'>
    <b:widget id='HTML150' type='HTML' title='Adsense Widget'>
    <!-- Add your custom widget content here -->
    </b:widget>
  </b:section>
</b:if>

Let me know if you have any doubts regarding this in the comment section.

Don’t forget to Like and Subscribe Key2Blogging.