Ad

Proper Way On Putting Images As Sources In Assets Shopify

- 1 answer

I've been stuck in showing custom social on top of shopify theme. I tried the {{ 'icon.png' | asset_url }} but it won't display. Instead when I check the element in the browser it automatically generates a style which is display: none !important;. I don't know where or what I'm missing.

Here's my code below:

<div id="smash-social" class="grid__item medium-up--two-fifths text-right">
          <a target="_blank" rel="nofollow noreferrer" target="_blank" rel="nofollow noreferrer" href="https://www.facebook.com/link" target="_blank">
            {{ 'facebook-logo-button.png' | asset_url }}
          </a>
          <a target="_blank" rel="nofollow noreferrer" target="_blank" rel="nofollow noreferrer" href="https://twitter.com/link" target="_blank">
            {{ 'twitter-logo-button.png' | asset_url }}
          </a>
</div> 
Ad

Answer

Add the img_tag filter to generate an img HTML element complete with an alt attribute:

{{ 'facebook-logo-button.png' | asset_url | img_tag: 'facebook' }}
Ad
source: stackoverflow.com
Ad