How To Change Bullet Points in Blog Posts to An Image

  • Unknown's avatar
    phoebekristina · Member ·

    Hi there,

    I am hoping to change the bullet points in my blog posts to an image. I have added the following code to the Additional CSS but it didn’t work:

    [code lang=css]
    ul li {
    list-style-type: none;
    background-image: url('https://info51e99586141.files.wordpress.com/2023/12/checkmark.png');
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 20px;
    }

    I would greatly appreciate any suggestions.Thanks so much for your help in advance!

    WP.com: Yes
    Jetpack: No
    Correct account: Yes

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    parkdanil · Member ·

    I’m not familiar with CSS, but you can do something similar with the Block Editor.

    You can replicate the function of bullet points by using Row and Column Blocks.

    For the bullet point, you can add an Image Block to the first column, the second column could contain a Paragraph Block.

    Here is an example:

  • supernovia · Staff ·

    @phoebekristina can you try taking out the line that says code lang? Then we’ll take a look?

    Also, are you wanting to replace these for every single list or just one of them?

    Also, thanks @parkdanil!

  • The topic ‘How To Change Bullet Points in Blog Posts to An Image’ is closed to new replies.