How to add Grid style Category section in Blogger home page?

Hello! friends. Welcome to another tech blog. Today in this article I am going to show you how you can add a responsive and beautiful grid style category section in your blogger or wordpress website. 

add a grid style category section in blogger,add a grid style category section in homepage of blogge,add category grid in blogger,create a grid style category section,display category in blogger,how to add recent post grid in wordpress page,how to display category in blogger,how to create a grid style category section using html & css,how to style your divi blog module grid cards,how to create a grid style category section using html and css

This method work on both blogger and wordpress website. You have to do nothing. Just paste some code on your website where you want to show your grid style beautiful category section. Read this full article carefully and follow the steps. I will also tell you about the benefits of grid style category section.

Generally we get very limited number of customization option in Blogger. And we don't  have any plugin support system in it. So if we want to customize our website as we want than we have to depend on custom coding for everything. But don't worry if you don't know the coding. Here in my website I shared alot of codes that will help you to customize your website. 

Today I am going to share with you the grid style category section code. This code is created with HTML and CSS. This code is also responsive with all device. You can also edit and change the icons, titles as you wish.

So lets start our today tutorial. Follow the steps and copy the code carefully.

Steps to add Category Grid in Blogger

So, to add a Grid style category section in your blogger website follow the below steps.

Step 1: Go to your Blogger dashboard and select layout option from menu.

Step 2: Now You have to create a new widget where you want to show the Grid style category section. ( Note: It will looks better if you place it in your website home page. )

Step 3: Now, on new widget option select HTML/JavaScript option and paste the below code in it. After that Don't click on save you have paste another code.

Step 4: Now edit the html code that pasted with your Title and link. You can also change the svg icon by replacing with your icon url.

Step5: Now copy the CSS code given below and paste it right after the HTML code you pasted before.

Step 6: Now save the widget. Your Grid style category section is ready. 

Now you can see your gadget in your website. You can also see a demo in my website homepage as well. This script is  responsive with all devices so you don't have to worry. you can also edit this code which suits your website most. If have any problem and question than you can ask me in the comment section below.

You can also join our telegram channel for more discussion and cool things.

If you like this article than don't forget to share with your friends.

How to add Grid Style Category Section in WordPress 

Well If you want create a grid style category section in your WordPress website as well than just follow the same steps as blogger but you have to paste your code where you want to show it in your blogger website.

Benefits of Grid style Category section 

If You ask me, "why I should use a Grid Style category Section?" Than my answer will be to make your website look more attractive. It also helps your user to find what they are looking for. If the saw the category option on top of your website they can understand about your service and which type work you do in your website. This will help to get you some permanent visitor. Which good for growing your blog. Another word It help you to get traffic. It creates a User friendly environment in your website. Which is a good thing for you. It will create some good review about your website.

Now This is time for me to say goodbye. Hope you created a nice category section in your website. If you like this article than share with your friends.

Post a Comment


Don't upload any spam link in comment section.