bullet points not showing for trusted tabs product description

Store Design
, ,

Topic summary

A user is experiencing an issue where bullet points in product descriptions aren’t displaying on their live site, despite being formatted correctly in Shopify’s editor. The descriptions are managed through the Trusted Tabs app.

The Problem:

  • Bullet points appear correctly in Shopify’s backend editor
  • On the live product page, they render as plain text without bullets
  • Affects product description tabs across the site

Proposed Solutions:

Three different approaches were suggested:

  1. Two similar solutions recommend adding custom CSS via theme.liquid file (above the </body> tag), though the specific code wasn’t fully visible in the conversation

  2. Targeted CSS fix suggests modifying the assets/tabs.css file by adding:

    .tiny-tabs-content ul {
  list-style: disc;
  padding-left: 20px;
}

    This targets the tab content specifically to restore bullet point styling.

Status: The discussion remains open with no confirmed resolution yet. The issue appears to be a CSS styling conflict with the Trusted Tabs app.

Summarized with AI on November 1. AI used: claude-sonnet-4-5-20250929.
1

Hello.

I am using the app Trusted Tabs for my tabs across my product pages, which display the description for each product.

I want the descriptions to show the bullet points that I added when I was editing my product in shopify.

In shopify description editor, it looks like this:

  • Hypoallergenic & Durable: Made from 316L stainless steel, a medical-grade material safe for sensitive skin and resistant to tarnishing.
  • Luxurious 18K Gold Plating: Provides a rich golden hue that enhances its timeless appeal.
  • Versatile Design: Perfect for daily wear, special occasions, or as a thoughtful gift.
  • Length: Adjustable from 40cm to 45cm, ensuring the perfect fit.
  • Material: Crafted with 316L stainless steel, plated in 18K gold, and accented with beads.

But when I go to the actually website, it doesnt appear as bullet points:

Screenshot 2025-01-29 193522.png
Screenshot 2025-01-29 193522.png630×771 36.4 KB

That specific link to the product page is here

Help would be appreciated, thanks.

1 Like
2

Hey @bariqah1423

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1738133107348.png
Moeed_0-1738133107348.png432×531 13.3 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like
3

@bariqah1423

  1. Go to Online Store

  2. Edit Code

  3. Find layout/theme.liquid file

  4. Add the following code in the bottom of the file above tag

Thanks!

1 Like
4

Hello,

To resolve this issue, you’ll need to modify the CSS for the tabs. Follow these steps:

  1. Navigate to Online Store → Themes → Edit Code.
  2. Locate the assets/tabs.css file.
  3. Find the following code:
.tiny-tabs-content {
  overflow: hidden;
  overflow-x: auto;
}
  1. Add this additional rule right after it:
.tiny-tabs-content ul {
  list-style: disc;
  padding-left: 20px;
}

This should fix the problem.

1 Like