How can I change the bullet point icon on my theme's collection page?

Store Design
1

Hi,
Hoping someone can give me so assistance with changing the bullet point

  • icon on my theme.

    Currently, product pages show any bullet points as a green tick: https://infinitihome.co.uk/products/reclaimed-coffee-table-coastal-chic

    However, collection page descriptions show as normal bullet points: https://infinitihome.co.uk/collections/walnut-furniture

    Is there anyone who can help me change collection page bullet points to the green tick? Or maybe some assistance in working it out?

    Im struggling to get a response from the theme dev so any help is really appreciated.

    Thanks!

    • 2

    hi,

    @AdamStokes2021

    bad to see that you are facing this but let me help you out can you tell me about the theme you are using and also if you want green tics on the collection page too simply DM me!

    3

    Hi,

    @Ecommpremium how do I direct message you?

    The theme is Rubix Multipurpose (Organix), I need to add green ticks to the collection pages! Any idea?

    Thank you

    4

    yes you can direct message! if you feel comfortable!

    5

    No thanks, I prefer to keep the discussion public.

    If you can help, please let me know.

    6

    @AdamStokes2021 please have a look in the product page template and share the code of product-template.liquid and collection-template.liquid so I can help you out

    7

    Thank you so much,

    I have attached the code for both product and collection page.

    I’ve also attached a screenshot so you can see there are a number of product/collection files. The attached are:

    vela-template-product.liquid

    vela-template-collection.liquid

    Screen Shot 2021-10-16 at 22.11.47.jpg
    Screen Shot 2021-10-16 at 22.11.47.jpg228×488 25.7 KB

    Hope you can help!

    Thank you

    8

    This is the product detail code.

    9

    .proDescription {
    padding: 20px 0 0;
    line-height: 24px;
    h5 {
    margin: 10px 0 5px;
    padding: 10px 0;
    font-size: $vela-font-size + 1;
    }
    ul {
    margin: 0;
    padding: 0;
    list-style: none;
    li {
    position: relative;
    padding-left: 18px;
    font-size: $vela-font-size;
    line-height: 24px;
    &:before {
    content: ‘\f00c’;
    position: absolute;
    top: 0;
    left: 0;
    color: $vela-color-primary;
    font-family: $vela-font-icon;
    font-size: $vela-font-size - 4;
    }
    }

    Just found this code, could this be the bulletpoint tick?

    10

    @AdamStokes2021 nice to see you figured it out yourself!