Change text on button "Buy it now"

Hi Experts,

I want to change this text without changing the button style, color or the animation.

Please anyone, Where is the file/folder located so I just simply can change the text?

Thank you :heart:

Hey @Hugobrunto ,

To change the text for the “Buy it now” button without altering its style, color, or animation, you’ll need to locate the file that contains this button’s text. In most Shopify themes, this button text can be found in one of the following places:

Theme Language Settings:

-Online Store > Theme > Edit languages

-In the language Editor, search for “Buy it now” in the fields. Many themes have the button text configurable directly here.

Product Template Files:

If you don’t find it in the language settings, go to Online Store > Theme > Edit Code \

Look for the product page template, which might be located in Sections (e.g., product-template.liquid) or Templates (e.g., product.liquid).

Search within these files for Buy it now. You may find it hardcoded here, or it may reference a translation variable that you can modify in the language settings.

JavaScript or Snippets:

Sometimes, the “Buy it now” text is added through a JavaScript file or a snippet.

Check the Snippets folder for files that may contain button customization, such as product-form.liquid or buy-it-now.liquid.

Let me know if you need further guidance on locating or editing the file.

If I was able to help you, please don’t forget to Like and mark it as the Solution!
Best Regard,
Rajat Sharma

Hello @Hugobrunto
Go to online store ----> themes ----> actions ----> edit code ---->base.css
add this code at the end of the file and save.

button.shopify-payment-button__button--unbranded {
font-size: 0rem;
}

.shopify-payment-button__button--unbranded::before {
content: "Your Text Here"; /*add the text here*/
font-size: 1.6rem;
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

1 Like

Hi Rajweb,

Thank you very much for good instructions. I tried all your solutions but I couldn’t locate it anywhere. I do have a snippet folder named “Buy-buttons.liquid” but I couldn’t find the text in there, “Buy It Now” as the button is showing..

Is is possible that this text still is there but not shown? How could I change it then? :confused:

Here is the full code in that folder.

{% comment %}
Renders product buy-buttons.
Accepts:

  • product: {Object} product object.
  • block: {Object} passing the block information.
  • product_form_id: {String} product form id.
  • section_id: {String} id of section to which this snippet belongs.
  • show_pickup_availability: {Boolean} for the pickup availability. If true the pickup availability is rendered, false - not rendered (optional).

Usage:
{% render ‘buy-buttons’, block: block, product: product, product_form_id: product_form_id, section_id: section.id, show_pickup_availability: true %}
{% endcomment %}

{%- if product != blank -%} {%- liquid assign gift_card_recipient_feature_active = false if block.settings.show_gift_card_recipient and product.gift_card? assign gift_card_recipient_feature_active = true endif

assign show_dynamic_checkout = false
if block.settings.show_dynamic_checkout and gift_card_recipient_feature_active == false
assign show_dynamic_checkout = true
endif
-%}

<product-form
class=“product-form”
data-hide-errors=“{{ gift_card_recipient_feature_active }}”
data-section-id=“{{ section.id }}”

{%- form ‘product’,
product,
id: product_form_id,
class: ‘form’,
novalidate: ‘novalidate’,
data-type: ‘add-to-cart-form’
-%}
<input
type=“hidden”
name=“id”
value=“{{ product.selected_or_first_available_variant.id }}”
{% if product.selected_or_first_available_variant.available == false or quantity_rule_soldout %}
disabled
{% endif %}
class=“product-variant-id”

{%- if gift_card_recipient_feature_active -%}
{%- render ‘gift-card-recipient-form’, product: product, form: form, section: section -%}
{%- endif -%}

{%- liquid assign check_against_inventory = true if product.selected_or_first_available_variant.inventory_management != 'shopify' or product.selected_or_first_available_variant.inventory_policy == 'continue' assign check_against_inventory = false endif if product.selected_or_first_available_variant.quantity_rule.min > product.selected_or_first_available_variant.inventory_quantity and check_against_inventory assign quantity_rule_soldout = true endif -%} {%- if product.selected_or_first_available_variant.available == false or quantity_rule_soldout -%} {{ 'products.product.sold_out' | t }} {%- else -%} {% if template == "product.special-order" %} Beställ {% else %} {{ 'products.product.add_to_cart' | t }} {% endif %} {%- endif -%}
{%- if show_dynamic_checkout -%} {{ form | payment_button }} {%- endif -%}
{%- endform -%} {%- else -%}
{{ 'products.product.sold_out' | t }}
{%- endif -%}

{%- if show_pickup_availability -%}
{{ ‘component-pickup-availability.css’ | asset_url | stylesheet_tag }}

{%- assign pick_up_availabilities = product.selected_or_first_available_variant.store_availabilities
| where: ‘pick_up_enabled’, true
-%}

<pickup-availability
class=“product__pickup-availabilities no-js-hidden quick-add-hidden”
{% if product.selected_or_first_available_variant.available and pick_up_availabilities.size > 0 %}
available
{% endif %}
data-root-url=“{{ routes.root_url }}”
data-variant-id=“{{ product.selected_or_first_available_variant.id }}”
data-has-only-default-variant=“{{ product.has_only_default_variant }}”
data-product-page-color-scheme=“gradient color-{{ section.settings.color_scheme }}”

{% render 'icon-unavailable' %}

{{ 'products.product.pickup_availability.unavailable' | t }}

{{ 'products.product.pickup_availability.refresh' | t }}

{%- endif -%}

Works incredible well, thanks :heart:

Happy to help you…!!!

1 Like