Insert Line Break in Heading

[JC113]

Hi there!

I'm using Symmetry and on our "About" page (https://casa-amao.com/pages/about), I want to force a line break in the heading of one of the custom content sections to have it look like: 

Nachhaltigkeit und Qualität

Ästhetik und Funktion

Since the <br> does not work in the heading field, does anyone have a suggestion how to solve this?

Thanks in advance!

[PageFly-Amelia · Accepted solution]

Hello @JC113 

This is Amelia at PageFly - Shopify Advanced Page Builder app.

You can try the following steps I have provided to help you solve the problem you are facing:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file theme.liquid

Step 3: Add code above the tag </head>

<script>
window.addEventListener('load', () => {
   let el = document.querySelector('#block-id-text_WfzxJ3 .majortitle');
   el.innerHTML = el.innerText.split(', ')[0] + '</br>' + el.innerText.split(', ')[1]
})
</script>

Hoping my solution helps you solve your problem.

Best regards,

Amelia | PageFly

[JC113]

Thanks Amelia! It worked 👍

[PageFly-Amelia]

You're welcome

[theholdingsco]

I want to do the same for two sections in this Honey theme at lunartape.com. I don't know why it's giving me issues now.

HYPOALLERGENIC.
SKIN-SAFE.
RESIDUE-FREE.

and then this section too:

Facial hair? Sensitive skin?
We've got you covered.

I really appreciate your help with this.

[braelyn]

Hi there! I tried this solution, and it originally worked. But now it's not working, and saying <br> is invalid again. Do you have any idea why this might be happenign?