How to insert the button into the slideshow on mobile devices

[WXB]

Hi there,

I am wondering how can my “shop now” button be fixed in the slideshow when mobile devices, make it the same as on desktop.

My theme is REFRESH. I guess it is about the code things.

If you need my store url, just let me know.

Thanks in advance!!

如何将按钮插入移动设备上的幻灯片中

你好呀，
我想知道当移动设备上的“立即购物”按钮如何固定在幻灯片中，使其与桌面上的相同。
我的主题是刷新。 我想这与代码有关。
如果您需要我的商店网址，请告诉我。
提前致谢！！

[Moeed]

Hey @WXB

Could you please provide your Store URL and, if applicable, the Password too? Your cooperation is greatly appreciated!

Best Regards,
Moeed

[WXB]

https://yokacos.com/

This is my store. Let me know if I could do that under ur awesome guidance

[Dan-From-Ryviu]

Do you want just button or both text and button same as desktop?

[WXB]

I would prefer text & button fixed in the slideshow. That looks better.

[Dan-From-Ryviu]

Please add this CSS code to do it

@media screen and (max-width: 749px){
.banner--mobile-bottom .banner__media { position: absolute !important; }
.banner--mobile-bottom .slideshow__text.banner__box {
    background: transparent !important;
}
}

[WXB]

How can I make the font color be white? It was white in desktop.

[Moeed]

Hey @WXB

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

RESULT:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[WXB]

Hiii, can you also make the text “take care balahbalah” in white, too? thanks!

[WXB]

@Moeed Hi friend

[Moeed]

Hey @WXB

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

RESULT:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[WXB]

I made it! Thank you so much my friend!

[Dan-From-Ryviu]

Hi @Moeed

Please add more code to make heading text in white

.banner__heading { color: #fff !important; }

[Moeed]

Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.