Image and a text box side-by-side using tables
When using the Shopify Page or Blog editor, you can use a single row table to display an image and text side-by-side.
Result:
Use the table option in the toolbar:
Choose Insert table:
Then, use the toolbar icon again to add another column:
You'll have two columns now:
Add your content - Use the picture icon for an image and in the other column, add your text.
Next, you can use the HTML view icon (code view) to tweak the table code:
Modify the code so that your column widths are the size you'd like:
Here is sample code where I've made the image column 40% wide and the text column 60% wide:
<div> <table style="width: 100%;"> <tbody> <tr> <td style="width: 40%;"> <img src="//cdn.shopify.com/s/files/1/1961/3139/files/DF_Laptop_medium.png?v=1505153623" alt="online interior design" /></td> <td style="width: 60%;"> <p>Orangetree Interiors is an online interior decorating boutique that focuses on helping busy people across North America create inspired interior spaces in an easy, convenient and efficient way. </p> <p>Between work, taking care of family, appointments, activities and social obligations, it's hard to get much else done. Never mind finding the time to interview and meet up with a selection of interior designers or decorators to help re-fresh or create a new space. Our unique approach to interior decorating allows you to communicate with us easily and conveniently so that you can stay focused on what’s truly important.</p> </td> </tr> </tbody> </table> </div>