Why my bullets point in my product page is different ?

Topic summary

A Shopify store owner reports that bullet points in their product page description appear differently in the editor versus the live storefront. Screenshots show the formatting discrepancy between the admin interface and the actual product page.

Proposed Solutions:
Multiple community members offered CSS fixes to resolve the bullet point styling issue:

  • Solution 1: Add CSS to the product template’s custom CSS section targeting .rte ul and .rte ol with list-style-position: inherit

  • Solution 2: Insert CSS code in the theme.liquid file before the </head> tag (specific code not fully visible in input)

  • Solution 3: Use Theme settings > Custom CSS to set list-style-position: outside and add padding to .rich-text__text elements

  • Solution 4: Apply list-style: initial to .rte li elements via Custom CSS in theme settings

All solutions involve adding custom CSS code through different theme customization methods. The issue remains unresolved as the original poster has not confirmed which solution worked.

Summarized with AI on October 26. AI used: claude-sonnet-4-5-20250929.

When I edit my product page in shopify it looks like this, but then it’s completely different in my store.

Can you help me?

this is my link: https://www.herbalprodukty.com/products/herbalife-formula-1-shake-neue-generation-vegan-glutenfrei

Hey @gabridb

Pls follow below steps to fix your issue

  1. Open your theme editor – select product template – select product description section

  2. At the right bottom of the page, you can find a custom css tab, put below code in the input box

.rte ul, .rte ol {
  list-style-position: inherit
}
  1. Save theme and preview. then your issue should be fixed.

Hope this helps

1 Like

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code before the tag


Result:

Hope this helps! If yes then Please don’t forget hit Like and Mark it as solution!
If you will unable to implement the same then I’m happy to do this for you, let me know.

1 Like

Hi @gabridb ,

Please go to Customize > Theme settings > Custom CSS and add code:

.rich-text__text.rte ul, 
.rich-text__text.rte ol {
    list-style-position: outside;
    padding-inline-start: 40px;
}

Please add this code below to Custom CSS in Sales channels > Online Store > Themes > Customize > Theme settings

html .rte li {
    list-style: initial;
}