Search the Community
Showing results for tags 'aspect ratio'.
Found 25 results
-
Site URL: https://www.tomkellyartwork.com Hello, I am struggling to manage the display of my product images on the Shop Page. I have products that require display on the Shop page with 4:3 and 3:4 aspect ratios. These are greeting cards that have both landscape and portrait orientation. I've tried everything in image and product settings. I have another website twochaircat.com where I didn't have this issue. I'm building this new site using 7.1. Hopefully someone will have some advice or tips on how this can work.
-
Hi there, Under site styles > Products: Gallery > Aspect ratio, I want all of my images to have a 1:1 ratio except for one collection, I want to apply a different aspect ratio (4:3). Can anyone help me with code to have a different image aspect ratio for a collection of products? Thank you so much!- 8 replies
-
- 1
-
-
- custom
- header code
- (and 2 more)
-
Site URL: https://endive-denim-89ds.squarespace.com/hotels pw: 1404-Hello Hi all! On the "/hotels" page, the images look great on desktop, but the portrait images take too much space on mobile compared to the landscape images. I would like to force all image blocks to look like squares on mobile. Do y'all have any idea on how to do that? Best
-
Changing image/gif aspect ratio while viewing on mobile
ImriAgmon posted a question in Coding and Customization
Site URL: https://imriagmon.com/ Hello! I'm looking to modify the first image on my homescreen so it would appear wide (full size) on desktop and be cropped to a square on mobile. (exactly as it is on this reference website: www.ezracohen.tv) Right now it's a simple image with text embeded on it but I plan on using an image block poster, so the text would respond to different screen sizes. Is there any css code I can embed to replicate what's seen on the reference? Thank you in advance, Imri- 3 replies
-
- 1
-
-
- css
- custom-css
- (and 3 more)
-
Is there a way through CSS to change the Aspect Ratio for a specific grid style layout gallery page in my Brine template? Important to note that I have multiple grid layout gallery pages on my site, and do not want to change all of them across the board, but rather use CSS to target a specific gallery only, and leave the others untouched through the site styles settings. Appreciate any assistance that can be offered here. Thanks! -
Change aspect ratio of product by category?
NateJonesDesign posted a question in Coding and Customization
Currently editing my 7.0 site with the Jones preview template, so its not live yet. I have two products I'm selling, posters and stickers, and I enjoy the look of the selected aspect ratio for one, but would very much like to alter the look of the "stickers" category. I realize this may mean I need to target individual product item slides in the css, just didn't know if there was a way to target tagged categories? If not that's fine too. -
Site URL: http://philipstewart.squarespace.com Hi, I would like to display my images in their original sizes/aspect ratio. At the moment, I can only select one aspect ratio for all the shop's thumbnail images, which at the moment is "1:1 square". Is it possible to have these set to auto so that if it's a vertical/horizontal/square image, the thumbnail will display as that aspect ratio. I would also like when selecting an image/product from the shop to have the image in it's original size. Again, there is just one standard to set for all products where my products/images can be all
-
Site URL: https://arugula-lychee-4rxg.squarespace.com/config/pages/5f77bae93eaedf59be54e9d1 -
Site URL: http://ruspoli.photography.com Hi everyone! I've a huge issue concerning the aspect ratio on the lightbox previews of the products I sell. To better explain : I click on FOTO section (aka my shop online). Each photo has a different aspect ratio so I've tried to mantain it on the desktop version by adding Product Blocks. so far, the desktop version has no problem. The mobile version, on the contrary, doesn't respect the original aspect ratio of each photo. E.G. By clicking on photo #5 (horizonal), you'll see that the previw and the lightbox show a CUT IMAGINE!!! -
Changing Aspect Ratio of Banner Video for Mobile
DanLens posted a question in Coding and Customization
Site URL: https://www.lensflair.org/ My banner video plays normally on desktop but when viewed on mobile there is a crop on both sides of the screen. Does anyone have an idea on how i can make it conform to mobile (scale to fit screen size) instead of cropping it out? Or is it possible to have 2 different videos for mobile and desktop view. Thank you so much, ive been breaking my head over this. Cheers -
Site URL: https://www.heartworkarts.com I have artwork for sale on my site that are all different sizes. It looks great on desktop, but some get cropped on mobile view. There is no one aspect ratio that will work for all of my images. Is there a way with custom coding to format each individual product page with its own aspect ratio, so I can have many different sized images show without being cropped? Thank you! -
Hi all, In Design -> Product Items -> Aspect Ratio it gives you just a single option. The problem that I'm having is that some images on a website i'm building are (generally) either 4:3 or 3:2, shot natively on different cameras. Is there a better way to address this so images maintain their original aspect ratio and don't follow this setting? I found this post and some code: .summary-thumbnail-image.loaded { object-fit: contain !important; object-position: top; width: 100% !important; height: 100% !important; position: static !important; padding-
-
Hello! I'm new to using Squarespace, but multiple searches have come up empty in relevance to my issue: I'm on Squarespace 7.1 and I'd like to change the aspect ratio being used on my image in my Image Block. The design it's in is 'Inline.' I tried cropping the image on my own and re-uploading so it already had the desired aspect ratio, but once I hit 'Save' it just reverts back to a narrower aspect ratio. I looked in 'Image Blocks' under 'Design' to see if I could adjust it here, as suggested by the official Squarespace help pages, but there's nothing here about 'Inline' - and ther
-
I am looking to be able to have photos of my products for the 'shop' section of my site in two differing aspect ratios. I have both vertical and horizontal images and don't want to have to choose one aspect ratio. Doing so crops half of my products in an unflattering way. There is no way to retake the photos in all the same aspect ratio. As ceramic work, all products tend to need different aspect ratios. Does anyone know of a custom CSS that will help this? I am using the Ventura template which does not have the Advanced Product page. Thanks! -
Hey, I am building a website for my film-making business. I have a grid of videos on the home page. Each video links to a Vimeo link. Some of these videos links are 2.40:1 aspect ratio and others are 16:9 aspect ratio. I'd like all of the thumbnails to be 16:9 aspect ratio regardless of what the aspect ratio of the film is. At the moment, the aspect ratio of the thumbnail changes according to the aspect ratio of the video in the Vimeo link. Version 7.0– Brine family (Foster Juice Co. template) Many thanks, Will
-
Site URL: https://www.wonderingpeople.com/cheri-smith Hi there, Please can someone help me! I have added in 'Quick View' to my products. However when I click on this the lightbox opens up and it crops the image which I am wanting to view. Rather than automatically cropping it to the actual image size it makes it into a square. Is there a way around this? I think we need to code - please can someone provide me with the code or help! Thanks so much!
-
Site URL: https://okra-grouper-m4cl.squarespace.com/ PW: Noord I use two different shops on one page under SQS 7.1. The images should have different settings regarding the aspect ratio, but the setting always refers to both shops. Can I intervene here or can I switch off the aspect ration under Product items? The page is https://okra-grouper-m4cl.squarespace.com/ (PW: Noord)
-
Site URL: https://belwooddesigns.com I have some images for products that are portrait and some that are landscaped. Some look good on mobile and some that are cropped out like crazy. Is there any way to make changes on each product in the design tab? I noticed when I make a change it changes them all? I supposed I can delete the Items block on the store page and sit there listing them one by one with product blocks which would kinda suck. You can see an example of what I mean below with the original item. I'm not super familiar with editing the CSS if thats the only fix but I -
Site URL: https://www.thislandisdigital.com/ Context: I've spent some time trying to apply a custom grid layout to my index so that I can highlight certain projects with double sized thumbnails. To do this I followed this tutorial which targets an index: gallery block from a different template rather than the standard index I have available in Avenue (not sure if the scaling is different because of this). I was able to successfully assign an area to each of the index thumbnails and arrange them the way I wanted using grid-template-areas with one main issue. Problem: The thumbnails are -
Site URL: https://jasonwyates.squarespace.com/short-films Hi, I'm putting together a page of video samples. It's a gallery of YouTube videos embedded in a page. (using the "Stacked" design option) For some reason, one of the videos ("Cloyd" - the third one down) is showing up as 4:3 instead of 16:9. Everything else is functioning correctly. Its confusing, because both the original YouTube video, as well as the thumbnail image are 16:9. I even tried using the image editor to re-crop the thumbnail to 16:9 to be sure. Is there a setting somewhere I'm missing? I don't see a
-
I have two different photos side by side of different items. The left item photo is perfect--it shows the entire item. The right photo is the irritating close up of part of the item in the photo. I understand this is an aspect ratio problem for the second photo. I double click on the right closeup photo. I click on Image Editor, then crop. The closest best look for the item in the photo is 5:4. But now the entire photo is larger than the first photo, but in a horizontal way. So I now go back to the first photo, which is smaller. I click on Image Editor, then crop. I chose 5:4, then A -
I have square product images on one product page (cd covers) but would like 2:3 standard (vertical) on a different product page (sheet music). Is that possible? Using 7.1
-
Site URL: https://bananastand.store/shop Having a problem with a container created via Windows 10. Could someone help assist with apply Css for windows specific? The container ratio seems to be working fine via Android, Iphone, Mac. Not sure about Desktop via Windows. Not sure if there is a specific responsive css code? .drawer-nav { z-index: 999999; width: 18.65rem; } .drawer--right .drawer-nav { right: -21.25rem; } .drawer--right.drawer-open .drawer-hamburger { right: 18.25rem; } .drawer.drawer--right button.drawer-toggle {
-
Site URL: https://monarchdesignint.com/door-styles/rt1tmo9ipkudgygh0kc9cxr4wzet0j My product images are relatively long and narrow. The aspect ratios provided still crop some of the bottom of the image. I'm only able to have them fully displayed in "stacked" but I want to have them show in the "slideshow" option. Not sure how to do this and not experienced with code injections. https://monarchdesignint.com/door-styles/rt1tmo9ipkudgygh0kc9cxr4wzet0j password: monarch1
-
Hello. I'm using the Miller template and I'm not a seasoned coder by any means, yet I've made a concerted effort to solve this on my own with no success. I'm seeking guidance on how to create css or java script code that will allow me to override the aspect-ratio handle for a specific gallery page that's featuring one image. The image is 16:9, yet the Miller template is using code that's forcing the image to be cropped to a square from edge to edge when viewed. I don't want to use the global aspect-ratio handle to resolve this as the other gallery pages are perfect as they are. I've t
