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>

Still need help? Contact Us Contact Us