In this tutorial, i’ll explain how to wrap text around an image as well as how to wrap text around a video.
Both solutions involve editing the HTML for your video or image in your WordPress text editor.
Wrap Text Around Video
This requires you wrap your Youtube video embed code in a div which you can see in this Gist which uses inline CSS styles:
Here’s the result using inline style:
In the above example, the Youtube video embed code has been wrapped with:
<div style="float:left;margin-right:15px;">Youtube embed code</div>Text
Simply replace the Youtube embed code text in the above code example with your YouTube embed.
Wrap Video Embed Code in Div Class
Another method is to wrap your video embed code in a new div class and style it from your child themes style.css file using CSS.
The above example wraps the embed code in this div:
<div class="video-text-wrap">Youtube Embed Code</div>Text
Wrap Text Around Image
You can simply add the alignleft or alignright class within your images HTML for wrapping text around an image:
WordPress already includes classes with CSS for alignleft and alignright and you simply add the class to your image HTML.
In the above example, the following style has been added within the HTML of the image: