Hello, I want to add buttons like the image I provided to my store. I’m using DAWN. Is it possible to do so? Thanks
Hey @renssnce ,
Yes, it’s absolutely possible to add buttons like the ones in the image to your Shopify store using the Dawn theme.
Follow these steps.
-
Online Store > Themes
-
Click Customize next to the Dawn theme.
Add a New Hero Section (or Edit the Current One):
-
In the theme editor, locate the “Image with text overlay” section (or another hero/banner section).
-
If you don’t have this section yet, click Add Section and choose “Image with Text” or " Slideshow".
Add Buttons in the Section:
- Scroll down in the settings of the section.
Add the buttons by filling in:
-
Button text: (e.g., “Shop Men” / “Shop Women”);
-
Button links: Select or input where each button will lead (e.g., specific collections or pages).
Customize Button Design:
To achieve the specific button look from the image you uploaded (if not available by default), you may need to modify the theme’s CSS.
CSS For Styling :
-
Online Store > Themes > Edit Code
-
Under Assets, click on base.css
-
Add the following CSS code at the bottom:
.custom-hero-buttons {
display: flex;
gap: 10px;
justify-content: center;
}
.custom-hero-buttons a {
background-color: #fff;
color: #000;
padding: 12px 24px;
border-radius: 30px;
text-decoration: none;
font-weight: bold;
transition: background-color 0.3s ease;
}
.custom-hero-buttons a:hover {
background-color: #f0f0f0;
}
Add HTML to the Hero Section:
-
In the same hero section, click on “Add Block” > Custom HTML.
-
use this HTML snippet to create your buttons:
Shop Men
Shop Women
This approach will allow you to add and customize buttons similar to the ones shown in your image. Let me know if you encounter any issues along the way!
If I was able to help you, please don’t forget to Like and mark it as the Solution!
Best Regard,
Rajat Sharma
