How can I reposition the Shop Now button on the Brooklyn theme slide show?

Start a Business
1

Hi,

I use the Brooklyn theme, and on the Slides, there is a Shop Now button; please check it here https://www.lashfactor.com/. I want to move it to the bottom of the slide show, not on the slides. It sits nicely on the Mobile but not on the Desktop. Please help.

Thanks

Akanksha

2

@Aakanksha88 Go to assets/theme.css and paste below css at bottom of file.

.hero__slide a.hero__cta, .hero--adapt a.hero__cta
{
margin-top: 520px;
}
3

Hi,

The solution wasn’t that helpful. As when I used the code, for the desktop version the mobile version CTA goes way down.

They aren’t in conjunction. Second, I want CTA button to come right below the slide show not within the slide itself.

I want it exactly, the way it appears on the mobile phone.

Let me know.

Thanks
Akanksha

4

Hello @Aakanksha88 !
Hope you are doing well.

Please remove this CSS from theme.scss.css theme file:

@media screen and (min-width: 769px){
.hero__adapt-text-wrap {
    display: none!important;
}
}

And add 0 opacity to this Class (.slick-initialized .hero__text-content) in theme.scss.css theme file:

.slick-initialized .hero__text-content {
    opacity: 0;
}

Hope this will help you out.

5

Hi @Aakanksha88

This is PageFly - Advanced Page Builder. I would love to give you some recommendations

-Go to Online Store->Theme->Edit code

-Asset-> theme.scss paste the below code at the bottom of the file.

#shopify-section-slideshow #HeroWrapper-slideshow .hero__adapt-text-wrap.wrapper{

display:block !important

}

#shopify-section-slideshow #HeroWrapper-slideshow .hero-slideshow .hero__slide .hero__text-wrap{

display:none !important

}

Best Regards;

PageFly

6

Thank you so much. This worked. Finally!!!