Strikethrough for text, textarea, richtext fields

[sciascia]

Strikethrough hasn't been possible in most text fields for a while now.

Strikethrough is the most compact way of demonstrating value, making it critical for mobile layouts - especially headlines.

Was $299 now $199

Could someone pass this up the food chain?

And if it's not an oversight, could someone explain the reasoning? We see strikethrough used far more often than italics for example.

Cheers

---

Relevant Shopify theme docs

• https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#text

• https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#textarea

• https://shopify.dev/docs/storefronts/themes/architecture/settings/input-settings#richtext

[karreiro]

👋 Hey @sciascia,

Thank you for reporting this issue.

Could you share a bit more about what you have in mind regarding strikethrough support for text, textarea, and richtext fields?

When I think of strikethrough, I see it as an extra property—similar to color—so it could be represented with an extra setting like this:

...
{
  "type": "checkbox",
  "id": "strikethrough",
  "label": "Show strikethrough",
  "default": false
}
...

Is there something I’m overlooking?

Thanks again for the suggestion!

[sciascia]

@karreiro Yep, that's it.

For single line text fields without buttons, could input settings allow the strikethrough HTML element to be entered into the field?

e.g. Was <s>$199</s> Now $129

Strikethrough is most important in headlines (especially on mobile) but headline fields often have no buttons.

In reality, input settings should allow any text field to accept basic HTML text elements with or without buttons - after all, markup is what HTML is for right?

e.g. <s> <small> <b> <i> <strong> <em>

<small> is another super common element needed for terms and conditions on ecommerce sites.

But hey, one thing at a time - and thanks for looking into this!

[aswamy]

For single line text fields without buttons, could input settings allow the strikethrough HTML element to be entered into the field?

Hey @sciascia, we can already have basic HTML tag support in the html input setting. Here is an example. Could you provide an example where this is falling short?

# section/hello-world.liquid
<p>HTML content: {{ section.settings.html-content }}</p>

{% schema %}
{
  "name": "Hello World",
  "settings": [{
    "id": "html-content",
    "type": "html",
    "label": "HTML content",
    "default": "pure <strong>HTML</strong> content <s>lives here</s>"
  }],
  "presets": [
    {
      "name": "Hello World Template",
      "category": "Demo"
    }
  ]
}
{% endschema %}

[sciascia]

@aswamy Correct but the issue isn't for html fields, it's for text/textarea/richtext fields.

There's no Strikethrough button on any of those fields (even though it would probably get used more often than Italics).

But even when merchants try to manually add <s> tags to these fields, they see this error (as noted above)...

Same with <small> as it's commonly used for terms and conditions text. Currently, merchants have to use html fields which doesn't work for many merchants, particularly smaller companies where it's often the founder making edits.

<strikethrough> and <small> are right up there with bold in terms of merchant text styling, so they should absolutely be available via the UI, but allowed as an HTML tag at the very least.

I know this is more of a platform-level issue, but after nearly a decade of feature requests, it’s still ignored. Worse, many at Shopify seem to think strikethrough in text fields is already possible. A Shopify response to a Horizon review points to a support link—where even the AI clearly says it’s not possible.

If Shopify thinks strikethrough is already possible everywhere, it's no wonder requests go nowhere. Part of this request is to flag the gap and highlight that basic text styling like this isn’t easy for the average merchant. I've found no other way to raise the issue sorry.

[aswamy]

I was able to do it for textarea - you are correct about richtext not supporting strikethrough or small. I can look into why we only support a small amount of text styles.

--

merchants have to use html fields which doesn't work for many merchants, particularly smaller companies where it's often the founder making edits

That's a fair point. I'd love to pick your brain on this. In your example, you'd like to strike through text in the middle of the text like "Was $299 now $199". What would the new input setting/option look like if it was implemented into text or textarea?

Option 1: Strike through first instance of the word

{% schema %}
{
  "settings": [{
    "id": "text-area",
    "type": "textarea",
    "label": "Text Area",
    "default": "Was $299 now $199",
    "strikethrough": "$299" # strikes the first instance of this text
  }],
}
{% endschema %}

Option 2: Strike through by index

{% schema %}
{
  "settings": [{
    "id": "text-area",
    "type": "textarea",
    "label": "Text Area",
    "default": "Was $299 now $199",
    "strikethrough": "1" # strikes the index of this text
  }],
}
{% endschema %}

[sciascia]

@aswamy Thanks for this.

In reality, merchants need zero restrictions (it's the nature of language) so ideally, the setting should work like bold: enabling a button for <strikethrough> and <small> to be used anywhere.

Here's a mockup of how it could work (if button space is limited)...

The fallback would be to allow<s> and <small> html tags anywhere in any text editor - without errors.

I'm fully aware Github issues are for specific dev issues but there's no way to reach Shopify designers. So if the change requires designers, I'm hoping you guys can help them understand how important <strikethrough> and <small> are to merchants – who seem confused.

e.g. search 'shopify how to add strikethrough text'. There are also many more results asking for how to add buttons to text editors.

And while these tags were previously easy to add from the page editor, buttons have been missing from the new in-context editor from the begining. Hope that makes sense?

And thanks for taking the request seriously - it's taken years of requests to get this far! Cheers, Ben

[aswamy]

@sciascia I want to pass this request up the chain so can you validate this summary. I want to keep it concise as possible.

• As of today richtext currently supports basic text stylings (bold, italics, links, bullet list, number list, and heading type)
• It does not support strikethrough or small text
• A theme developer can make the input be html, but merchants editing the text may not know how to use html tags directly
• FEATURE: Expand richtext to support small and strikethrough text as part of it's offering

[sciascia]

@aswamy Perfect - and thank you for this, it's very much appreciated.

Cheers, Ben

[mdamjanic7]

Hey @sciascia 👋
The team that would be responsible for this improvement uses a different set of workflows for tracking feature requests. Since I can't transfer the ticket, I'll be closing it for now; rest assured that I've shared your feedback with them.

In the future I would suggest creating a post in https://community.shopify.dev/ as each request automatically gets sent to the relevant team.