Shopify themes, liquid, logos, and UX
Hi everyone, Hope you're well! I wonder if you can help me on this: I'm building my product pages using Shogun after importing my product pages in the app. I wonder how I can round the corner of the add to cart button, it is in the main code of my venue theme, Best and many many thanks, Diane
You will go to Online Store > Themes > Actions > Edit Code. Look for the Assets folder > theme.scss.liquid
Scroll to the very bottom and paste this:
.product-single__add-btn { border-radius: 5px; }
Please let me know if you have any questions!
Thanks a lot, it worked!
How can I do the same for the Paypal box (see attached image) and the main square with a grey border ?
Many thanks!
Please provide me with a url to your store and I can provide you with a solution for these two buttons as well.
The PayPal button is not featured in the demo of the theme so I will need your store url to see what needs to be done.
Thanks!
Hi
Here is the link of the product page https://allmyketo.com/collections/now-keto/products/keto-energize-myrtille
I would also like to do the same in the page before (collection page)
I send you the password in a private message,
Thanks!
Yes, but I cannot do the same for the paypal button and the grey square around my 2 payment buttons,
what do you think?
This code can be placed at the bottom of your theme.scss.liquid file as before: (This will style the black "Acheter maintenant" button on your product page).
button.shopify-payment-button__button.shopify-payment-button__button--unbranded { border-radius: 5px; }
This code will style the collection page buttons. Please note that you will put this in the theme-critical.scss.liquid file:
.template-collection .c-btn--full { border-radius: 5px; }
I am not seeing a PayPal button on any of the product pages or collection pages. Are you needing this done on another page? I see that the cart page button already has a border-radius.
Thanks!
Thanks a lot this is super helpful!
Yes I noticed some of our product pages have this button "Acheter maintenant" which is already styled, and other have "Acheter with Paypal", do you know why ?
Besides, can we round the grey square around the add to cart button ?
Please send a screenshot of the grey square around the cart button so I have a reference.
Shoot me over a url for a product with each button. It'll help if I can take a look and brainstorm possibilities. First question that comes to mind is if you only see the PayPal button on products above a certain price?
Thanks!
Hi!
Here is a screenshot of the grey square below
About the two different buttons:
1) https://allmyketo.com/collections/energie-focus/products/superfat-cacao-coconut-nut-butter-10-pack is with the Paypal Button
2)The button "Acheter maintenant" disappeared, I don't find it anymore. It was a quick but button to skip cart.
The best for us would have to have :
- The Grey square
- The button Ajouter au panier
- A button "Acheter maintenant" and when the person clicks, it goes to checkout
Thanks!
Hi,
I am currently setting my shop and was wondering, does anyone know how to make newsletter box rounded using the venture theme ?
Any help would be much appreciated!
You'll have have to adjust the px amount , and make it so the input has a border at all times
.site-footer__newsletter-input {
border-radius: 5px;
}
Save time & money ,Ask Questions The Smart Way
Confused? Busy? Get the solution you need paull.newton+shopifyforum@gmail.com
Problem Solved? ✔Accept and Like solutions to help future merchants
Answers powered by coffee Buy Paul a ☕ Coffee for more answers or donate to eff.org
Hi there,
do you any idea how to round the Paypal Button on the Palo Alto theme ?
here is the URL of my website : https://lustreclearskin.myshopify.com/products/lustre-solo-2
Also, is there a way to change text the "Add to Cart" button for "Buy it Now" for example ?
Thank you for your help,
Hey Shay,
Is there a way to create the same rounded button in Venue for the home page? For example in featured products or a featured collection.
Another similar question: can we apply this rounded button option to the recommended products on the product page?
I used the code mentioned and it works great, I'd just like to have the same aesthetics on all buttons.
Any tip is much appreciated!!
Hello, I can't round the add to cart button in Ella theme, can you help me?
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024