Adding async attribute to scripts tags generated by {{ script_tag }}

Highlighted
Excursionist
12 0 17

Hi guys,

Trying to get certain scripts on my site to load asynchronously to hopefully improve page load times.  A couple of scripts in the theme are being generated like this:

{{ 'example.js' | asset_url | script_tag }}

This means I can't just add the "async" within the tags as I would normally.  Is there a way to have the tags generated so they will load asynchronously?  The image_tag filter allows you to add additional parameters for alt text, I wondered if there was anything like this for script_tag maybe?

Thanks!

1 Like
Highlighted
Shopify Staff
Shopify Staff
5704 1 326

Hi Fiona!

Change this:

{{ 'example.js' | asset_url | script_tag }}

... to that:

<script src="{{ 'example.js' | asset_url }}" async></script>

 

2 Likes
Highlighted
Excursionist
12 0 17

Thanks Caroline, that's perfect!

0 Likes
Highlighted
New Member
3 0 0

Hi Caroline,

 

All perfect. But, the arrtibute "async is also printed on my screen. How to resolve this?

 

Many thanks in advance.

 

Regards,

Manoon

0 Likes
Highlighted
New Member
1 0 0

hey but it breaks some functionality of my website, for example the products are not loading on the product page 

0 Likes