Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Enlarge product images to full-screen, Brine, v7.0


HelenC

Question

Site URL: https://girlwithoutatripod.com/

I would like to be able to enlarge the product photos when clicked on or hovered over to expand the image size to full-screen or at least close to. I use Brine, version 7.0

Would anyone now how to make this possible? It would be incredibly useful for people to be able to see closer detail of what they are considering buying. 

Thanks!

Link to comment

5 answers to this question

Recommended Posts

  • 0
1 hour ago, HelenC said:

Thank you- I figured out how to turn on the lightbox feature for a larger product image! 🙂

 Is there a way for the background to be white instead of black (see screenshot)? I'm using a 2:3 pic ratio, so for the images that are 1:1, it would look better if the background was white so that it you don't get the unsightly border effect. Thanks!

Screen Shot 2021-06-28 at 6.26.26 PM.png

custom css

.yui3-lightbox2 .sqs-lightbox-overlay {
  background: #fff;
}

image.thumb.png.c248a5f567e89bbabb48119ba78036a3.png

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0

Thank you- I figured out how to turn on the lightbox feature for a larger product image! 🙂

 Is there a way for the background to be white instead of black (see screenshot)? I'm using a 2:3 pic ratio, so for the images that are 1:1, it would look better if the background was white so that it you don't get the unsightly border effect. Thanks!

Screen Shot 2021-06-28 at 6.26.26 PM.png

Link to comment
  • 0

I want to provide an update that your code DID work! The issue was that the feature Ajax loading was enabled, which prevented the update from reloading when navigating between pages. 

Thanks again for your help and quick response!

Link to comment
  • 0
On 7/8/2021 at 12:40 AM, HelenC said:

I want to provide an update that your code DID work! The issue was that the feature Ajax loading was enabled, which prevented the update from reloading when navigating between pages. 

Thanks again for your help and quick response!

Just found some small things. Do you need to fix these?

Site URL – https://girlwithoutatripod.com/

1. (All devices – Homepage) Can click Limited edition – Abstract

https://girlwithoutatripod.com/

girlwithoutatripod.com-01-min.png

2. (Mobile – Homepage) Remove the black part at the bottom of the page.

https://girlwithoutatripod.com/

girlwithoutatripod.com-02-min.png

3. (All devices – Shop) Do you want to add shopping cart icon?

https://girlwithoutatripod.com/shop-girlwithoutatripod

girlwithoutatripod.com-03-min.png

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...