Home › Forums › WoodMart support forum › How to change the bullet style in product description

How to change the bullet style in product description

Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • April 15, 2020 at 9:43 pm #187299

    tpetauer
    Participant

    Hi
    in product description section Iam using bulleted list
    I would like to change bullet style to bullet and color to hex number
    I have but cant change the color of bullet only!

    .wpb_wrapper ul li:before {
    display: none;
    }

    .wpb_wrapper ul li {
    list-style: disc!important;
    }

    April 16, 2020 at 7:33 am #187384

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    First of all thanks for choosing our Theme, we are glad to be you in the WoodMart WordPress family :-).

    Please provide with the URL of the where you added the list to check it myself and help you out accordingly.

    Best Regards.

    April 16, 2020 at 7:56 am #187394

    tpetauer
    Participant

    Linkof the site

    April 16, 2020 at 8:17 am #187399

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I have visited the URL you attached. To change the color please use the following Custom CSS code.

    .wpb_wrapper ul li::marker {
color: red;
}

    You can set the color according to your needs.

    Best Regards.

    April 16, 2020 at 8:41 am #187405

    tpetauer
    Participant

    Hi

    that is my css in style.css child theme

    .wpb_wrapper ul li:before {
    display: none;
    }
    .wpb_wrapper ul li::marker {
    color: red;
    }
    .wpb_wrapper ul li {
    list-style: disc!important;
    }

    I cleared browsing data and no change … still black.
    I want to make bulletrs also bigger.

    April 16, 2020 at 9:06 am #187427

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Please provide admin panel login details of the website to check it myself and help you out accordingly.

    Best Regards.

    April 16, 2020 at 9:19 am #187432

    tpetauer
    Participant

    As requested

    April 16, 2020 at 10:38 am #187453

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I have tried to login to your website and was unable to login the URL doesn’t seem to be working even if I used a proxy. Please provide a non restricted URL to let me assist you further.

    Screenshot for Clarification: https://ibb.co/BnmFHwV

    Best Regards.

    April 16, 2020 at 11:02 am #187463

    tpetauer
    Participant

    you can try now … access alowed

    April 16, 2020 at 12:00 pm #187493

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I have assigned a class to the

      and add the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

      .color li::marker {
color: red;
font-size: 20px;
}

      Screenshot for Clarification: https://ibb.co/47QNDYL

      You can change the color and font size according to your needs.

      Best Regards.

    April 16, 2020 at 1:05 pm #187519

    tpetauer
    Participant

    Hi

    THX, but …
    on PC, Windows 10 … firefox OK, Chrome – stil black bullets even after clear all data all time
    on IOS … OK

    PS
    I moved CSS to Childe theme

    April 17, 2020 at 6:32 am #187679

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    You are Most Welcome.

    You don’t need to move the CSS to the style.css file you can use the variety of theme options available to use Custom CSS under Theme Settings >> Custom CSS.

    Please move the CSS to the Global Custom CSS area under Theme Settings >> Custom CSS. Clear cache and check back.

    Best Regards.

    April 17, 2020 at 9:39 am #187746

    tpetauer
    Participant

    I did as requested

    Css moved back to global CSS, deleted in Style css
    Cleared Cash
    Still black

    Attachments:
    You must be logged in to view attached files.
    April 17, 2020 at 10:07 am #187753

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    By default it is not possible to change the color of the list items because the items use different element sets for different browsers.

    That’s why it’s not affecting chrome.

    However, you can do some CSS tricks to make it possible of your own.

    By following this article: https://www.w3schools.com/howto/howto_css_bullet_color.asp

    Best Regards.

    April 17, 2020 at 10:59 am #187772

    tpetauer
    Participant

    I have tried that … again nowwith this css

    .wpb_wrapper ul li:before {
    display: none;
    }

    .wpb_wrapper ul li::before {
    content: “\2022” !imporatnt; /* Add content: \2022 is the CSS Code/unicode for a bullet */
    color: #F5D300; /* Change the color */
    font-weight: bold; /* If you want it to be bold */
    display: inline-block; /* Needed to add space between the bullet and the text */
    width: 1em; /* Also needed for space (tweak if needed) */
    margin-left: 0em; /* Also needed for space (tweak if needed) */
    }

    I can’t get rid of > (whatever Unicode I type)
    https://firstcornershop.com/product/katadyn-gravity-befree-water-filter-3-0-l/

    April 17, 2020 at 12:20 pm #187823

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I have visited the link you provided in chrome and the bullets are already changed to dots. Please clear cache and check back.

    Screenshot for Clarification: https://ibb.co/9c4PwwQ

    Best Regards.

    April 17, 2020 at 12:36 pm #187845

    tpetauer
    Participant

    hi

    yes, I am working on it.
    If I set Unicode to dots F2022 i cant’t set size!
    Also w3shools link what you provided is not working properly.

    Again:
    I need a BULLET -not a dot
    I have to change color

    I am trying few options now … and sorry -non of your suggestion is solving the problem as requested

    April 17, 2020 at 1:00 pm #187861

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    You can use any of those icons from the following links provided and can search from google if you want anything else.

    https://fontawesome.com/icons/dot-circle?style=regular
    https://fontawesome.com/icons/dot-circle?style=solid
    https://fontawesome.com/icons/circle?style=solid
    https://fontawesome.com/icons/circle?style=regular
    https://fontawesome.com/icons/stop-circle?style=solid
    https://fontawesome.com/icons/stop-circle?style=regular

    Best Regards.

    April 17, 2020 at 1:27 pm #187875

    tpetauer
    Participant

    Lets close this topic …
    FontAwsome F111 is not a solid circle – and i asked for solid circle …
    Unicode dot – cant resize …

    have a nice day

    April 18, 2020 at 5:32 am #188003

    Aizaz Imtiaz Awan
    Keymaster

    Most Welcome!!!..

    Well, @tpetauer!.., it’s been great chatting with you! I hope I resolved your issues thoroughly.

    Let us know if there’s anything else we can do for you! You can always reach us at any time. We are always here to help you.

    Have a wonderful day.

    Topic Closed.
    Best Regards.

  • Author
    Posts

Tagged: 

Viewing 20 posts - 1 through 20 (of 20 total)

The topic ‘How to change the bullet style in product description’ is closed to new replies.