LiamM Posted December 2, 2021 Share Posted December 2, 2021 Site URL: https://mackerel-primrose-ctj9.squarespace.com/ Hi, I would like to use a custom (2:1) aspect ratio for the projects shown in the grid display of my main portfolio page. The drop-down menu is limited to the following: Is there a code I can use to achieve that 2:1 aspect ratio to avoid any cropping to my custom 2:1 images?https://mackerel-primrose-ctj9.squarespace.com/ pw: demosite Just as a reference, there was a question almost identical to mine which I found in search, however the code provided didn't seem to do anything when applied to my site: Thank you for the help. Link to comment
tuanphan Posted December 4, 2021 Share Posted December 4, 2021 You mean keep 16:9 for all porfolio pages, and use 2:1 for specific grid portfolio page? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
LiamM Posted December 4, 2021 Author Share Posted December 4, 2021 Yes, this just refers to the one grid portfolio page where I display my main work. Link to comment
tuanphan Posted December 7, 2021 Share Posted December 7, 2021 On 12/5/2021 at 2:30 AM, LiamM said: Yes, this just refers to the one grid portfolio page where I display my main work. Add to Design > Custom > Then save & reload the site /* Homepage 2:1 ratio */ body.homepage .portfolio-grid-overlay .grid-item, body.homepage .portfolio-grid-overlay .grid-image { padding-bottom: 50% !important; } LiamM 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
LiamM Posted December 7, 2021 Author Share Posted December 7, 2021 That worked- thank you very much! Link to comment
tuanphan Posted December 11, 2021 Share Posted December 11, 2021 On 12/7/2021 at 8:58 AM, LiamM said: That worked- thank you very much! It looks like you haven't changed About Page SEO Title so the browser tab name still shows "Contact 3". Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
failbetter Posted June 15, 2022 Share Posted June 15, 2022 Is it possible to keep the original aspect ratio in a grid gallery? like I have a mixed grid gallery of landscape and portrait images. Is it possible to keep them the same ratio and equivalent size? Link to comment
tuanphan Posted June 16, 2022 Share Posted June 16, 2022 19 hours ago, failbetter said: Is it possible to keep the original aspect ratio in a grid gallery? like I have a mixed grid gallery of landscape and portrait images. Is it possible to keep them the same ratio and equivalent size? Can you share link to grid gallery? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
justinli Posted December 1, 2022 Share Posted December 1, 2022 Hi @tuanphan! Could you possibly help me with the same issue for justinli.ca/art and justinli.ca/commercial? I want to preserve the original aspect ratio of the images in these galleries. Link to comment
tuanphan Posted December 2, 2022 Share Posted December 2, 2022 On 12/1/2022 at 7:40 AM, justinli said: Hi @tuanphan! Could you possibly help me with the same issue for justinli.ca/art and justinli.ca/commercial? I want to preserve the original aspect ratio of the images in these galleries. 2 sites needs same ratio or different and which ratio? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
justinli Posted December 3, 2022 Share Posted December 3, 2022 20 hours ago, tuanphan said: 2 sites needs same ratio or different and which ratio? Thanks for replying @tuanphan. I want both sites to display my original images, retaining the same aspect ratios from when they were uploaded, instead of being cropped to all the same. SKPhotography 1 Link to comment
SKPhotography Posted December 13, 2022 Share Posted December 13, 2022 Hello @tuanphan, I would like access to the same code as @justinliif possible - original aspect ratio for images in "Grid : Overlay" section on a portfolio page. Thank you! Link to comment
tuanphan Posted December 17, 2022 Share Posted December 17, 2022 On 12/14/2022 at 6:57 AM, SKPhotography said: Hello @tuanphan, I would like access to the same code as @justinliif possible - original aspect ratio for images in "Grid : Overlay" section on a portfolio page. Thank you! If you share link to page where you use Grid, we can check it again easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
SKPhotography Posted January 3 Share Posted January 3 @tuanphanhere is a link to the page I would like to retain original image aspect ratios using the grid overlay portfolio template https://www.skphoto.co/portfolio-1 Link to comment
tuanphan Posted January 7 Share Posted January 7 On 1/4/2023 at 3:10 AM, SKPhotography said: @tuanphanhere is a link to the page I would like to retain original image aspect ratios using the grid overlay portfolio template https://www.skphoto.co/portfolio-1 Hi, The url doesn't work. Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
SKPhotography Posted January 8 Share Posted January 8 @tuanphanit's working now, sorry about that! Link to comment
tuanphan Posted January 14 Share Posted January 14 On 1/8/2023 at 10:58 PM, SKPhotography said: @tuanphanit's working now, sorry about that! Hi, Which page you want to use custom ratio? https://www.skphoto.co/portfolio-1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
SKPhotography Posted January 17 Share Posted January 17 @tuanphanthe page shown in the link, "portfolio-1" Link to comment
tuanphan Posted January 19 Share Posted January 19 On 1/18/2023 at 4:02 AM, SKPhotography said: @tuanphanthe page shown in the link, "portfolio-1" Add to Portfolio-1 Page Header <style> .tweak-portfolio-grid-overlay-image-aspect-ratio-11-square .portfolio-grid-overlay .grid-image, .tweak-portfolio-grid-overlay-image-aspect-ratio-11-square .portfolio-grid-overlay .grid-item { padding-bottom: 50% !important; } </style> If you use Personal Plan, let me know, I will give another code Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
SKPhotography Posted January 19 Share Posted January 19 @tuanphanThank you! But the images look to be cropping to 16:9 - was there a way to change the code to retain the original aspect ratio? Link to comment
abian Posted January 25 Share Posted January 25 hi 🙂 @tuanphan I also have a similar problem. I would like to set a customised aspect ratio, an even thinner rectangle than the ultrawide screen, so 48:9 (super-super ultrawide). I would like to have this setting only in all preview portfolio pages : - BESPOKE (furniture, objects, exhibitions) - STUDIO (public, residential) Thank you in advance! https://grasshopper-bagpipe-xnbp.squarespace.com password : Architettura9439 Link to comment
tuanphan Posted January 27 Share Posted January 27 On 1/20/2023 at 3:02 AM, SKPhotography said: @tuanphanThank you! But the images look to be cropping to 16:9 - was there a way to change the code to retain the original aspect ratio? You mean change to 1:1? On 1/25/2023 at 9:24 PM, abian said: hi 🙂 @tuanphan I also have a similar problem. I would like to set a customised aspect ratio, an even thinner rectangle than the ultrawide screen, so 48:9 (super-super ultrawide). I would like to have this setting only in all preview portfolio pages : - BESPOKE (furniture, objects, exhibitions) - STUDIO (public, residential) Thank you in advance! https://grasshopper-bagpipe-xnbp.squarespace.com password : Architettura9439 Add to Furniture, Objects, Exhibitions, Public, Residential Page Headers <style> .grid-image, .grid-item { padding-bottom: 18.75% !important; } </style> abian 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
SKPhotography Posted January 30 Share Posted January 30 @tuanphan Not 1:1 or one standard overall aspect ratio - only the original ratio of the image, for instance what aspect ratio the image was photographed in. I have a variety of image aspect ratios (4:5, 16:9, 2:3) in both horizontal and vertical orientations. Essentially, I'm looking for code that won't allow Squarespace to change the aspect ratio at all. Link to comment
tuanphan Posted February 2 Share Posted February 2 On 1/30/2023 at 8:23 AM, SKPhotography said: @tuanphan Not 1:1 or one standard overall aspect ratio - only the original ratio of the image, for instance what aspect ratio the image was photographed in. I have a variety of image aspect ratios (4:5, 16:9, 2:3) in both horizontal and vertical orientations. Essentially, I'm looking for code that won't allow Squarespace to change the aspect ratio at all. Add this to these page header <style> .grid-image { object-fit: contain !important; } .grid-image { padding-bottom: unset !important; } .grid-image-inner-wrapper { position: static !important; } a.grid-item { padding: unset !important; height: auto !important; } </style> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
abian Posted February 22 Share Posted February 22 Hi @tuanphan thank you very much! I entered the codes and it worked perfectly. The only problem is that the scroll bars appeared on the side of each project only in the visualisation for the mobile. Could you help me remove them please ? thank you 🙂 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