AssetPreload: For better performance, prefer using the preload_tag filter.

[theycallmemakka]

Hi All,

When i do "shopify theme check", I am suggesed "AssetPreload: For better performance, prefer using the preload_tag filter." for bellow line of code:

<link rel="preload" as="font" href="{{ settings.type_body_font | font_url }}" type="font/woff2" crossorigin>

However i am unaware of how I can use preload_tag to generate this code.

If anyone has faced the same problem and have a solution, please provide me some insight.

Thanks in advance.

[RHWD]

Just in case you haven't already seen this

You'd need to ensure you add the fonts to your 'assets' folder within the theme and then insert code i.e.

{{ 'pxiByp8kv8JHgFVrLGT9Z1xlFQ.woff2' | asset_url | preload_tag: as: 'font' }}
{{ 'pxiEyp8kv8JHgFVrJJfecg.woff2' | asset_url | preload_tag: as: 'font' }}

[droplearn]

Bonjour 

Fais comme ça !

{%- unless settings.type_body_font.system? -%}

  {{ settings.type_body_font | font_url | preload_tag: as: 'font', type: 'font/woff2' }}

{%- endunless -%}

{%- unless settings.type_header_font.system? -%}

  {{ settings.type_header_font | font_url | preload_tag: as: 'font', type: 'font/woff2' }}

{%- endunless -%}