codefordummies Posted December 30, 2021 Share Posted December 30, 2021 Site URL: https://www.terroir-imports.com/products.com Hi there! I am looking to change the focal-point of my images so that you can only see the product labels in the e-commerce. However, despite changing the aspect ratio to the desired 2.40 Anamorphic widescreen and adjusting the focal-point, the image is still not displaying as desired. Here is what I get: Any chance someone can help me out with this? @creedon, any tips 🙂 ? Thank you! Link to comment
creedon Posted December 31, 2021 Share Posted December 31, 2021 This is what I'm seeing. Please tell us more about your browsing environment. OS and app. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
codefordummies Posted January 3, 2022 Author Share Posted January 3, 2022 Hey @creedon, I have yet to switch the aspect ratio since I hadn't figured out how to change the focal point. I just wanted to avoid causing confusion for my clients. I use Safari via my MacBook Pro. Thanks, Michelle 🙂 Link to comment
codefordummies Posted January 3, 2022 Author Share Posted January 3, 2022 @creedon the same issue seems to happen when using chrome... Link to comment
creedon Posted January 3, 2022 Share Posted January 3, 2022 (edited) At this point I think the os/browser info is a red herring as the effect was not active so I couldn't see the issue in action. I'd like to suggest a different approach to what I think you are trying to accomplish. I'm guessing that showing full pictures of bottles on the product grid is not the best use of the space available. Lots of space spent on bottle tops and bottoms that don't tell the customer anything. You want to focus on the label. Glass doesn't sell wine, labels do! OK glass is important too but not as far as informing the customer of what they are getting into. 🙂 Edit the images of the bottles and crop the images down to the labels. Save those label images as new images. Upload them to each product. Make the label image the first image. Then your product grid will feature the image label prominently. Do you think that would work for you? Edited January 3, 2022 by creedon Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
codefordummies Posted January 3, 2022 Author Share Posted January 3, 2022 8 minutes ago, creedon said: At this point I think the os/browser info is a red herring as the effect was not active so I couldn't see the issue in action. I'd like to suggest a different approach to what I think you are trying to accomplish. I'm guessing that showing full pictures of bottles on the product grid is not the best use of the space available. Lots of space spent on bottle tops and bottoms that don't tell the customer anything. You want to focus on the label. Glass doesn't sell wine, labels do! OK glass is important too but not as far as informing the customer of what they are getting into. 🙂 Edit the images of the bottles and crop the images down to the labels. Save those label images as new images. Upload them to each product. Make the label image the first image. Then your product grid will feature the image label prominently. Do you think that would work for you? That seems reasonably easy! I'm gonna give it a shot! Thank you @creedon 🙏 Link to comment
codefordummies Posted January 3, 2022 Author Share Posted January 3, 2022 @creedon The only problem I see with that solution is that upon hover the client will not see the whole bottle. I could change the aspect ratio to allow you to see what the problem is? Link to comment
creedon Posted January 3, 2022 Share Posted January 3, 2022 1 minute ago, codefordummies said: The only problem I see with that solution is that upon hover the client will not see the whole bottle. That crossed my mind. I assume that is because you are using the quick view? I didn't test that variation. No need to change the aspect ratio on your site. I can do that on my test site and see what the ramifications are. I'm knocking off for the night. Please bump this thread in several days if I don't get back to you. In the mean time if anyone else has a solution, please feel free. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
codefordummies Posted January 3, 2022 Author Share Posted January 3, 2022 1 minute ago, creedon said: That crossed my mind. I assume that is because you are using the quick view? I didn't test that variation. No need to change the aspect ratio on your site. I can do that on my test site and see what the ramifications are. I'm knocking off for the night. Please bump this thread in several days if I don't get back to you. In the mean time if anyone else has a solution, please feel free. Excellent! Thanks @creedon I will definitely follow up if necessary. Really appreciate you looking into this 🙏🏼😇 Link to comment
creedon Posted January 3, 2022 Share Posted January 3, 2022 I think my idea can still work for your needs with a few settings changes. Here is what I'm seeing on my site. hover full bottle.mp4 I didn't fine tune all the settings you have but the basic effect is there. The critical bit to set the item hover behaviour correctly. Do you want to give that a go on one product? Let us know how it goes. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
codefordummies Posted January 3, 2022 Author Share Posted January 3, 2022 2 minutes ago, creedon said: I think my idea can still work for your needs with a few settings changes. Here is what I'm seeing on my site. hover full bottle.mp4 152.87 kB · 0 downloads I didn't fine tune all the settings you have but the basic effect is there. The critical bit to set the item hover behaviour correctly. Do you want to give that a go on one product? Let us know how it goes. @creedon I'm willing to give it a try! However, I dont seem to see the "item hover behaviour" in my settings... Any how, what should be my next steps for now 🙂 Link to comment
creedon Posted January 3, 2022 Share Posted January 3, 2022 The first thing is to hunt down that hover setting, if it is available. I notice that your site is not reporting a template when I use my code for telling me that info. This info may be at Home > Help. What does it say? What is the template for your site? Is your site in Developer Mode? DO NOT change the Developer Mode setting or bad things can happen. You can loose your whole site. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
codefordummies Posted January 3, 2022 Author Share Posted January 3, 2022 5 minutes ago, creedon said: The first thing is to hunt down that hover setting, if it is available. I notice that your site is not reporting a template when I use my code for telling me that info. This info may be at Home > Help. What does it say? What is the template for your site? Is your site in Developer Mode? DO NOT change the Developer Mode setting or bad things can happen. You can loose your whole site. This is what I have as a site: and I do think that I am on developer mode..... Is there anyway of knowing what will be lost if I change it back 😩? Link to comment
creedon Posted January 3, 2022 Share Posted January 3, 2022 Quote Is there anyway of knowing what will be lost if I change it back 😩? DO NOT change it! Bad things will happen. If you did change it anything that is unique to the custom template you are using would go away. Let's see if the hover setting is really not there. Click on a Product Page in Pages. Go to Design > Site Styles. In the search field type in hover. Does the setting show? Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
codefordummies Posted January 3, 2022 Author Share Posted January 3, 2022 Ok! I won't touch it haha. Thanks for the warning. Here is what I get: Link to comment
creedon Posted January 3, 2022 Share Posted January 3, 2022 Quote Ok! I won't touch it haha. Thanks for the warning. I'm heavy on the warnings because I've seen folks in the forum who changed it not understanding the consequences and they were sad. Quote Here is what I get: In the full settings listing it would normally be in layout section. Did you type in hover in the search? I've sometimes seen things not be listed and then show up using the search field. It could also could not really be there. It's been awhile since I worked in developer mode but I'm wondering if the tweak was removed to achieve another effect or prevent an issue with one? Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
codefordummies Posted January 3, 2022 Author Share Posted January 3, 2022 1 minute ago, creedon said: I'm heavy on the warnings because I've seen folks in the forum who changed it not understanding the consequences and they were sad. In the full settings listing it would normally be in layout section. Did you type in hover in the search? I've sometimes seen things not be listed and then show up using the search field. It could also could not really be there. It's been awhile since I worked in developer mode but I'm wondering if the tweak was removed to achieve another effect or prevent an issue with one? Even when I begin to write "hover" nothing appears unfortunately! Link to comment
creedon Posted January 3, 2022 Share Posted January 3, 2022 Quote Even when I begin to write "hover" nothing appears unfortunately! It sounds like it really isn't there. 😞 Hold up. I'm on a new trail. Give me some time to investigate. codefordummies 1 Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
creedon Posted January 3, 2022 Share Posted January 3, 2022 OK. The reason the tweak is not there is because the PRODUCTS DETAILS, Position tweak is set to Overlay. If it is set to Under then the Item Hover shows. Of course changing the Position setting changes the layout of the items in the product grid. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
codefordummies Posted January 4, 2022 Author Share Posted January 4, 2022 19 hours ago, creedon said: OK. The reason the tweak is not there is because the PRODUCTS DETAILS, Position tweak is set to Overlay. If it is set to Under then the Item Hover shows. Of course changing the Position setting changes the layout of the items in the product grid. I am willing to change the settings to position under! After doing that I just have to add the cropped image to the individual products? Link to comment
creedon Posted January 4, 2022 Share Posted January 4, 2022 Quote After doing that I just have to add the cropped image to the individual products? That is pretty much it. Make sure you put the cropped image first in the product detail and also the setting in Styles is set to show the alternate image. Of course you can test all this out before committing to add all the product images. Let us know how it goes. codefordummies 1 Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
codefordummies Posted January 4, 2022 Author Share Posted January 4, 2022 2 hours ago, creedon said: That is pretty much it. Make sure you put the cropped image first in the product detail and also the setting in Styles is set to show the alternate image. Of course you can test all this out before committing to add all the product images. Let us know how it goes. Thank you so much for helping me figure all of this out 🙏🏼 it is really appreciated! I'll let you know if I have any subsequent issues 😄 creedon 1 Link to comment
caffeinateddiabetic Posted January 3 Share Posted January 3 (edited) On 1/2/2022 at 11:49 PM, creedon said: I did a quick search trying to find a solution to my issue, and think this might be the thread, not 100% sure. Didn't want to start a new one, but I can if that's what should be done. Basically, I've uploaded images to my Squarespace site some time ago, but some of the images are cutoff, and don't show fully unless you right click and do the, "open in new window" thing. I really wish Squarespace would just tell us what the sizes for our photos should be, and then adjust them accordingly to they fit the box. Am I missing something, and is there a way to do it? (I've seen the ratios, and messed with them, don't think that's it?) Here's one product listing showing the third image being weird, and depending which page landing I'm looking at, the first two sometimes look weird: https://www.hyperspacecoffee.com/shop/p/lhhrmimemy82xmiz9tkyipj4fsp7du Edited January 3 by caffeinateddiabetic Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment