Change text placement on image banner

Solved

Change text placement on image banner

adorcollective
Tourist
11 0 2

Hello. I want to change the text placement and button placement ( "new launch" & "view collection" ) on the main image banner when you acces the site but only on the pc version. on mobile I figured out. I want to place them at the bottom of the image banner but the template doesn't let me more than it is now.

this is the website:

www.adorcollective.com

pw: geicay

 

ty

Accepted Solution (1)

BSSCommerce-B2B
Shopify Partner
565 114 137

This is an accepted solution.

Hi @adorcollective , 

 

I have reviewed your requirement, you just need to edit css script and the issue will be resolved.  You can follow my instructions! 

 

Step 1: Go to Admin -> Online store -> Theme > Edit code:

BSSCommerceB2B_0-1718472925521.png

 

 

Step 2: Search for the file base.css or section-image-banner.css. And add this code snippet to the end of the file.

 

 

.banner__content {
    padding: 0 !important;
}

 

 

Step 3: Save your code and reload this page.

=>> The result: 

BSSCommerceB2B_2-1718473416646.png

 

 

I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.

Have a nice day sir! 

If our suggestions are useful, please let us know by giving it a like, marking it as a solution.


B2B Solution & Custom Pricing |BSS: B2B Portal, Quote, Net 30 | BSS: B2B Login Lock Hide Price


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

View solution in original post

Replies 2 (2)

Rahul_dhiman
Shopify Partner
238 44 43

Hello @adorcollective 
Go to online store ---------> themes --------------> actions ------> edit code-------> go to assets----> section-image-banner.CSS--------> line number 232
check this code

.banner:not(.banner--mobile-bottom):not(.email-signup-banner) .banner__box {
    background: transparent;
  }

and replace with below code

@media screen and (max-width: 749px) {
    .banner:not(.banner--mobile-bottom):not(.email-signup-banner) .banner__box {
        background: transparent;
        top: 37px;
    }
}


the result will be
qw.png

let me know , if this was helpful
Thanks

Was I helpful?

Buy me a coffee



Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront
Email me -rahul@prowebcoder.com - Skype: live:dhiman.639
Checkout Some Free Sections Here

BSSCommerce-B2B
Shopify Partner
565 114 137

This is an accepted solution.

Hi @adorcollective , 

 

I have reviewed your requirement, you just need to edit css script and the issue will be resolved.  You can follow my instructions! 

 

Step 1: Go to Admin -> Online store -> Theme > Edit code:

BSSCommerceB2B_0-1718472925521.png

 

 

Step 2: Search for the file base.css or section-image-banner.css. And add this code snippet to the end of the file.

 

 

.banner__content {
    padding: 0 !important;
}

 

 

Step 3: Save your code and reload this page.

=>> The result: 

BSSCommerceB2B_2-1718473416646.png

 

 

I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.

Have a nice day sir! 

If our suggestions are useful, please let us know by giving it a like, marking it as a solution.


B2B Solution & Custom Pricing |BSS: B2B Portal, Quote, Net 30 | BSS: B2B Login Lock Hide Price


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency