Using bullets in a list

You see the picture of bullets on the left? Those are not the bullets I'll be blogging about this time, well maybe next time hehe. This time I'm going to write about the bullet as in bulleted list. Yeah, bulleted list bullets can attract people's attention too, but not as deadly. Posts that contain bulleted lists in your posts will definitely help you get the message across to your readers more easily. So here it goes,

 

Applying bullets in a post

Putting bullets in a post is easy. Just position the cursor at the line and click the Bulleted List icon. Blogger blog post editor will automatically insert a bullet in front of the line. If you use another blog editor, no worries, yours most probably comes with Bulleted List and Numbered List icons too.

 

Applying bullets in sidebars

Putting bullets in a sidebar is not as straightforward, but not difficult either. You just need to do some coding in CSS (Cascading Style Sheet).

Go to Dashboard > Design > Edit HTML and use Ctrl+F to search for “sidebar ul” element (ul stands for unordered list). You should find something like this:

.sidebar ul {
margin: 0px;
padding: 5px 0px 0px 15px;
list-style-type: square
}

In line 4, that’s the code for bullet, it’s called list-style-type property, with square as value. To change bullet type, you change the value.

 

Three types of bullets

There are 3 bullet choices you have:

1. For value “square” the bullet is ▪
2. For value “disc” the bullet is ●
3. For value “circle” the bullet is ◦

Not that many bullets to choose from isn’t it. Well good news, you can also use image as a bullet.

 

Using a image for a bullet

Here’s how, instead of using list-style-type property, you can use list-style-image as shown below:

.sidebar ul {
margin: 0px;
padding: 5px 0px 0px 15px;
list-style-image: url('YourBulletUrl')
}

Where YourBulletUrl is the link to your bullet image. Hey, your list might look like this if you want to, just be creative.

 

 

Note: You can change the bullet style in posts too, just look for post ul instead of sidebar ul.

Technorati Tags: bulleted list,list