Full size photo

Solved

Full size photo

Tiff2
Explorer
48 1 18

I would like to make the first photo of my homepage full size. If anyone could help I'd be very much appreciated! 

www.tiffanynoyama.com

 

Thanks so much in advance. 

Accepted Solutions (3)

BSSCommerce-HDL
Shopify Expert
1004 342 408

This is an accepted solution.

Hi @Tiff2
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

BSSCommerceHDL_0-1719207128233.png

 

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

BSSCommerceHDL_1-1719207134131.png

 

Step 3: Insert the below code at the bottom of the file -> Save

@media only screen and (min-width: 750px) {
  .image-bar--medium .image-bar__item {
      height: 2727px !important;
  }
}

Hope this can help you,

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

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


B2B Solution & Custom Pricing | Product Labels by BSS


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

techlyser_web
Shopify Partner
1770 327 355

This is an accepted solution.

Hello @Tiff2 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media only screen and (min-width: 750px) {
.image-bar--medium .image-bar__content, .image-bar--medium .image-bar__item {
height: 1800px !important;
}
}
</style>

 

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Techlyser || 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

View solution in original post

pwcsangeeta
Shopify Partner
31 3 7

This is an accepted solution.

Hi @Tiff2
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step2: go to assets and open theme .css 

 Step 3. Search the code and 

@media only screen and (min-width: 750px) {
.image-bar--medium .image-bar__content, .image-bar--medium .image-bar__item {
  1. height: 475px;
}
}
and replaces the height :2728px  !important;

 

 

@media only screen and (min-width: 750px) {
    .image-bar--medium .image-bar__content, .image-bar--medium .image-bar__item {
        height: 2728px !important;
    }
}

 

 

Thanks

View solution in original post

Replies 11 (11)

BSSCommerce-HDL
Shopify Expert
1004 342 408

This is an accepted solution.

Hi @Tiff2
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

BSSCommerceHDL_0-1719207128233.png

 

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

BSSCommerceHDL_1-1719207134131.png

 

Step 3: Insert the below code at the bottom of the file -> Save

@media only screen and (min-width: 750px) {
  .image-bar--medium .image-bar__item {
      height: 2727px !important;
  }
}

Hope this can help you,

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

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


B2B Solution & Custom Pricing | Product Labels by BSS


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


BSS Commerce - Full-service eCommerce Agency
Tiff2
Explorer
48 1 18

Thanks for your help!

BSSCommerce-HDL
Shopify Expert
1004 342 408

@Tiff2,  No problem, Have a nice day 😍

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


B2B Solution & Custom Pricing | Product Labels by BSS


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


BSS Commerce - Full-service eCommerce Agency

techlyser_web
Shopify Partner
1770 327 355

This is an accepted solution.

Hello @Tiff2 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media only screen and (min-width: 750px) {
.image-bar--medium .image-bar__content, .image-bar--medium .image-bar__item {
height: 1800px !important;
}
}
</style>

 

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Techlyser || 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
Tiff2
Explorer
48 1 18

thanks a lot!

pwcsangeeta
Shopify Partner
31 3 7

This is an accepted solution.

Hi @Tiff2
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step2: go to assets and open theme .css 

 Step 3. Search the code and 

@media only screen and (min-width: 750px) {
.image-bar--medium .image-bar__content, .image-bar--medium .image-bar__item {
  1. height: 475px;
}
}
and replaces the height :2728px  !important;

 

 

@media only screen and (min-width: 750px) {
    .image-bar--medium .image-bar__content, .image-bar--medium .image-bar__item {
        height: 2728px !important;
    }
}

 

 

Thanks

Tiff2
Explorer
48 1 18

thank you so much!

Tiff2
Explorer
48 1 18

@techlyser_web @BSSCommerce-HDL @pwcsangeeta 

thanks so much for your help! 

It's very strange, the desktop version is showing full size, but not on my mobile. Any idea why? 

Thanks again! 

BSSCommerce-HDL
Shopify Expert
1004 342 408

Hi @Tiff2, Pls insert this code to your file css: 

@media only screen and (max-width: 749px) {
  .image-bar--medium .image-bar__content {
    height: 500px !important;
  }
}

Here is result: 

BSSCommerceHDL_0-1719211298923.png

Hope this can help you,

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

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


B2B Solution & Custom Pricing | Product Labels by BSS


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


BSS Commerce - Full-service eCommerce Agency
Tiff2
Explorer
48 1 18

Thank you for your help!

BSSCommerce-HDL
Shopify Expert
1004 342 408

@Tiff2, We are pleased to assist you 😍

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


B2B Solution & Custom Pricing | Product Labels by BSS


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


BSS Commerce - Full-service eCommerce Agency