FROM CACHE - en_header

Allowing <br> line breaks in custom text field

piccolo21
Tourist
10 0 1

In the Customize dashboard for my site, I would like to have the <br> tag to behave like a proper line break.

Instead it shows the tag literally like this:

Screen Shot 2021-03-09 at 9.49.25 AM.png

Is it a matter of changing the input type within the respective .liquid file?

Right now I'm seeing it's this under {% schema %}:

      {
        "type": "text",
        "id": "heading",
        "label": "Heading",
        "default": "Image with text overlay"
      },
      {
        "type": "text",
        "id": "subheading",
        "label": "Subheading",
        "default": "Tell your story with images"
      },

 

Replies 9 (9)
piccolo21
Tourist
10 0 1

Appreciate any help!!!

KikeMelero
Tourist
4 1 1

U can use the HTML setting type to include html tags that needs to be rendered.

More info on https://shopify.dev/docs/themes/settings#html

Even the RichText setting type would work for you if only a br tag is needed.

piccolo21
Tourist
10 0 1

Thank you for replying! 

So I'm looking through documentation now, wondering if I'm missing a piece of the puzzle.

Updated the heading type but it still doesn't seem to work. 😞

Any ideas?

 

      {
        "type": "html",
        "id": "heading",
        "label": "Heading",
        "default": "Image with text overlay"
      },

 

  

piccolo21
Tourist
10 0 1

Why would changing the field to "type": "html" not work? 

So puzzling...

piccolo21
Tourist
10 0 1

Thanks for the reference but the solution in the example did not work.

My store - viewable on mobile: http://fibonacho.co

LitExtension
Shopify Partner
4649 949 975

Hi @piccolo21

This is my recommendation for your issue. Please change type to "textarea": 

{

        "type": "textarea",

        "id": "heading",

        "label": "Heading",

        "default": "Image with text overlay"

}

Please take a look at our screenshot here: 

https://prnt.sc/10kfrnf

https://prnt.sc/10kfs9x

Hope this helps! 

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
muhraff
New Member
1 0 1

Hi mate.

Thanks for asking.

Instead of using type `text`  we can use type `textarea` in your liquid file add a string filter called `newline_to_br`.

Example 

// .liquid

{{ section.settings.heading | newline_to_br }}

{
  "type": "textarea",
  "id": "heading",
  "label": "Heading",
  "default": "Image with text overlay"
}

 

Hope its helps 🙂

PaulNewton
Shopify Partner
4765 390 1020

@piccolo21 wrote:

Why would changing the field to "type": "html" not work? 

So puzzling...


It should just work https://shopify.dev/themes/architecture/settings/input-settings#html as long as

  • Your working in the same theme as the code you edited
  • you've edited the correct section and it's setting (temporarily edit the heading and label text to be sure)
    • checked the block logic used in that section; something may be checking for something like the following shape ,loosely, {% if block.type == text %}
  • There's no cache issues, (wait a bit and try again)

 

If those troubleshootings don't surface the true issue , then DM me your store info, and a link to theme setting and I'll send a request to see.

Finally Combinable Discounts - EARLY ACCESS ONLY - Use Free Shipping With Other Discounts

Answers powered by coffee Buy Paul a Coffee for more answers or donate to eff.org
Problem Solved? ✔Accept and Like solutions to help future merchants
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
bismuth_studio
Shopify Expert
4 0 7

This is amazing thank you