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

Aakanksha88
Tourist
6 0 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

Replies 5 (5)

DelightCart
Shopify Partner
1238 82 157

@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;
}
Delight Cart - It's time to turn your visitors into loyal shoppers! 

Delight Loyalty - Increase repeat sales quickly and build lifelong customers loyalty.

Aakanksha88
Tourist
6 0 1
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

iCart_App
Shopify Partner
528 58 107

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.

iCart Cart Drawer Cart Upsell App


- If you find the solution helpful, please accept and like it
- To learn more visit www.identixweb.com
Aakanksha88
Tourist
6 0 1

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

PageFly-Victor
Shopify Partner
7865 1785 3067

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