Published on Apr 2, 2020

Lazy Loading Videos in Oxygen

Sridhar Katakam

If you are looking to replace resource-heavy iframe embeds of YouTube or Vimeo added in the Oxygen editor with a lightweight click-the-thumbnail-to-load-video kind of solution, Velocity is one way to set this up.

Live Demo

Step 1

Install and activate Velocity.

Go to Settings > Velocity > Velocity Builder to generate the shortcode for a YouTube/Vimeo video embed.

Paste your video ID and upload/select the image.

Images for YouTube videos can be downloaded from here.

Copy the generated shortcode.

Step 2

In the Oxygen editor, add a Shortcode Component.

Advanced > Size & Spacing > Width: 100%

Paste the shortcode.

If you want to put the shortcode in the WordPress Gutenberg editor, use a Shortcode block.

tagschevron-leftchevron-rightchainangle-rightangle-upangle-downfolder-ocalendar-check-omagnifiercrossmenuchevron-downarrow-right