How can I relocate a slideshow button to the bottom left?

Store Design
1

IMG_4103.jpeg
IMG_4103.jpeg1170Ă—2532 314 KB

Hi how can I move this button on my slideshow to bottom left as shown in the image as there is no option to. This is my store url: https://uo1oiiyhyg6lhb4w-79986622787.shopifypreview.com

2

Hi @ti7

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

@media (max-width: 767px){

.slideshow__text.banner__box.content-container.content-container–full-width-mobile.color-accent-2.gradient.slideshow__text–center.slideshow__text-mobile–left {

padding-left: 10px !important;

padding-top: 200px !important;

}

}

Hope that my solution works for you.

Best regards,

Henry | PageFly

3

Hello @ti7 ,

I understand you are looking to move the banner button.

Please add the below mentioned code in your store base.css file.

.banner__buttons {
padding: 13rem 0 0 0;
}

Output -: https://prnt.sc/Bqicui7GqsY1

Anshul_arora_0-1707897927427.png
Anshul_arora_0-1707897927427.png575Ă—622 203 KB

I hope the code helps you.

Please let me know if you have any query.

Thank you.

4

IMG_4110.jpeg
IMG_4110.jpeg1170Ă—2532 298 KB

Hi thank you it worked perfectly is there a way to move these 3 dots circled to the right side as shown in the image. Same store url

5

You can try with this code:

@media (max-width: 767px){
slideshow-component.slider-mobile-gutter {
flex-direction: row !important;
justify-content: flex-end !important;
}}