Dike
October 31, 2021, 2:29pm
1
Hello everyone,
Because of the limited options I have added graphic text on the image itself, but when resizing the screen, the button tends to overlap with the text.
So using the text format that Shopify provides must be the best solution to prevent this (please let me know if there are other ways!), but it wont let me recreate what I currently have.
I was wondering how I could come close to this with Shopify’s editor.
I’ve also noticed that the button leaves the picture when going on the mobile format. How can I fix this?
Thank you so much!
URL: https://glowee.nl/
1 Like
@Dike
can you try this code
Go to Online Store->Theme->Edit code
Asset->/section-image-banner.css ->paste below code at the bottom of the file.
@media only screen and (min-width: 992px) {
#shopify-section-template--15290490290398__image_banner .banner__content.banner__content--flex-end.page-width {
top: -75px !important;
}
}
1 Like
Dike
October 31, 2021, 3:02pm
3
Thank you for your reply!
I did this and the button moved on top of the text. I would like to keep it under it, as I think it looks nicer.
Dike
October 31, 2021, 3:12pm
6
I would like to have the button stay on a fixed place, under the text.
And when switching to mobile format, to have the button stay on that place as well.
This is what it currently looks on mobile.
Thank you so much.
1 Like
@Dike
can you please confirm look at mobile?
1 Like
@Dike
yes please add this code
Go to Online Store->Theme->Edit code
Asset->/section-image-banner.css ->paste below code at the bottom of the file.
@media screen and (max-width: 990px) {
#shopify-section-template--15290490290398__image_banner .banner__box.color-background-1 {
padding: 0;
margin-top: -80px;
margin-bottom: 0;
}
}
1 Like
Dike
November 1, 2021, 12:40pm
9
Thank you so much for your help!
1 Like
@Dike
its my pleasure to help us
1 Like
Bluesea
November 8, 2021, 7:39am
11
Hi, I meet a similar issue, I add 2 buttons at image banner section, the text is centered but the buttons go to left as below.
I checked image-banner.liquid and section-image-banner.css, but can not find the code about the button position.
Can you help me to fix it? Thank you!
The theme is Dawn.
1 Like
Bluesea
November 10, 2021, 3:06am
13
Hi @KetanKumar
Here is my store https://www.blueseaclothing.com/
Now I just add one button and it is centered, but I want to add another one and hope them still centered.
1 Like
@Bluesea
thanks for store url but i can’t see 2 button at home page any section
Bluesea
November 10, 2021, 7:10am
15
@KetanKumar can you check again, I add the 2nd button just now
1 Like
@Bluesea
yes, please try this code
Go to Online Store->Theme->Edit code
Asset->/section-image-banner.css ->paste below code at the bottom of the file.
.banner__box>*+.banner__buttons--multiple {margin: 2rem auto 0px ;}
After Code view
1 Like
Bluesea
November 11, 2021, 1:35am
17
@KetanKumar It worked! Thank you so much!
1 Like
@Bluesea
its my pleasure to help us
