How to add custom CSS in new blogger interface

How to add custom CSS in new blogger interface

How to add custom CSS in new blogger interface: Blogger theme customization not has Add CSS option anymore. Need to add custom CSS using HTML gadget.

Right, If you check Blogger (BlogSpot) new interface 2020, it will not have option to Add CSS from theme customization.

New blogger interface have Theme > CUSTOMISE > Advanced section. New advanced section has nice UI and options to manage theme design, but section not have Add CSS option, which available in old legacy Blogger design.

For this case, given solution in this page will works 100%. Using this solution, you will able to add custom CSS dynamically without editing theme template code.

Steps to add custom CSS in new blogger interface

  1. Sign in to Blogger site.
  2. Select the blog to update.
  3. From the left menu, click Layout.
  4. From the area where you want to add, click Add a Gadget.
  5. Select and Add HTML/JavaScript gadget from list.
  6. Add your custom CSS in gadget between style tag.
    • For example: <style>.my-span{color:green;}</style>
    • Click Save button after adding custom CSS.

Note: If you using blogger new responsive template, which have separate sidebar for post and page. In that case you need to add gadget in both Sidebar and Sidebar (Item Page) gadget area with same CSS entry.

We started using new interface in our some of bloggers blog. When time to come for custom CSS, we try to find such option in theme advance options, but no luck.

At the end, we try above solution for custom CSS in new blogger interface and its work great. If you are facing same issue, then following steps will definitely helpful for you.

Above given is simple dynamic solution for add custom CSS in new blogger interface. This will work in all mobile and desktop browsers. If you are using other related solution or suggestion, you can share it in comment section.

Leave a Comment

Your email address will not be published. Required fields are marked *