How do I bold only certain parts of description for my shopify website?

Shopify Discussion
, , , ,
1

In a featured collection I have added a description where I am wanted to bold and italicize certain part of the text. but as it is, it only allows me to bold the entire text for example. how can i select only parts of the text and bold only those parts?

2

just write this css code and your issue will be resolved
theme.css or base.css in theme code editor

.featured-collection .collection__description {
font-weight: bold;
}

3

Hi @patchpointfriends

Welcome to the Shopify Community! Please share your store URL and password (if it’s password-protected), so I can check and provide you with the exact solution.

Best regards,
Devcoder :laptop:

5

Hi @patchpointfriends . How are ding today>

Your theme likely uses the plain text field instead of a rich text editor.

Quick fix: You can use HTML directly in the description field.

If that does not work, then a dev can swap the field to the rich text meta fields in your text code.

6

Hi @patchpointfriends, this is Linette from SearchPie: SEO, Speed & Schema

You can fix this easily by adding a small piece of custom CSS, no need to change your core theme files:

  1. Wrap your specific words: In the text box where you type your description, wrap the words you want to bold in tags. For example:
    This is my description and I want these specific words to be bold.

  2. Go to Theme Customizer: From your Shopify admin, go to Online Store > Themes, and click Customize on your current theme.

  3. Find the Custom CSS: Click on the specific Featured Collection section in your left-hand menu. Scroll down to the very bottom of its settings on the right-hand panel until you see the Custom CSS box.

  4. Add the CSS snippet: Paste the following code into that box:

    .collection__description b, .collection__description strong {
  font-weight: bold !important;
}

(Note: Depending on your exact theme, the class might be slightly different, such as .rte b or .rich-text__text b)

This tells the browser to recognize your tags within that specific description block and apply the bold styling only to those words!
7

Hi @patchpointfriends ,

  1. Add the formatting directly in the collection description within Products → Collections (if your theme is pulling the collection’s description).
  2. Modify the theme code to use a rich text setting instead of a plain text setting.
  3. Use HTML tags such as <strong> and <em> if the field supports HTML output.
8

Hello there @patchpointfriends
For the majority of themes, the description supports HTML. You can wrap individual words with strong and em (for bold and italic respectively) inline within your text. If your editor only lets you apply formatting to the entire block, then you know the field is plain text. In that case, transfer the content to a rich text field or create a rich text metafield and map it in the theme settings. Another option is to break the content into several text blocks, so you can apply different styles to each part.