Jump to content

CSS injection code to change the aspect ratio (to 1:1 / square) on all the videos on one specific portfolio page

Recommended Posts

Hey Team,

I'm looking to change the aspect ratio of all the videos (to square / 1:1) on one specific portfolio page - frustratingly it appears to be one that doesn't allow me to inject specific code into it.


I've read that this can be done with injected code and changing the padding but I can't work out how to specify only that page and also where to inject the code.

Any help would be ace.



Link to comment

You should be able to do this with Custom CSs targeted to that page, try this:

#item-63c02112fb60923abc4a4bc4 {
  .sqs-native-video .native-video-player {
    padding-top: 100% !important;

Let me know if that works, and give me a thumbs up if you can! Thanks!

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

@Ziggy thanks so much for the super speedy response - thumbs up from me

I dropped this in the Design custom CSS section:

#item-63c02112fb60923abc4a4bc4 .video-block {
.video-player {
padding-bottom: 45% !important

It seemed to do the trick too.

Link to comment

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.