Jump to content

Using a different aspect ratio in the different gallery page

Recommended Posts

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

Link to comment

Add to Moving Images Page Header

<style>
  .tweak-portfolio-grid-overlay-image-aspect-ratio-34-three-four-vertical .portfolio-grid-overlay .grid-image, .tweak-portfolio-grid-overlay-image-aspect-ratio-34-three-four-vertical .portfolio-grid-overlay .grid-item {
    padding-bottom: 56.25% !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
18 hours ago, PMX said:

Hi, I am having the same issue as you @Mao325 I have tried adding the code to the page header but nothing seems to happen!? am I missing something?

Thanks (¬‿¬ )

If you use default setting is 3:4, you can use above code to change to 16:9

if you use another default ratio, above code won'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
  • 2 months later...
On 2/19/2021 at 2:44 PM, tuanphan said:

If you use default setting is 3:4, you can use above code to change to 16:9

if you use another default ratio, above code won't work.

What would the could be for default setting 1:1 and change it to 3:4 aspect ratio?

Link to comment
On 5/12/2021 at 8:04 PM, Christiaan said:

What would the could be for default setting 1:1 and change it to 3:4 aspect ratio?

133.333%

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
  • 6 months later...
On 11/26/2021 at 9:41 PM, kasiakalasia said:

Hello! I'm facing the same problem... What a shame. What code should I use if I have a default aspect ratio 4:3 and I would like to change to 1:1?

Try this

<style>
.portfolio-grid-overlay .grid-image, .portfolio-grid-overlay .grid-item {
    padding-bottom: 100% !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
On 12/2/2021 at 4:26 PM, kasiakalasia said:

Thank you @tuanphan. Where should I post it? 

Add to Page Header (Page where you want to change aspect ratio)

If you use Personal Plan, please share page url, we can tweak the code 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
  • 3 weeks later...
On 12/20/2021 at 12:02 AM, AMenin said:

@tuanphan

 

Hi,

I am looking to have one gallery page with a 2:3 aspect ratio, and a second gallery page with 3:2.

How should I go about this? At the moment if I change one ratio, it changes both.

(I have a personal plan)

Site is unpublished at the moment so I can't share links.


Thanks

A

Hi. If the site is private/trial, you can setup password & share url

You can setup 1:3 in general setting, then share link to second gallery, we will give the code to change it to 3:2

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
  • 9 months later...

Create an account or sign in to comment

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

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.