How to overlay button over image in "Image with text section" of Dawn theme

Solved

How to overlay button over image in "Image with text section" of Dawn theme

diganta_baishya
Visitor
3 0 0

What I have right now in the "Image with Text Section" of Dawn theme (v 9.0.0) is as below:

Current.jpg

 

 

What I need to have is as below:

Requirement.jpg

 

 

Is there a way to do this, adding some css code etc? Please help

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
10977 2150 2290

This is an accepted solution.

Hi @diganta_baishya 

Please add this code in Custom CSS of that section 

@media (max-width: 767px) {
.banner__content { align-items: flex-end !important; min-height: 44rem !important; }
.banner__box { padding-bottom: 2rem !important; }
}

Screenshot_1.jpg

- Solved it? Hit Like and Accept solution! Support me: ❤️Buy Me a Coffee❤️
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Replies 4 (4)

Dan-From-Ryviu
Shopify Partner
10977 2150 2290

Hi @diganta_baishya 

Please drop your store link so I can provide the code. 

- Solved it? Hit Like and Accept solution! Support me: ❤️Buy Me a Coffee❤️
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

diganta_baishya
Visitor
3 0 0

Hi Dan, my store link is https://lokait.com

Dan-From-Ryviu
Shopify Partner
10977 2150 2290

This is an accepted solution.

Hi @diganta_baishya 

Please add this code in Custom CSS of that section 

@media (max-width: 767px) {
.banner__content { align-items: flex-end !important; min-height: 44rem !important; }
.banner__box { padding-bottom: 2rem !important; }
}

Screenshot_1.jpg

- Solved it? Hit Like and Accept solution! Support me: ❤️Buy Me a Coffee❤️
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

diganta_baishya
Visitor
3 0 0

hi, thanks this worked. However, adding some more info for the benefit of others who might be seeing this -> I added the above code snippet after changing the section type from "Image with Text" to type "Image Banner" .