- This topic has 8 replies, 2 voices, and was last updated 3 years, 7 months ago by Andrew Misplon.
- AuthorPosts
- March 17, 2021 at 9:08 pm #15482
ememkParticipantIs there a way to set the width and height of the video block in the page code editor? The size of the video (mp4) is too large and I would like to change the width and height. I know how to do it with Youtube embeds, but not in the code editor that looks like this:
<!– wp:video {“id”:2945} –>
<figure class=”wp-block-video”><video controls src=”http://websitename.com/wp-content/uploads/2021/03/videoname.mp4″></video></figure>
<!– /wp:video –>I want the video to be at most width=”560″ height=”315″
Do I need to adjust it using CSS? I tried:
.stackItem {
width: 50%;
height: 50%;
}I tried:
.stackItem {
max-width: 560px;
max-height: 315px;
}Neither worked
March 18, 2021 at 10:05 am #15483
Andrew MisplonKeymasterHi, thanks for reaching out.
I’m not sure about the Block Editor. It’s possible to set the width and height using the video shortcode as seen here https://www.ostraining.com/blog/wordpress/video-size/.
March 18, 2021 at 8:41 pm #15484
ememkParticipantI used the shortcode block and input the information in the way recommended in the link you posted, but the video doesn’t display live. Here is what I put into both an HTML block and in a shortcode block and neither worked.
[video width="560" height="315" http://websitename.com/wp-content/uploads/2021/03/videoname.mp4%5D
We don’t want to embed a Youtube video (where I can set the size in the html) since it always shows ads and other video options we cannot control when the video completes.
March 18, 2021 at 8:43 pm #15485
ememkParticipantThe shortcode didn’t display right in my post above it actually ends .mp4] not 4%5D.
March 18, 2021 at 9:18 pm #15486
ememkParticipantI’ve put the video block within column block and then used additional CSS in the column block to set the max width and max height to meet my criteria so now the video is the right size. However, I selected the video and chose to center it, but it isn’t centering it live. Any ideas on how to fix that?
March 18, 2021 at 9:33 pm #15487
ememkParticipantThis reply has been marked as private.March 19, 2021 at 9:44 am #15489
Andrew MisplonKeymasterThanks. You can perhaps try in Appearance > Custom CSS or Customize > Additional CSS:
.videocol { margin: 0 auto; }
March 19, 2021 at 2:03 pm #15491
ememkParticipantThat worked! Thank you!
March 20, 2021 at 10:50 am #15495
Andrew MisplonKeymasterGlad to hear that helped 🙂
- AuthorPosts
The topic ‘Set Video Block Width and Height’ is closed to new replies.