HOW TO CHANGE BULLETS Style With Image Hover Effect In Blogger

As every blogger wants to make it post more stylish and attractive. So each and every thing matters while designing your blogger template. Whenever we post any article we mostly used number list or bullet list to describe points or steps. As default bullets are black in color. So to make then more attractive you have to do some effort. This widget will help you to make bullet list stylish and make your blog post more attractive. In this widget black default bullets are replaced with blue color bullets and Whenever someone hover mouse on it will turn into green. So to make changes into your default bullets simple follow below given steps.

How To Change Your Bullets Style

• Open Your Blogger Dashboard >> Template

• Then Click on Edit HTML and search for ]]></b:skin> 

• After searching above code Paste below given code just above it.

.post ul { list-style: none; } .post ul li { line-height: 1.4em; 
background: transparent 
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTAcfLsNbbZE9OYUewHmPKgWEuMmougQ-cmefUAMJbsQXIhhh9qoqgVuRxCR-bifS5_MHmtzptXRrY-_aKQD-e8oIdKrsFqXJxLgMm4Ok-S2IT2GUPeYYpW7H82i7t2Yrc4vmMC53lmbPw/s6/blue-bullet-icon.png)
 no-repeat scroll 0 5px; margin: 0.3em 0; padding: 0 0 0.8em 20px; }


.post ul li:hover { background: transparent 
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyfL0mtSucZMOArX6tzmLweV1R46lg759CLozTpaYyKkZ3-qqBXU1h3VTrUugZin37mZ86S9JYyxH1hgIUNQrje4A54Y20hRdH-zYP_9JQ_hiOjSpGr5_m4tBwi32ftJNjLBJc5IYZNG8v/s6/green-bullet-icon.png)
 no-repeat scroll 0px 5px; }

• After Pasting click on Save Button.

• Now Check your any post which contain bullets list or create any new post to check.

Some Customizations

• If you want to change alignment of bullets horizontally then change the value of 5px

• If You want to replace Bullets with any another image then replace Image URL in color code of