How can i move the button on image with text overlay - DEBUT THEME

healhana
Explorer
45 0 16

Preferably, I would like the banner to remain an image, and have the 'shop now' text as being clickable.

I would just like to move the shop now text, is this possible?

KetanKumar
Shopify Partner
15877 1753 5841

@healhana 

Yes, please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.hero__inner .page-width {
max-width: 580px;
    margin: 0;
}


After  code look

KetanKumar_0-1614967486407.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
healhana
Explorer
45 0 16

Hi there

It ends up looking like this...

Screenshot 2021-03-07 at 11.50.58.png

 

 

 

 

 

Also when moving to mobile view the button moves to the middle like this...

Screenshot 2021-03-07 at 11.51.06.png

0 Likes
KetanKumar
Shopify Partner
15877 1753 5841

@healhana 

yes i have already informed you are if you need a banner so let me know i will provide proper it do you need this?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
healhana
Explorer
45 0 16

Hi there

I dont want the banner to be clickable, I just want the 'SHOP NOW' button which is already clickable to move below the writing that says 'HEALHANA, the new age of wellness,' that's all.

The last bit of code did move it but it wasn't in the correct positon.

Thanks

0 Likes
KetanKumar
Shopify Partner
15877 1753 5841

@healhana 

thanksf 

sorry but image proposal and code part doesn't work together sorry 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
healhana
Explorer
45 0 16

I think there may be a bit of confusion.

The last bit of code you provided my did move the button, but just not to the correct position. So surely this means it is possible to do this? 

Can you confirm that it is not possible to move the SHOP NOW button on my image with text overlay? I have seen it done on a few different pages with the same theme

0 Likes
KetanKumar
Shopify Partner
15877 1753 5841

@healhana 

if possible to add me on staff so  i will check all device 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Natztech
Shopify Partner
387 96 190
@media only screen and (max-width: 550px)
.hero .hero__inner .text-center .hero__btn {
    background: transparent !important;
    color: black !important;
    position: absolute !important;
    bottom: -9% !important;
    left: 19% !important;
    transform: translate(-50%, -50%) !important;
}
Create your Shoppable Instagram Feed on your online store with AllFetch app


Want to theme customize Hire us.
If helpful then please Like and Accept Solution

E-mail :natztech2312@gmail.com
Shopify Design Changes | Shopify Custom Theme Design and Development

Whatsapp :
0 Likes
healhana
Explorer
45 0 16

Thanks, shall i add you as staff on this email? bamaniyaketan.sky@gmail.com

Or would you like to make a request for developer access?

Thanks again!

0 Likes