Website Building » Shopify » How Do I Add an Image to My Shopify Code?

How Do I Add an Image to My Shopify Code?

Last updated on January 4, 2023 @ 7:23 am

Images are a great way to add visual interest to your website or blog. The HTML tag is used to embed an image into a web page. The tag has two required attributes: src and alt.

The src attribute defines the URL of the image. The alt attribute provides alternative text for the image if the image cannot be displayed. The tag also has a few optional attributes, such as height, width, and title.

To add an image to your Shopify code, you will need to use the HTML tag. First, you will need to find the URL of the image you want to use. You can do this by right-clicking on the image and selecting “Copy Image URL.”

Next, you will need to insert the URL into your code using the img tag. The final step is to add the alt attribute to your code. This attribute is important because it provides alternative text for the image if the image cannot be displayed.

Adding an Image to Your Shopify Code

1. Find the URL of the image you want to use. Then, from your Shopify editor, click Actions>Edit code.

Copy the image address you want to embed in Shopify code Click the actions and edit code button in Shopify editor

Next, click the Snippets dropdown menu and click “Add a new snippet.” This will allow you to add a custom code snippet to your Shopify store. Name your file and click Done.

Create a new custom snippet in Shopify code editor

PRO TIP: Adding an image to your Shopify code can be tricky. If you’re not careful, you may end up with broken code that doesn’t display properly on your shop’s pages. Follow these instructions carefully to avoid any problems.

2. Insert the URL into your code using the img tag and src attribute.

Add img tag with src attribute to the new Shopify liquid code snippet

3. Lastly, add the alt attribute to your code. Click “Save” to update your changes.

Add alt attribute to the img tag in the new Shopify liquid code snippet

Conclusion:

Images are a great way to add visual interest to your website or blog. To add an image to your Shopify code, you will need to use the HTML tag.

You can do this by right-clicking on the image and selecting “Copy Image URL.” Next, you will need to insert the URL into your code using the img tag.

Madison Geldart

Madison Geldart

Cloud infrastructure engineer and tech mess solver.