Remove the escape from the product title that appears on the payment page - Dawn Theme

[gseanmaddox]

I have a Shopify site for a candle business. I am using a page break in my product titles in order to include the candle name and scent notes on different lines. I've had to go through and remove the escape from all the code where the product title appears. I can't seem to find the code that has the product title on the payment page. See screen shot attached so you can see where I'm talking about.

Any ideas how I can turn the <br> into an actual page break in this spot? 

[OwenLove]

Hi, @gseanmaddox 

Just to clarify — are you using Shopify Plus? That’s the only plan where you can directly customize the checkout page layout (including how product titles render). If not, Shopify will automatically escape HTML like <br> in the checkout, so unfortunately you can’t force a line break there. 

Best,

Owen

[CodingFifty]

Hey! @gseanmaddox,

On Shopify’s checkout and payment pages, the {{ product.title }} output is automatically escaped for security reasons, so custom HTML like <br> tags won’t render and will just show as text. Shopify doesn’t allow editing the checkout’s core Liquid code unless you’re on Shopify Plus, which gives access to checkout.liquid. If you’re not on Plus, a workaround is to use metafields or custom properties instead of putting <br> in the product title, or handle the split with CSS or JavaScript where possible, but for the native checkout, it’s very limited.

[lixonic]

How about using `/` or `-` instead of `<br>` 

and use conditional formatting {{ product.title | replace: '<br>', ' / ' }} or {{ product.title | replace: '<br>', ' - ' }} 

This way on checkout page the title becomes : Summer - Notes of Grape...  or Summer / Notes of Grape...

[gseanmaddox]

I actually did something like that at first, but the line break looks much better on every page except the checkout page. Is there conditional formatting that would trigger only on the checkout page?