Syntax
Steps
- Copy-paste the code below
- Modify the column number attribute to achieve the desired layout — see documentation for [column] shortcode
- Change the float attribute of the div’s style to right if desired
[row]
[column number="12"]
<h2>Text wrapped around the image</h2>
<div style="float: left;">
<img style="float: left; margin-right:10px;" src="IMAGE_PATH" />
</div>
<p>
Text goes here
</p>
[endcolumn]
[endrow]
Example
RENDERING
Text wrapped around the image
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer pretium augue quis nunc malesuada, sit amet sollicitudin leo viverra. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur et leo eget lorem egestas congue sed a lectus. Pellentesque interdum, dui nec ultricies consequat, ligula quam mollis dui, vel pretium eros mi vitae justo. Praesent in felis felis. Etiam ac cursus tellus. Morbi sagittis, leo eget pharetra viverra, sapien ex sollicitudin diam, a porta mi nibh quis odio. Donec in eros diam. Integer imperdiet varius mi lacinia pretium. Quisque imperdiet augue vel odio accumsan ultrices.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vivamus iaculis nisi non tincidunt lacinia. Morbi quis arcu libero. Cras eros felis, commodo non vehicula et, gravida in mi. Duis dapibus eros porttitor urna rutrum, efficitur laoreet lectus aliquet. Curabitur vel elementum magna. Ut arcu odio, sodales nec volutpat et, hendrerit et neque. Vestibulum eget vestibulum ex, at porta mauris. Cras vehicula porttitor risus, sit amet blandit risus posuere eget. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin at mauris ligula.
CODE
[row]
[column number="12"]
<h2>Text wrapped around the image</h2>
<div style="float: left;">
<img style="float: left; margin-right:10px;" src="https://www.library.illinois.edu/wp-training/wp-content/uploads/sites/23/2017/06/Chewing-Gum-300x202.jpg" alt="Chewing Gum" />
</div>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer pretium augue quis nunc malesuada, sit amet sollicitudin leo viverra. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur et leo eget lorem egestas congue sed a lectus. Pellentesque interdum, dui nec ultricies consequat, ligula quam mollis dui, vel pretium eros mi vitae justo. Praesent in felis felis. Etiam ac cursus tellus. Morbi sagittis, leo eget pharetra viverra, sapien ex sollicitudin diam, a porta mi nibh quis odio. Donec in eros diam. Integer imperdiet varius mi lacinia pretium. Quisque imperdiet augue vel odio accumsan ultrices.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vivamus iaculis nisi non tincidunt lacinia. Morbi quis arcu libero. Cras eros felis, commodo non vehicula et, gravida in mi. Duis dapibus eros porttitor urna rutrum, efficitur laoreet lectus aliquet. Curabitur vel elementum magna. Ut arcu odio, sodales nec volutpat et, hendrerit et neque. Vestibulum eget vestibulum ex, at porta mauris. Cras vehicula porttitor risus, sit amet blandit risus posuere eget. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin at mauris ligula.
</p>
[endcolumn]
[endrow]
Text NOT wrapped around the image
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer pretium augue quis nunc malesuada, sit amet sollicitudin leo viverra. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur et leo eget lorem egestas congue sed a lectus. Pellentesque interdum, dui nec ultricies consequat, ligula quam mollis dui, vel pretium eros mi vitae justo. Praesent in felis felis. Etiam ac cursus tellus. Morbi sagittis, leo eget pharetra viverra, sapien ex sollicitudin diam, a porta mi nibh quis odio. Donec in eros diam. Integer imperdiet varius mi lacinia pretium. Quisque imperdiet augue vel odio accumsan ultrices.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vivamus iaculis nisi non tincidunt lacinia. Morbi quis arcu libero. Cras eros felis, commodo non vehicula et, gravida in mi. Duis dapibus eros porttitor urna rutrum, efficitur laoreet lectus aliquet. Curabitur vel elementum magna. Ut arcu odio, sodales nec volutpat et, hendrerit et neque. Vestibulum eget vestibulum ex, at porta mauris. Cras vehicula porttitor risus, sit amet blandit risus posuere eget. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin at mauris ligula.