Hello!
Shop Pay logo isn’t visible on product page. How I can turn on it? And also I need to change Shop Pay logo colour on cart page.
Hi @MikeSatori Plz, share your store URL.
Hi, @MikeSatori .
Welcome to the Shopify Community and thanks for sharing your question here.
In order to add the Shop Pay dynamic checkout button on your product pages, you’ll need to follow the steps shared below.
Add or remove dynamic checkout buttons on product pages
- Within your Shopify admin, go to Online Store > Themes.
- Next to the theme that you want to edit, click Customize.
- Open the drop-down menu at the top of the page.
- Select Product pages.
- Click the Product pages section.
- Check or uncheck Show dynamic checkout button.
- Click Save.
If you don’t see the Show dynamic checkout button setting, then you need to update your theme or edit your theme code.
Within our Adding and removing dynamic checkout buttons resource, we also have steps if you wish to include the Shop Pay checkout button on selected products.
In regards to changing the Shop Pay checkout button, you’ll want to ensure you’re following the trademark usage guidelines. You can explore and download the monotone Shop Pay payment options that best align with your brand’s needs.
I’d love to hear more about your online business! What kind of products do you offer and how are you marketing your business online?
Looking forward to hearing back!
Hello, @Victoria_13 .
My question isn’t about dynamic button, need help with shop pay instalments banner.
Hi @Davisoncode , why you can’t share it here?
Hello, @Ahsan_ANC
hi @MikeSatori
How do you add the SVG to the template?
The SVG is there and its fill color is set to white.
If you are able to edit the fill color plz change the following code.
Current
after code edit
@Ahsan_ANC just add shop pay banner via instructions from shopify help center:
Didn’t add svg and changed color.
plz send that page link
also share the main product template liquid file code.
https://help.shopify.com/en/manual/payments/shop-pay-installments/product-banner
Show More
{%- assign my_product = product -%}
{%- assign current_variant = product.selected_or_first_available_variant -%}
{%- assign product_image_zoom_size = ‘1024x1024’ -%}
{%- assign product_image_scale = ‘2’ -%}
{%- assign disable_image_zoom = section.settings.disable_image_zoom -%}
{%- assign compare_at_price = current_variant.compare_at_price -%}
{%- assign price = current_variant.price -%}
{% case section.settings.media_size %}
{% when ‘small’ %}
{%- assign product_media_width = ‘col-md-4’ -%}
{%- assign product_description_width = ‘col-md-8’ -%}
{%- assign height = 345 -%}
{% when ‘medium’ %}
{%- assign product_media_width = ‘col-md-7’ -%}
{%- assign product_description_width = ‘col-md-5’ -%}
{%- assign height = 530 -%}
{% when ‘large’ %}
{%- assign product_media_width = ‘col-md-8’ -%}
{%- assign product_description_width = ‘col-md-4’ -%}
{%- assign height = 720 -%}
{% when ‘full’ %}
{%- assign product_media_width = ‘12’ -%}
{%- assign product_description_width = ‘12’ -%}
{%- assign height = 1090 -%}
{%- assign enable_image_zoom = false -%}
{% endcase %}
{%- include “breadcrumb” -%}
{% include “product-single-images” %}
{%- for block in section.blocks -%}
{%- case block.type -%}
{%- when ‘@app’ -%}
{% render block %}
{%- when ‘text’ -%}
{{ block.settings.text }}
{%- when ‘vendor’ -%}
{%- include ‘product-single’, function: ‘vendor’ -%}
{%- when ‘product_title’ -%}
{%- include ‘product-single’, function: ‘title’ -%}
{%- when ‘product_description’ -%}
{{ product.description }}
{%- when ‘review’ -%}
{%- include ‘product-single’, function: ‘review’ -%}
{%- when ‘inventory’ -%}
{%- include ‘product-single’, function: ‘inventory’ -%}
{%- when ‘countdown’ -%}
{%- include ‘product-single’, function: ‘countdown’ -%}
{%- when ‘price’ -%}
{%- include ‘product-single’, function: ‘price’ -%}
{%- when ‘stock_countdown’ -%}
{%- include ‘product-single’, function: ‘stock-countdown’ -%}
{%- when ‘cart_action’ -%}
{% capture “form_classes” -%}
mb-6 product-form-wrapper product-form-{{ section.id }}
{%- if section.settings.enable_payment_button and product.has_only_default_variant %} product-form–payment-button-no-variants {%- endif -%}
{%- if current_variant.available == false %} product-form–variant-sold-out {%- endif -%}
{%- endcapture %}
{% form ‘product’, product, class:form_classes, novalidate: ‘novalidate’, data-product-form: ‘’ %}
{{ form | payment_terms }}
{% unless product.has_only_default_variant %}
{% for option in product.options_with_values %}
{% assign swatch_option = false %}
{%- assign downcased_option = option.name | downcase -%}
{% if downcased_option contains ‘color’ and settings.product_swatch_color %}
{% assign swatch_option = true %}
{% endif %}
{% if downcased_option contains ‘size’ and settings.product_swatch_size %}
{% assign swatch_option = true %}
{% endif %}
{% if swatch_option %}
{% render ‘product-options-swatch’, product: product, option:option, function: “product”, option_drop: option, forloop: forloop, option_index: forloop.index, option_index0: forloop.index0, sign: section.id, section_id: section.id %}
{% else %}
{%- render “product-sizechart” , option:option, _class: “ml-5” -%}
{% endif %}
{% endfor %}
{% endunless %}
{%- capture qty_and_addtocart -%}
{% if block.settings.show_quantity_selector %}
{% endif %}
{% if block.settings.show_quantity_selector %}
{% endif %}
{% if block.settings.enable_payment_button %}
{%- if settings.cart_terms_enable -%}
{%- assign terms_conditions_url = ‘#’ -%}
{%- if settings.cart_terms_page != blank -%}
{%- assign terms_conditions_url = ‘/pages/’ | append: settings.cart_terms_page -%}
{%- endif -%}
{%- endif -%}
{{- form | payment_button -}}
{% endif %}
{%- endcapture -%}
{{- qty_and_addtocart -}}
{{ ‘products.product.quantity_minimum_message’ | t }}
{% endform %}
{%- when ‘utilities’ -%}
{%- include ‘product-single’, function: ‘btn_exts’ -%}
{%- when ‘social_share’ -%}
{%- include ‘social-sharing’, share_title: product.title, share_permalink: product.url, share_image: product.featured_media, class: “d-block social-sharing mb-2” -%}
{%- when ‘shipping_info’ -%}
{%- include ‘product-single’, function: ‘shipping_info’ -%}
{%- endcase -%}
{%- endfor -%}
{%- if section.settings.has_separate -%}
{%- endif -%}
{% unless product == empty %}
{% endunless %}
{% schema %}
{
“name”: “Product - Brief & action”,
“tag”: “section”,
“class”: “container-product pb-4 pb-lg-10”,
“settings”: [
{
“type”: “checkbox”,
“id”: “product_fullwidth”,
“label”: “Full Width”,
“default”: false
},
{
“type”: “checkbox”,
“id”: “has_separate”,
“label”: “Has separator”,
“default”: true
},
{
“type”: “select”,
“id”: “thumbnails_position”,
“label”: “Thumbnails Position”,
“options”: [
{
“value”: “left”,
“label”: “Left”
},
{
“value”: “bottom”,
“label”: “Bottom”
}
],
“default”: “left”
},
{
“type”: “header”,
“content”: “Media”,
“info”: “Learn more about media types”
},
{
“type”: “select”,
“id”: “media_size”,
“label”: “Size”,
“options”: [
{
“value”: “small”,
“label”: “Small”
},
{
“value”: “medium”,
“label”: “Medium”
},
{
“value”: “large”,
“label”: “Large”
},
{
“value”: “full”,
“label”: “Full-width”
}
],
“default”: “medium”
},
{
“type”: “checkbox”,
“id”: “enable_image_zoom”,
“label”: “Enable image zoom”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “enable_video_looping”,
“label”: “Enable video looping”,
“default”: false
}
],
“blocks”: [
{
“type”: “@app”
},
{
“type”: “vendor”,
“name”: “Vendor”,
“limit”: 1,
“settings”: [
{
“type”: “text”,
“id”: “text”,
“default”: “{{ product.vendor }}”,
“label”: “Text”
}
]
},
{
“type”: “product_title”,
“name”: “Title”,
“limit”: 1,
“settings”: [
{
“type”: “text”,
“id”: “text”,
“default”: “{{ product.title }}”,
“label”: “Text”
}
]
},
{
“type”: “product_description”,
“name”: “Description”,
“limit”: 1,
“settings”: [
]
},
{
“type”: “review”,
“name”: “Review”,
“limit”: 1
},
{
“type”: “inventory”,
“name”: “Inventory”,
“limit”: 1,
“settings”: [
{
“type”: “checkbox”,
“id”: “show_sku”,
“label”: “Show SKU”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “show_stock”,
“label”: “Show stock”,
“default”: true
}
]
},
{
“type”: “countdown”,
“name”: “Countdown”,
“limit”: 1
},
{
“type”: “price”,
“name”: “Price”,
“limit”: 1
},
{
“type”: “stock_countdown”,
“name”: “Stock countdown”,
“limit”: 1,
“settings”: [
{
“type”: “header”,
“content”: “Stock countdown”,
“info”: “Display the limited availability of your products. Create scarcity, increase the perceived value of your products. Make customers buy faster.”
},
{
“type”: “checkbox”,
“id”: “show_stock_countdown”,
“label”: “Show stock countdown”,
“default”: false
},
{
“type”: “color”,
“id”: “stock_countdown_highlight_color”,
“label”: “Highlight color”,
“default”: “#d9121f”
},
{
“type”: “checkbox”,
“id”: “show_stock_countdown_fake”,
“label”: “Use simulation mode”,
“info”: “If you want to run this feature in simulation mode, it will be applied on all products.”,
“default”: true
},
{
“type”: “range”,
“id”: “stock_countdown_fake_from”,
“min”: 1,
“max”: 10,
“step”: 1,
“label”: “Random from”,
“default”: 10
},
{
“type”: “range”,
“id”: “stock_countdown_fake_to”,
“min”: 5,
“max”: 100,
“step”: 1,
“label”: “Random to”,
“default”: 40
},
{
“type”: “header”,
“content”: “Total sold”,
“info”: “This tiny feature make fake total sold for your store. It is not real but you can use just for fun ;)”
},
{
“type”: “checkbox”,
“id”: “show_total_sold”,
“label”: “Show total sold”,
“default”: false
},
{
“type”: “range”,
“id”: “total_sold_qty_min”,
“min”: 1,
“max”: 100,
“step”: 1,
“label”: “Min quantity”,
“default”: 5
},
{
“type”: “range”,
“id”: “total_sold_qty_max”,
“min”: 1,
“max”: 100,
“step”: 1,
“label”: “Max quantity”,
“default”: 20
},
{
“type”: “range”,
“id”: “total_sold_time_min”,
“min”: 1,
“max”: 24,
“step”: 1,
“label”: “Min time”,
“default”: 4
},
{
“type”: “range”,
“id”: “total_sold_time_max”,
“min”: 1,
“max”: 24,
“step”: 1,
“label”: “Min time”,
“default”: 24
}
]
},
{
“type”: “text”,
“name”: “Custom text”,
“settings”: [
{
“type”: “text”,
“id”: “text”,
“default”: “Text block”,
“label”: “Text”
}
]
},
{
“type”: “cart_action”,
“name”: “Cart action”,
“limit”: 1,
“settings”: [
{
“type”: “checkbox”,
“id”: “show_quantity_selector”,
“label”: “Show quantity selector”,
“default”: false
},
{
“type”: “checkbox”,
“id”: “enable_payment_button”,
“label”: “Show dynamic checkout button”,
“info”: “Each customer will see their preferred payment method from those available on your store, such as PayPal or Apple Pay. Learn more”,
“default”: true
}
]
},
{
“type”: “utilities”,
“name”: “Utilities”,
“limit”: 1
},
{
“type”: “social_share”,
“name”: “Social sharing”,
“limit”: 1
},
{
“type”: “shipping_info”,
“name”: “Shipping info”,
“limit”: 1,
“settings”: [
{
“type”: “html”,
“id”: “shipping_info”,
“label”: “Shipping content”,
“default”: “Free Shipping on Orders Over $30”
}
]
}
]
}
{% endschema %}
{% assign current_variant = product.selected_or_first_available_variant %}
product page code:
Show More
{%- assign my_product = product -%}
{%- assign current_variant = product.selected_or_first_available_variant -%}
{%- assign product_image_zoom_size = ‘1024x1024’ -%}
{%- assign product_image_scale = ‘2’ -%}
{%- assign disable_image_zoom = section.settings.disable_image_zoom -%}
{%- assign compare_at_price = current_variant.compare_at_price -%}
{%- assign price = current_variant.price -%}
{% case section.settings.media_size %}
{% when ‘small’ %}
{%- assign product_media_width = ‘col-md-4’ -%}
{%- assign product_description_width = ‘col-md-8’ -%}
{%- assign height = 345 -%}
{% when ‘medium’ %}
{%- assign product_media_width = ‘col-md-7’ -%}
{%- assign product_description_width = ‘col-md-5’ -%}
{%- assign height = 530 -%}
{% when ‘large’ %}
{%- assign product_media_width = ‘col-md-8’ -%}
{%- assign product_description_width = ‘col-md-4’ -%}
{%- assign height = 720 -%}
{% when ‘full’ %}
{%- assign product_media_width = ‘12’ -%}
{%- assign product_description_width = ‘12’ -%}
{%- assign height = 1090 -%}
{%- assign enable_image_zoom = false -%}
{% endcase %}
{%- include “breadcrumb” -%}
{% include “product-single-images” %}
{%- for block in section.blocks -%}
{%- case block.type -%}
{%- when ‘@app’ -%}
{% render block %}
{%- when ‘text’ -%}
{{ block.settings.text }}
{%- when ‘vendor’ -%}
{%- include ‘product-single’, function: ‘vendor’ -%}
{%- when ‘product_title’ -%}
{%- include ‘product-single’, function: ‘title’ -%}
{%- when ‘product_description’ -%}
{{ product.description }}
{%- when ‘review’ -%}
{%- include ‘product-single’, function: ‘review’ -%}
{%- when ‘inventory’ -%}
{%- include ‘product-single’, function: ‘inventory’ -%}
{%- when ‘countdown’ -%}
{%- include ‘product-single’, function: ‘countdown’ -%}
{%- when ‘price’ -%}
{%- include ‘product-single’, function: ‘price’ -%}
{%- when ‘stock_countdown’ -%}
{%- include ‘product-single’, function: ‘stock-countdown’ -%}
{%- when ‘cart_action’ -%}
{% capture “form_classes” -%}
mb-6 product-form-wrapper product-form-{{ section.id }}
{%- if section.settings.enable_payment_button and product.has_only_default_variant %} product-form–payment-button-no-variants {%- endif -%}
{%- if current_variant.available == false %} product-form–variant-sold-out {%- endif -%}
{%- endcapture %}
{% form ‘product’, product, class:form_classes, novalidate: ‘novalidate’, data-product-form: ‘’ %}
{{ form | payment_terms }}
{% unless product.has_only_default_variant %}
{% for option in product.options_with_values %}
{% assign swatch_option = false %}
{%- assign downcased_option = option.name | downcase -%}
{% if downcased_option contains ‘color’ and settings.product_swatch_color %}
{% assign swatch_option = true %}
{% endif %}
{% if downcased_option contains ‘size’ and settings.product_swatch_size %}
{% assign swatch_option = true %}
{% endif %}
{% if swatch_option %}
{% render ‘product-options-swatch’, product: product, option:option, function: “product”, option_drop: option, forloop: forloop, option_index: forloop.index, option_index0: forloop.index0, sign: section.id, section_id: section.id %}
{% else %}
{%- render “product-sizechart” , option:option, _class: “ml-5” -%}
{% endif %}
{% endfor %}
{% endunless %}
{%- capture qty_and_addtocart -%}
{% if block.settings.show_quantity_selector %}
{% endif %}
{% if block.settings.show_quantity_selector %}
{% endif %}
{% if block.settings.enable_payment_button %}
{%- if settings.cart_terms_enable -%}
{%- assign terms_conditions_url = ‘#’ -%}
{%- if settings.cart_terms_page != blank -%}
{%- assign terms_conditions_url = ‘/pages/’ | append: settings.cart_terms_page -%}
{%- endif -%}
{%- endif -%}
{{- form | payment_button -}}
{% endif %}
{%- endcapture -%}
{{- qty_and_addtocart -}}
{{ ‘products.product.quantity_minimum_message’ | t }}
{% endform %}
{%- when ‘utilities’ -%}
{%- include ‘product-single’, function: ‘btn_exts’ -%}
{%- when ‘social_share’ -%}
{%- include ‘social-sharing’, share_title: product.title, share_permalink: product.url, share_image: product.featured_media, class: “d-block social-sharing mb-2” -%}
{%- when ‘shipping_info’ -%}
{%- include ‘product-single’, function: ‘shipping_info’ -%}
{%- endcase -%}
{%- endfor -%}
{%- if section.settings.has_separate -%}
{%- endif -%}
{% unless product == empty %}
{% endunless %}
{% schema %}
{
“name”: “Product - Brief & action”,
“tag”: “section”,
“class”: “container-product pb-4 pb-lg-10”,
“settings”: [
{
“type”: “checkbox”,
“id”: “product_fullwidth”,
“label”: “Full Width”,
“default”: false
},
{
“type”: “checkbox”,
“id”: “has_separate”,
“label”: “Has separator”,
“default”: true
},
{
“type”: “select”,
“id”: “thumbnails_position”,
“label”: “Thumbnails Position”,
“options”: [
{
“value”: “left”,
“label”: “Left”
},
{
“value”: “bottom”,
“label”: “Bottom”
}
],
“default”: “left”
},
{
“type”: “header”,
“content”: “Media”,
“info”: “Learn more about media types”
},
{
“type”: “select”,
“id”: “media_size”,
“label”: “Size”,
“options”: [
{
“value”: “small”,
“label”: “Small”
},
{
“value”: “medium”,
“label”: “Medium”
},
{
“value”: “large”,
“label”: “Large”
},
{
“value”: “full”,
“label”: “Full-width”
}
],
“default”: “medium”
},
{
“type”: “checkbox”,
“id”: “enable_image_zoom”,
“label”: “Enable image zoom”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “enable_video_looping”,
“label”: “Enable video looping”,
“default”: false
}
],
“blocks”: [
{
“type”: “@app”
},
{
“type”: “vendor”,
“name”: “Vendor”,
“limit”: 1,
“settings”: [
{
“type”: “text”,
“id”: “text”,
“default”: “{{ product.vendor }}”,
“label”: “Text”
}
]
},
{
“type”: “product_title”,
“name”: “Title”,
“limit”: 1,
“settings”: [
{
“type”: “text”,
“id”: “text”,
“default”: “{{ product.title }}”,
“label”: “Text”
}
]
},
{
“type”: “product_description”,
“name”: “Description”,
“limit”: 1,
“settings”: [
]
},
{
“type”: “review”,
“name”: “Review”,
“limit”: 1
},
{
“type”: “inventory”,
“name”: “Inventory”,
“limit”: 1,
“settings”: [
{
“type”: “checkbox”,
“id”: “show_sku”,
“label”: “Show SKU”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “show_stock”,
“label”: “Show stock”,
“default”: true
}
]
},
{
“type”: “countdown”,
“name”: “Countdown”,
“limit”: 1
},
{
“type”: “price”,
“name”: “Price”,
“limit”: 1
},
{
“type”: “stock_countdown”,
“name”: “Stock countdown”,
“limit”: 1,
“settings”: [
{
“type”: “header”,
“content”: “Stock countdown”,
“info”: “Display the limited availability of your products. Create scarcity, increase the perceived value of your products. Make customers buy faster.”
},
{
“type”: “checkbox”,
“id”: “show_stock_countdown”,
“label”: “Show stock countdown”,
“default”: false
},
{
“type”: “color”,
“id”: “stock_countdown_highlight_color”,
“label”: “Highlight color”,
“default”: “#d9121f”
},
{
“type”: “checkbox”,
“id”: “show_stock_countdown_fake”,
“label”: “Use simulation mode”,
“info”: “If you want to run this feature in simulation mode, it will be applied on all products.”,
“default”: true
},
{
“type”: “range”,
“id”: “stock_countdown_fake_from”,
“min”: 1,
“max”: 10,
“step”: 1,
“label”: “Random from”,
“default”: 10
},
{
“type”: “range”,
“id”: “stock_countdown_fake_to”,
“min”: 5,
“max”: 100,
“step”: 1,
“label”: “Random to”,
“default”: 40
},
{
“type”: “header”,
“content”: “Total sold”,
“info”: “This tiny feature make fake total sold for your store. It is not real but you can use just for fun ;)”
},
{
“type”: “checkbox”,
“id”: “show_total_sold”,
“label”: “Show total sold”,
“default”: false
},
{
“type”: “range”,
“id”: “total_sold_qty_min”,
“min”: 1,
“max”: 100,
“step”: 1,
“label”: “Min quantity”,
“default”: 5
},
{
“type”: “range”,
“id”: “total_sold_qty_max”,
“min”: 1,
“max”: 100,
“step”: 1,
“label”: “Max quantity”,
“default”: 20
},
{
“type”: “range”,
“id”: “total_sold_time_min”,
“min”: 1,
“max”: 24,
“step”: 1,
“label”: “Min time”,
“default”: 4
},
{
“type”: “range”,
“id”: “total_sold_time_max”,
“min”: 1,
“max”: 24,
“step”: 1,
“label”: “Min time”,
“default”: 24
}
]
},
{
“type”: “text”,
“name”: “Custom text”,
“settings”: [
{
“type”: “text”,
“id”: “text”,
“default”: “Text block”,
“label”: “Text”
}
]
},
{
“type”: “cart_action”,
“name”: “Cart action”,
“limit”: 1,
“settings”: [
{
“type”: “checkbox”,
“id”: “show_quantity_selector”,
“label”: “Show quantity selector”,
“default”: false
},
{
“type”: “checkbox”,
“id”: “enable_payment_button”,
“label”: “Show dynamic checkout button”,
“info”: “Each customer will see their preferred payment method from those available on your store, such as PayPal or Apple Pay. Learn more”,
“default”: true
}
]
},
{
“type”: “utilities”,
“name”: “Utilities”,
“limit”: 1
},
{
“type”: “social_share”,
“name”: “Social sharing”,
“limit”: 1
},
{
“type”: “shipping_info”,
“name”: “Shipping info”,
“limit”: 1,
“settings”: [
{
“type”: “html”,
“id”: “shipping_info”,
“label”: “Shipping content”,
“default”: “Free Shipping on Orders Over $30”
}
]
}
]
}
{% endschema %}
{% assign current_variant = product.selected_or_first_available_variant %}
@Ahsan_ANC shopify deleted my messages with code ![]()
Link to help center page with instructions: here
You can send the code in a text file on my email. Here in reply, there is a character limit.
@Ahsan_ANC just sent, thank you!
Will you be happy to show this message with custom coding? style the current element seems impossible.
@Ahsan_ANC
Yes, I need to make this message visible.
Very strange that haven’t any options.
@Ahsan_ANC ohhh, thank you very much!
Judt another one question: is it possible to make it black? ![]()
yes, changed





