How to Use the WordPress Video Shortcode

WordPress makes it incredibly easy to embed videos directly into your posts or pages using its built-in [video] shortcode. Whether you’re hosting the video yourself or using an external URL, the shortcode provides a clean and customizable way to showcase videos on your site.

Basic Usage

Here’s the simplest way to use the video shortcode:

[video src="https://example.com/wp-content/uploads/video.mp4"][/video]

This will embed a video with the provided URL.

Adding Multiple Sources

For better browser compatibility, you can provide multiple video sources:

[video]
    [source src="https://example.com/video.mp4" type="video/mp4"]
    [source src="https://example.com/video.ogg" type="video/ogg"]
    [source src="https://example.com/video.webm" type="video/webm"]
[/video]

This ensures your video can play on different browsers that may support varying file formats.

Attributes for Customization

The [video] shortcode supports several attributes:

1. src: The source URL of the video (required if no inner sources are provided).

2. poster: The URL of an image to display before the video starts.

3. width: Sets the width of the video.

4. height: Sets the height of the video.

5. loop: Makes the video play in a loop.

6. autoplay: Starts the video automatically when the page loads.

7. preload: Defines how the video should be loaded. Options are:

   • auto: Load the entire video.

   • metadata: Load only metadata.

   • none: Do not preload.

Example with customization:

[video src="https://example.com/wp-content/uploads/video.mp4" poster="https://example.com/poster.jpg" width="640" height="360" autoplay="true" loop="true"][/video]

Adding Poster Images

Poster images are crucial for enhancing the visual appeal of your video embeds. They act as placeholders before the video is played.

Here’s how you can include a poster image:

[video src="https://example.com/video.mp4" poster="https://example.com/poster.jpg"][/video]

This will display the image located at https://example.com/poster.jpg before the video starts playing.

Self-Hosted vs. External Videos

• Self-hosted videos: Upload your video to the WordPress Media Library and use its URL in the shortcode.
• External videos: WordPress supports embedding external video URLs (e.g., YouTube or Vimeo) directly by pasting the link in the editor without the need for a shortcode.

Shortcode with Captions

You can add captions to your video by wrapping the shortcode inside the [caption] shortcode:

[caption id="" align="alignnone" width=""]
    [video src="https://example.com/wp-content/uploads/video.mp4"][/video]
    
Caption text goes here.
[/caption]

Advantages of Using Shortcodes

• Flexibility: Easily embed and configure videos.
• Compatibility: Works across all modern browsers.
• Ease of Use: No need for complex HTML or external plugins for basic functionality.

Best Practices

• Optimize videos: Compress your videos to reduce load time and improve user experience.
• Use poster images: Add a placeholder image for a professional look.
• Avoid autoplay: Not all users appreciate videos that start automatically.

Conclusion

The WordPress video shortcode is a powerful tool for embedding videos seamlessly into your site. By leveraging its attributes and options, you can create a polished and engaging video experience for your audience.

Have you tried using the video shortcode on your site? Share your experience or tips in the comments below!