Title: Custom Bullets Last modified: August 21, 2016 --- # Custom Bullets * Resolved [brownknee](https://wordpress.org/support/users/brownknee/) * (@brownknee) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/) * Hello, I’m the office admin for my company. The CEO wanted me to tinker around with the site and make it look a bit better. * I’m a new to WordPress, HTML and CSS, and I can’t seem to figure out how to change my bullets to a custom image. I’ve checked forums and different websites but I cant seem to find anyone that’s dumbed it down enough for a noobie to figure it out. * I’d just like to know how to change the black default bullets to an image, any image that I’ve created. It seems like I have to change something, somewhere in the CSS stylesheet? AND the HTML coding on the page I’ll have my bullets on. * What specific code do I need to change/add, and where would it be? * Website: [http://www.greenteamwindowcleaning.com/](http://www.greenteamwindowcleaning.com/) * Thanks in advance, I’m on the verge of pulling out my hair. Viewing 13 replies - 1 through 13 (of 13 total) * [Pioneer Web Design](https://wordpress.org/support/users/swansonphotos/) * (@swansonphotos) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807565) * [http://www.w3schools.com/cssref/pr_list-style-type.asp](http://www.w3schools.com/cssref/pr_list-style-type.asp) * To discover what CSS is output by your theme, use a web inspection tool such as Firebug: [http://getfirebug.com/](http://getfirebug.com/) , Chrome Inspect Element: [https://developers.google.com/chrome-developer-tools/](https://developers.google.com/chrome-developer-tools/) or Internet Explorer 9+ F12 Dev. Tools: [http://msdn.microsoft.com/en-us/library/dd565627(v=vs.85)](http://msdn.microsoft.com/en-us/library/dd565627(v=vs.85)). aspx#csstool * There are others. * When editing CSS, use a Child Theme [http://codex.wordpress.org/Child_Themes](http://codex.wordpress.org/Child_Themes) Custom CSS Plugin, or Theme provided custom CSS option. Edits to parent themes are lost on theme update. * Learn CSS: [http://www.w3schools.com/css/](http://www.w3schools.com/css/) * Thread Starter [brownknee](https://wordpress.org/support/users/brownknee/) * (@brownknee) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807568) * Thanks for the speedy reply, but that doesn’t quite answer my question. I’d like to add a **CUSTOM** bullet, not a square, greek symbol, or diamond. * I’d like to use an image from another source. * [Pioneer Web Design](https://wordpress.org/support/users/swansonphotos/) * (@swansonphotos) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807579) * [http://coding.smashingmagazine.com/2011/07/13/learning-to-use-the-before-and-after-pseudo-elements-in-css/](http://coding.smashingmagazine.com/2011/07/13/learning-to-use-the-before-and-after-pseudo-elements-in-css/) * [WPyogi](https://wordpress.org/support/users/wpyogi/) * (@wpyogi) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807583) * See: [http://www.w3schools.com/cssref/pr_list-style-image.asp](http://www.w3schools.com/cssref/pr_list-style-image.asp) * Thread Starter [brownknee](https://wordpress.org/support/users/brownknee/) * (@brownknee) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807584) * Thanks again seacoat, but like I said, I’ve explored many different sites already. I’m new to coding and web design. None of the sites, including the few you’ve sent (most of which I’ve already explored), have given me a simple answer as to where I need to add the code in the CSS style sheet. Directing me to websites is not aiding or answering my questions to the extent that I require, because I’ve searched the websites extensively already. * Is there a code somewhere in the sheet that needs editing? Or do I add a new code somewhere in the style sheet? If so, where does that code go? * Thread Starter [brownknee](https://wordpress.org/support/users/brownknee/) * (@brownknee) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807586) * Thanks Wpyogi, I’ve seen this website already as well. And I figured this has something to do with what I need. But again, my question is _ where_ does the code * > ** ul > { list-style-image:url(‘sqpurple.gif’); } * get inserted? Or do I replace something that is already existing within my stylesheet? And how do I add a **custom** image to my page? Not purple squares. * [WPyogi](https://wordpress.org/support/users/wpyogi/) * (@wpyogi) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807588) * Generally best to add to a Custom CSS – which you can add via a plugin if your theme does not have it. Otherwise the changes will be overwritten when the theme is updated. * Further, you probably don’t want to assign this style to every list on your site, so the CSS would need to be targeted more specifically than all `ul` elements. * The code to add an image would not be the above, but * ``` ul { list-style-image:url('URL TO IMAGE HERE'); } ``` * Which list(s) are you trying to do this on? * [Pioneer Web Design](https://wordpress.org/support/users/swansonphotos/) * (@swansonphotos) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807590) * Please _study_ the links we provided (this takes more than a few minutes) – if you do not understand them…stop…you will hose the site… * Thread Starter [brownknee](https://wordpress.org/support/users/brownknee/) * (@brownknee) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807591) * Its only 1 list on the “Luxury Window Cleaning” page. * [http://www.greenteamwindowcleaning.com/5-point-luxury-window-cleaning/](http://www.greenteamwindowcleaning.com/5-point-luxury-window-cleaning/) * And thanks, I’ve tried doing that code you posted before with no luck. * The CEO just threw this assignment at me Friday, it is literally my first time doing any work of this sort. I’ve managed to do everything he and I have wanted to implement so far, except for this last bit. * How do I know if my theme has a Custom CSS or not? * Again seacost, in reference the links you’ve sent me. I’ve studied them for more than “a few minutes.” I’ve read over the links you’ve sent me previously. I have been working to do this again, since Friday, with no success to this last bit of work that I need done. * [WPyogi](https://wordpress.org/support/users/wpyogi/) * (@wpyogi) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807592) * Probably doesn’t, but just try adding this to the bottom of the style.css file( go to that via Appearance > Editor) – find style.css in the right side list ( might already be visible in the main screen there. Go to the bottom and add this: * ``` #post-24 ul { list-style-image:url('URL TO IMAGE HERE'); } ``` * You’ll need to get the absolute URL file path to the image (after uploading it to the Media Library… * Thread Starter [brownknee](https://wordpress.org/support/users/brownknee/) * (@brownknee) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807593) * **Dude. ** * I’m In love with you right now. That code worked! I tried a random image as a test and I got it to become my bullets. * I’m assuming it had something to do with the “#post-24?” * Thanks WPyogi, I really appreciate it, I get to keep the rest of my hair. * [WPyogi](https://wordpress.org/support/users/wpyogi/) * (@wpyogi) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807605) * LOL – glad to save your hair :)! The #post-24 simply applies that to only a list in that post. If you ever want it someplace else, you’ll need to look up the similar id for the post or whatever containing element. * Thread Starter [brownknee](https://wordpress.org/support/users/brownknee/) * (@brownknee) * [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807731) * Gotcha! That much I can do if I need to do more custom bullets! 🙂 Thanks again WPyogi!! Viewing 13 replies - 1 through 13 (of 13 total) The topic ‘Custom Bullets’ is closed to new replies. ## Tags * [bullets](https://wordpress.org/support/topic-tag/bullets/) * [css](https://wordpress.org/support/topic-tag/css/) * [new](https://wordpress.org/support/topic-tag/new/) * [styling](https://wordpress.org/support/topic-tag/styling/) * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/) * 13 replies * 3 participants * Last reply from: [brownknee](https://wordpress.org/support/users/brownknee/) * Last activity: [13 years ago](https://wordpress.org/support/topic/custom-bullets/#post-3807731) * Status: resolved ## Topics ### Topics with no replies ### Non-support topics ### Resolved topics ### Unresolved topics ### All topics