Hi,
I am using the Shopify Forms App, but I am not able to edit the border radius of the input sections and button.
All other buttons are rounded. I have tried it with custom css and also edit code in theme.liquid, but I cannot figure it out.
If tried it with inspect elements and adjust manually to show what I want to achieve (picture with rounded corners).
Website: brenover.com
Hello @dylanmaria
This is Amelia at PageFly - Shopify Advanced Page Builder app.
You can try the following steps I have provided to help you solve the problem you are facing:
Step 1: Online Store → Themes → Edit Code
Step 2: Choose file theme.liquid
Step 3: Add code above the tag
Hoping my solution helps you solve your problem.
Best regards,
Amelia | PageFly
Hey @dylanmaria ,
Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.
Screenshot is for reference only, the correct code to paste is the one shown above.
Hi @ThePrimeWeb ,
Thanks for your response, the provided code does not seem to effect the border radius of the shopify forms… Stays exactly the same.
Thanks for your response, the provided code does not seem to effect the border radius of the shopify forms… Stays exactly the same.
Hey @dylanmaria ,
Can you share the link to the page where this form is?
It would be for the following two pages:
Hey @dylanmaria ,
Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
ABOVE the tag “” tag paste the following. Screenshot attached for reference.
Screenshot for reference
Hi @ThePrimeWeb
No success either. Website is now running with the provided code. It feels like the app itself is blocking the code?
Hey @dylanmaria ,
Can you change this value of 100 incrementally and see if it works at one point. 100 means 100 milliseconds. The problem is that the form loads a few seconds after the page has loaded, so we need the code to run after a certain time. Right now I added 100ms. But it might need to pause for a little while longer. Try 1000, which is one second and see if it works. Then increase the value further if it doesn’t work.
Thank you @ThePrimeWeb ,
I put it at 600 and now it work perfectly!
Only not on mobile
Mobiles tend to load pages slower than desktop. Try increasing the value further.
Just another tip. Don’t keep it at the lowest value possible, because some people have slower internet connections. So give it more allowance. If 600 is the minimum, then do 1100. An extra allowance of 500.
Alright, it works also on mobile now! Superb knowledge!
One more thing, but thanks for helping me this hard. Is it also possible to do this for the dropdownmenu?
Unfortunately I can’t. The content on the dropdown keeps getting removed and added when you open and close it, so each time it’s loaded with default settings. Normally, these dropdowns are not built by removing and adding, but more like hiding and showing. This is the app’s way of blocking it I guess.
If the dropdown was built to hide and show instead, the code I gave you would automatically apply to it. But since it’s getting removed and added, the code doesn’t work on it.
Understood. I understand. But I am satisfied with the result, thanks alot!
