How can I change header positions

Solved

How can I change header positions

xeliporit12
Excursionist
12 0 1

Hi, I'm new to Shopify. Is there any way to swap the positions of the two areas I marked? Thanks in advance.

NebulaKing742_0-1723041250169.png

 

Accepted Solutions (2)

BSSCommerce-B2B
Shopify Partner
1280 334 398

This is an accepted solution.

Hi, You can add this code in the custom css section

BSSCommerceB2B_0-1723041332299.png

@media screen and (min-width: 990px) {
  .header--middle-left {
    grid-template-areas: "icons navigation heading";
  }
  .header__heading {
    width: 100%;
    text-align: right;
  }
}

If it helps you, please like and mark it as the solution.

Best Regards

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


BSS: B2B Wholesale Solution |BSS: B2B Portal, Quote, Net 30 | B: B2B Lock Password Protect


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

BSSCommerce-B2B
Shopify Partner
1280 334 398

This is an accepted solution.

You can add this code to the custom CSS

sticky-header {
    background: linear-gradient(135deg, #f8b195, #f67280, #c06c84, #6c5b7b, #355c7d)!important;
}
sticky-header  * {
    color: white!important
}

The result will look like this

BSSCommerceB2B_1-1723130603852.png

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


BSS: B2B Wholesale Solution |BSS: B2B Portal, Quote, Net 30 | B: B2B Lock Password Protect


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 6 (6)

niraj_patel
Shopify Partner
2378 514 511

Hello @xeliporit12 
would you like to share your store URL and password if any please.
so i can check and provide you possible solution for your question.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

BSSCommerce-B2B
Shopify Partner
1280 334 398

This is an accepted solution.

Hi, You can add this code in the custom css section

BSSCommerceB2B_0-1723041332299.png

@media screen and (min-width: 990px) {
  .header--middle-left {
    grid-template-areas: "icons navigation heading";
  }
  .header__heading {
    width: 100%;
    text-align: right;
  }
}

If it helps you, please like and mark it as the solution.

Best Regards

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


BSS: B2B Wholesale Solution |BSS: B2B Portal, Quote, Net 30 | B: B2B Lock Password Protect


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


BSS Commerce - Full-service eCommerce Agency
xeliporit12
Excursionist
12 0 1

Thank you so much, it worked!

xeliporit12
Excursionist
12 0 1

@BSSCommerce-B2B, hi again i have another question how can i change the header background color into a gradient color include pink and blue

NebulaKing742_0-1723129929413.png

 

BSSCommerce-B2B
Shopify Partner
1280 334 398

This is an accepted solution.

You can add this code to the custom CSS

sticky-header {
    background: linear-gradient(135deg, #f8b195, #f67280, #c06c84, #6c5b7b, #355c7d)!important;
}
sticky-header  * {
    color: white!important
}

The result will look like this

BSSCommerceB2B_1-1723130603852.png

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


BSS: B2B Wholesale Solution |BSS: B2B Portal, Quote, Net 30 | B: B2B Lock Password Protect


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


BSS Commerce - Full-service eCommerce Agency

BSS-TekLabs
Shopify Partner
1902 546 634

Hello @xeliporit12 .
Our team is ready to help you.
Please share your website address and access password (if necessary) so that we can check and assist you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
Need help from our expert? Kindly share your request with us via community@bsscommerce.com
BSS Commerce - Full-service eCommerce Agency

For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase


Post purchase upsell, downsell offers to improve sales and AOV
Salemate Post Purchase Upsell