All things Shopify and commerce
Hi all,
I want the "SHOP NOW" button text to change when someone hovers over it.
This is how I want it to look when no one is hovering over it.
This is how I want it to look when someone hovers over it. (but with rounded edges)
Theme: Dawn theme
Store URL: https://cngdxq-tk.myshopify.com/
Thanks in advance!
Solved! Go to the solution
This is an accepted solution.
Hi Osama01
- You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file base.css and add this code at the end of the file
a.button.button--secondary:hover {
color: #fff;
}
.banner__buttons:hover {
background: transparent;
}
Result:
Best,
Esther
I want the background to be transparent when someone hovers over it so the background becomes whatever the image behind it is. Sorry If I wasn't clear in my question.
This is an accepted solution.
Hi Osama01
- You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file base.css and add this code at the end of the file
a.button.button--secondary:hover {
color: #fff;
}
.banner__buttons:hover {
background: transparent;
}
Result:
Best,
Esther
Hey!
It worked, but is it possible to make an animation? Like when someone hovers over it the original button slides until it becomes fully transparent. If you don't understand maybe I can try and find a website with a similar idea.
Oh its alright, thanks anyways!
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025