Topics Widget For Blogger With Hover Effects!

First of all sorry that i had forgotten about a series which was Basics Widgets Series but now here i present you an awesome topics widget which is very much important for every blogger so that people may navigate your blog easily.
So let's talk about features of this widget -

Some Features -

• Responsive
• Clean
• Beautiful
• Effects Ready 
• Font Awesome Ready

Importance Of This Widget -

This is an important widget as it allows your audience to see list of posts according to the labels which definitely helps your audience to surf your blog easily.

By default there is labels widget in blogger but it is not too attractive therefore this widget will perfectly help you there.

So here is the list of basic widgets -

                                               BASIC WIDGET SERIES

• Topics Widget For Blogger
• Awesome Subscribe Box With Effects !
• Social Icons Plugin For Blogger
• Stylish About Author Widget

So this was the basic widget series which will let you install some basic and required widgets in your blog.

You must be anticipated to install this widget so lets start-

Adding Topics Widget In Blogger -

1- Go To Blogger

2- Click Add A Gadget

3- Click HTML/JAVASCRIPT

4- Paste This Code With Customization -

<!--MBA Tags-->
<style>
.mbatags li a {text-decoration:none;color:#007abe;font-size:20px;font-family:lucida handwriting;text-shadow:1px 1px 1px;margin-bottom:4px;}
.mbatags li a:hover {color:black;}
.mbatags li a:active {color:green;}
</style>
<ul class='mbatags'>
<li><a href='#'>Tag 1</a></li>
<li><a href='#'>Tag 2</a></li>
<li><a href='#'>Tag 3</a></li>
<li><a href='#'>Tag 4</a></li>
</ul>
<!--Ends-->

 Customization -

Replace # With Your Labels URL'S And Orange Text With Your Tag Names.

How To Add More Tags ?

It's Simple Just Add this code above </ul> tag With Same customization stated above -

<li><a href='#'>Tag </a></li>

How To Add Font Awesome Icons ?

Firstly Install Font Awesome In Your Blog And Add Font Awesome Icon Text As Shown Below -

<li><a href='#'><i class='fa fa-tag'></i> Tag </a></li>

Need Any Help ?

So this was the topics widget which you can add in your blog and i you face any problem just share it using comments and do share it with your friends.

By the way have you subscribe us ? if not then subscribe now to receive daily updates with awesome freebies.

Stay Calm And Be Happy :) 

Share

Facebook

Twitter

Pinterest

LinkedIn

StumbleUpon