Video Block

Description

The video block allows you to display embedded videos on your site. Although it's not possible to upload videos onto Squarespace (yet), you can pull videos from YouTube and Vimeo.

Since the videos are embedded from outside sources, the controls, text, share options, and other elements inside the video player are not customizable using CSS. Those changes are usually made within YouTube or Vimeo.

You can however use these codes to design the look and feel of the player itself!

Custom CSS

For style changes across multiple pages, add the code snippet to your Custom CSS panel and each page will be updated.

Advanced Code Injection

For style changes on one page, add the code snippet to the page Advanced Code Injection so only that page will be updated. Enclose your code in style brackets like this:

<style>

.sqs-video-wrapper {
}

</style>

calm down and boogie

Custom CSS

To target the entire video player block

/* entire video player block */
.sqs-video-wrapper {
}

To target the video frame

/* video without custom thumbnail */
.sqs-video-wrapper iframe {
}

/* video with custom thumbnail */
.sqs-video-wrapper .sqs-video-overlay {
}

To target the play button over the custom thumbnail

/* video with custom thumbnail: play button */
.sqs-video-wrapper .sqs-video-overlay .sqs-video-icon {
}

To target the caption

/* video caption */
.video-caption p {
}