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

Search the Community

Showing results for tags 'aspect-ratio'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Selling & Scheduling Your Services
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
    • Resources
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion
  • German Circle Members's Topics

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me




Expert ID

  1. 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.
  2. Site URL: https://www.maomiyakoshi.com/ Hi, I am creating the styling portfolio website. Is there any way I can use a different aspect ratio for each page? I would like to keep 3:4 (vertical) for fashion page, and 16:9 Widescreen for Moving image. If anyway could help me, it's much appreciated x Thank you so much! Website: https://www.maomiyakoshi.com/ Password: maomiyakoshi Fashion page ( 3:4 (vertical) ) https://www.maomiyakoshi.com/fashion Moving images ( 16:9 Widescreen ) https://www.maomiyakoshi.com/moving-images
  3. Site URL: https://www.mannyazinge.com/motion-graphics-animation I'm trying to customize a portfolio page on my site with CSS, so the grid has project thumbnails with independent aspect ratios. To clarify, they are all the same ratio, which is standard, but I want them to be independent. Also, I'm targeting a specific page on my site only for the desktop breakpoint. All responsive behavior and ratios elsewhere should otherwise remain the same. The portfolio page I'm referring to currently looks like this: But I want it to look like this: Also, I would like the aspect ratios to stay the same on mobile so they remain stacked: How do I accomplish this?
  4. Site URL: https://www.clic.com/ Hi, I have been having an issue with this site that I can't seem to find an ideal solution to. There are many product pages with different types of products that all have different dimensions of images. Some are artworks that cannot be cropped and are mostly horizontal while some are products that are mostly vertical. Having all images at the same aspect ratio while also having the slideshow gallery option (rather than stacked) causes some of the artworks to be cut off on the checkout page. I tried adding in some css to solve this. This is what I used: .ProductItem-gallery-slides-item-image { object-fit: contain !important; object-position: middle; width: 100% !important; height: 100% !important; position: static !important;} .tweak-product-item-gallery-aspect-ratio-34-three-four-vertical .ProductItem-gallery-slides::before { padding-bottom: 0 !important;} .tweak-product-item-gallery-design-slideshow .ProductItem-gallery-slides-item { position: relative !important;} This did successfully stop images from being cut off on the checkout page, but some of the images show up too large and were blurry. It also created an issue with the slideshow gallery of secondary product images (they showed up with a large gap underneath the main image rather than directly underneath). I removed the code and right now am temporarily using the stacked option, but this isn't ideal and some images are still too big on the checkout page. Here are examples of this issue: https://www.clic.com/art-books/picasso-sculpture https://www.clic.com/love-tanjane/raw-pleat-collar-dress-in-army-from-love-tanjane Is there a way to assign different aspect ratios to different pages of the site without any images cutting off, without images being too big/blurry, and with still being able to use the slideshow option? Thank you!
  5. Site URL: https://adrianrydz.squarespace.com/shop I have one of the last main problems to fix before publishing my page. I would like to have all my product images in original aspect ratio in my store page (MOBILE AND DESKTOP). I would like to offer some prints in landscape orientation, and others in portrait orientation without cropping. I am aware of creating Product Blocks to create a custom online store layout with product blogs on a different page, and then hiding the Store Page by moving it to the not linked section of the Pages panel. And honestly so I did, however I am not happy with custom online store layout, so I would rather stay with ORGINAL STORE PAGE. May I ask anyone to help me to fix this problem... PASSWORD... yumichan
  6. Any ideas on how to individually resize the images on my product page? For whatever reason Squarespace will only allow the user to select 1 specific aspect ratio, for all products. I'm trying to develop a website for selling photos, and photos come in all shapes and sizes. Picking one aspect ratio results in some images/products being cropped. I've already setup my "Store" using the product photo option (which allows for custom aspect ratios), and then unlinking my official product page. However, when the customer clicks on the photo they want to buy, the page updates to the official product page photo, which is cropped to the wrong aspect ratio. It appears my only option is to inject CSS code (per Squarespace IT), which I know nothing about. However, when I look at the FAQs on that potential solution, it specifically says to NOT use CSS to change image sizing. If I cannot fix this issue, it's a dealbreaker for me to use Squarespace as my web host. Hoping someone has an idea on how I can move forward. Thanks, Max
  7. Site URL: http://markbagallyart61.squarespace.com Hi there - I've put together a flipbook on the Heyzine site and embedded it into my website. That's all good however it's actually too small and I'd like to enlarge/expand it so it fills more of the page. Any suggestions?
  8. Site URL: https://wocostudios.com/bellehumeur-co Hello, I am trying to understand how these 7.1 sections work, and I am a bit confused on how to get the image at the top of the page to scale down rather than crop in from desktop --> mobile So the mobile view and desktop view (good) screenshots are what I am going for. My challenge is, in order to get the mobile to look like that I have to make the section height "Small" which results in the desktop view (bad) screenshot I attached. Is there a way to have this particular section header scale down rather than crop in when it goes from Desktop --> Mobile? Additionally, (not sure if I need a separate post for this, if so not a problem to make one)
  9. Site URL: https://www.euphonichealth.com Hello, I am having issues with the following pages when viewing my site on a tablet; https://www.euphonichealth.com/coaching-enquiry-form - text at the top of the pricing table is getting pushed to the right. Is it possible to centre this as it is on mobile and desktop? https://www.euphonichealth.com/coaching - In the section titled 'who is it for?' (https://www.euphonichealth.com/who-is-it-for) the text is bleeding out of the black box. Is there a way to reduce the font size just for tablet to make it fit? Thanks in advance, Patrick
  10. Site URL: https://darkballaddesigns.com/shop-all/art Hello, Can someone please help me with code to make my pictures each appear in their original aspect ratio on both desktop and mobile? Im aware this isnt a default option but since i sell artwork on my page, i need pictures to appear in many different shapes and sizes. I need this to work on the 'Shop all', 'Art' pages and i also need it on the page after you click on the thumbnail. As it is at the moment, all picturee are in portrait but that doesnt work for me. Any help appreciated. Cheers.
  11. Site URL: https://darkballaddesigns.com/shop-all/art Hello, After getting help with code to make my product pictures into to their original aspect ratio and sizes i have found that the titles and prices etc for the products are far too low and far away from the pictures. I have attached pictures for desktop and mobile so you can see what I mean. Is there a way to keep the original aspect ratio fix AND have the text closer underneath the product pictures? This is affecting both desktop and mobile. Thanks
  12. Site URL: https://www.socialdrivingacademy.co.nz/ Hi everyone First time user of this forum. it looks like this question's been asked a number of times but I've got website icon images on my site which aren't resizing for mobile on homepage. There is CSS code on the site that resizes the icons on other pages but it looks like the code for the home page is referencing other blocks. How do I identify the block ID (yui?) Homepage Driving Lessons page Thanks Muneeb
  13. Site URL: https://adrianrydz.squarespace.com/shopartproduct/p/tokyo-sign-dj4tp Hello to everyone, I am sorry for asking again. I have my prints in landscape and portrait orientations so I came across serious problems with an aspect-ratio of product images like many other users here (yeah, I read lots of posts about it). I found out by myself a solution for this problem in DESKTOP so other users could apply to their webs too. You need to choose FORMAT- DESIGN - STACK. It makes all product images stacked in the orientations of your picture. No matter which one it is. However, this solution not working for MOBILE. I used a code rule wrote by the incredible @tuanphan and @bangank36... and it solves a problem with orientation but leaves a HUGE space above and below landscape pictures. May I ask for any solution for it? PASSWORD... yumichan
  14. Site URL: https://www.jlbequine.co.uk Hello \o. First time posting here, I've started a website to sell my photos, I've set the aspect ratio to wide (most of my photos are landscape) however when I uploaded a few portrait photos i noticed half the image gets cut off, I've asked squarespace for help and was sent here, i have no idea how to code or even where to get started, call me a virgin. can anyone have a look and see if they could help me with this at all. i need there to be a mixture of landscape and portrate aspects depending on if the photo is landscape or portrait. i wont sell a photo if half the image is cut off. I'm happy to provide whatever i can to help
  15. Site URL: https://asanchez-art.com/ Hello! If theres a better sub-forum for this question please let me know. As you can see in the attatched, my landing page image doesn't keep center going from mobile to desktop and its driving me crazy. I have created the image to be on center where the two images meet, to be split between the two buttons. Alternatively, would it be easier to just push those buttons away from eachother, and if so how could I achieve that? site password is cubecosmos if that is needed
  16. Site URL: https://www.wadjemupdreaming.com.au/landscape Hey guys, it would appear theres a flaw in Squarespace keeping you from applying product image aspect ratios separately between shop collections. I sell my photos in panoramic, regular landscape, and vertical panoramic formats, with a different shop page for each. I'd like to have the panoramic shop products view in 16:9 (or even the anamorphic 2.4:1?), the landscapes in 3:2, and the vertical panoramas in vertical 2:3 Currently I have the panoramic and vertical panoramic shop pages in the not linked section, with regular galleries created for those images, which you can then click through to view in the shop. It's most definitely a clunky workaround fix for now, being able to apply different product image aspect ratios between shop pages would fix this for me. Any help for custom code to have each shop view it's images in their native format? Thanks a bunch legends. Cale.
  17. Site URL: https://elianacaserio.com/ Hi, I would like to reposition and resize image and text of a banner for the mobile version, is that possible and does anyone know how to do this? If code is needed, what is the code to use? Thanks for your help
  18. Hey everyone! I have my logo ready for my brand but whenever I add it to my header on the site it's absolutely tiny. I just don't know how to go about optimising it so that it appears bigger on the site. Hope this makes sense, thanks.
  19. Hi, I just finished my first UX design case study in Figma and would like to start building a portfolio. The case study consists of 30 jpgs (I produced these for Behance). All images have the same width, 1400 px, but different lengths (the longest has a lengths of 5215 px). I tried uploading the images to Squarespace 1. one by one and 2. as one big combined jpeg, but I always ended up having cropped dimensions. Is there any way to import this case study or would I need to re-build the whole thing in Squarespace? I don't want to add a link to the Behance site. Thanks!
  20. Site URL: https://venturaaviationusa.squarespace.com/ I've run into this a few times in designing sites. I need to change either the aspects ratio or fixed height of galleries in mobile. On desktop my images look fine, but in mobile I need to adjust the aspect ration or fixed height so I can see the entire image as needed. (see attached images for preview of desktop vs mobile) Site is still set to private viewing only. Password is VABC2021 if you need to view.
  21. Site URL: https://www.tammyrobinson.net/gallery Hello, I'm creating a website for an artist but unfortunately the gallery page forces me to choose an aspect ratio (currently set to "ultra widescreen") for all images to adhere to. This crops a lot of fine detail out of her work and doesn't do the images justice - check out the comparison images below. I am using Squarespace 7.1. Can anyone figure out some custom CSS I could inject to disable the autocropping feature in the gallery? There is no option for me to disable it otherwise. Or any advice in general works. Thanks so much
  22. On the template I'm using gallery grids appear in 2 columns for desktop view and stay in these 2 columns when in mobile view. As you can see in the screenshot, I need the two columns to stack in columns of 1 when in mobile view, so that the content is more visable, how do I change this so its different for both screens please?
  23. Site URL: http://www.electricalaudio.com We are creating a list of equipment, and have separated the categories into different stores. For one store, where the items are typically vertical, 2:3 aspect ratio is ideal, for another ultra-widescreen would be best, but for another two or three standard 4:3 would be ideal. If I change the image aspect ratio on one store, it changes across all stores. I think I can do this with some html injection on the store's pages, and I think the class I need to operate on is "ProductItem-gallery-slides, I'm just not sure what property/ value to change. Any help is appreciated. The stores are electricalaudio.com/pedals-1 (2:3) and electricalaudio.com/instruments-1 (4:3).
  24. Site URL: http://brittsypetportraits.com How can I adjust products to display in their appropriate aspect ratio? My paintings are horizontal, vertical or square. I tried custom code mentioned by someone else but it does not work. Not sure what I’m doing wrong! I don’t know anything about code but I tried what someone on forum said. Please help! Britt
  25. Hello, I was wondering if its possible to keep a 3:2 image ratio on computer screens but for mobile phones and iPad/tablet use CSS to force a square gallery? Thank you
  • Create New...