Increase Button Size / Payment Options

Michelle103 · ‎06-19-2024

Hello - How can I increase my "purchase" button to match the shop pay size?

Bonus question, where is says "more purchase options", how can I add in graphics for the accepted types? Similar to what is shown in my footer.

Thank you!

Dan-From-Ryviu · ‎06-19-2024

Please add this code to theme.liquid file, after <head> to increase of purchase button

<style>
.product-form__buttons .button { max-width: 100%; }
</style>

- Helpful? Like & Accept solution! - Support me? Buy me a coffee
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

suyash1 · ‎06-19-2024

@Michelle103 - please add this css to the very end of your base.css file and check

.product-form__buttons .button.ajax-submit{width: 100%;  max-width: 100%;}

To build shopify pages use PAGEFLY | Contact me - suyash.patankar@gmail.com

Dan-From-Ryviu · ‎06-19-2024

Please add this code to theme.liquid file, after <head> to increase of purchase button

<style>
.product-form__buttons .button { max-width: 100%; }
</style>

- Helpful? Like & Accept solution! - Support me? Buy me a coffee
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

Michelle103 · ‎06-20-2024

THANK YOU!!!!! Worked perfectly!

PageFly-Noah · ‎06-19-2024

This is Noah from PageFly - Shopify Page Builder App

Hi @Michelle103 Please add code here to fix it:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file theme.liquid
Step 3: Add code above the tag </body>

<style>
 .ajax-submit{
   max-width: 100% !important;
  }
</style>

Hope my solution will help you resolve the issue.

Best regards,

Noah | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!

All features are available from Free plan. Live Chat Support is available 24/7.

Community Blog Articles