Change Add to Cart button to Preorder for certain products only

[sasiman11]

Hi! 

I've tried using Preorder apps so that I can put specific products on preorder. However, they seem to block me from selling those products on any channels except my site (FB/Instagram, for example). SO, I've decided to just change the button add to cart label for those products to "preorder now" (using a "preorder" tag). I found a help topic here that covers it and it mostly works, but I've got a rogue "add to cart" plain text under the button. I've tried everything and I can't seem to get rid of it without something messing up.

I'm adding pics of my code (plus, paste below), what I'm seeing on the Preorder product page and what I see on a non-preorder product page. 

<button
id="ProductSubmitButton-{{ section_id }}"
type="submit"
name="add"
class="product-form__submit button button--full-width
{% if product.tags contains "preorder" %}
<button type="submit" class="product-form__add-button button button--primary" data-action="add-to-cart">Preorder</button>{% else %}
<button type="submit" class="product-form__add-button button button--primary" {{ 'products.product.add_to_cart' | t }}</button>
{% endif %}

[Tal19]

You just missed > on the add to cart button, here is the the code:

<button type="submit" class="product-form__add-button button button--primary">
  {{ 'products.product.add_to_cart' | t }}
</button>

[sasiman11]

I just tried that and it doesn't fix it on the Preorder button. It also adds the rogue "add to cart" text into the non-preorder product. 

[Tal19]

you are trying to add button inside button. here is the corrected code:

<button
  id="ProductSubmitButton-{{ section_id }}"
  type="submit"
  name="add"
  class="product-form__submit button button--full-width product-form__add-button button button--primary"
  data-action="add-to-cart">
  {% if product.tags contains "preorder" %}
    Preorder
  {% else %}
    {{ 'products.product.add_to_cart' | t }}
  {% endif %}
</button>

[sasiman11]

Thank you! Unfortunately, that still didn't work 😞 I don't know what's going on.

Here's the code BEFORE where I'm inserting this. I notice there is an error popping up, BUT it does look perfectly fine on my site regardless: 

When I add the code you sent in your last reply, the rogue "add to cart" is there on BOTH versions (preorder and non-preorder products). It's so strange... 

[Tal19]

make sure that the tag 'preorder' is the exact tag in those products, it's case sensitive. 

[sasiman11]

Thanks! The Preorder works on the button, surprisingly. It's the "add to cart" plain text that appears under it that is the problem.

[Tal19]

please mark my answer as a solution 🙂