Product Title Hard Break into two or three lines - Dawn Theme

Store Design

Topic summary

An online shop (Shimlee) that prints custom photos and designs on wood is seeking to add manual line breaks in their product titles on the Dawn theme.

Current Issue:

  • They want to split long product titles (e.g., “Panorama Wood Photo Print (16:9 Ratio)”) into 2-3 lines at specific points across all screen sizes
  • Cannot locate the “card_product.title” liquid code file that other threads reference for similar modifications

Proposed Solution:
A community member (BSSCommerce-HDL) suggested modifying CSS files (base.css, theme.css, styles.css, or theme.scss.liquid) to adjust font size, but this doesn’t address the core need.

Clarification:
The shop owner clarified they don’t want to change font size—they specifically want control over where to insert <br> tags (HTML line breaks) within the title text.

Status: Unresolved. The discussion needs guidance on how to add manual line breaks in product titles within the Dawn theme’s liquid template files.

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

Hello,

Shimlee is an online based shop taking customers photos and designs and printed them on wood. All of our products have multiple options for the customer to choose from and design for their home.

We are trying to split apart our Product Title within our Shopify Website - Dawn theme.

We have looked at our liquid code and cannot find “card_product.title” to change some of the settings like other threads have suggested. So we are in need of assistance.

Screenshot of where we would like to add another hard break across all screen sizes:

shimlee_0-1719327001563.png
shimlee_0-1719327001563.png829×602 208 KB

Website: Panorama Wood Photo Print (16:9 Ratio) – Shimlee (shopifypreview.com)

Live View Passcode: Khome200

2

Hi @shimlee ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

BSSCommerceHDL_1-1719327484347.png
BSSCommerceHDL_1-1719327484347.png1916×934 101 KB

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

BSSCommerceHDL_0-1719327476573.png
BSSCommerceHDL_0-1719327476573.png1916×934 101 KB

Step 3: Insert the below code at the bottom of the file → Save

.product__info-container .product__title h1 {
    font-size: 20px !important;
}

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you :heart_eyes:

3

We are not looking to change the size of the product title. We want to control where we can put a
into the title.