cdn_asset
Calls a hosted asset from the Neto CDN or a 3rd Party CDN
Neto CDN
Return the Lightbox Javascript library from the Neto CDN:
[%cdn_asset html:'1' type:'js' library:'lightbox' version:'2.10.1'%]js/lightbox.min.js[%/cdn_asset%]Return the Neto Default Product image from the Neto CDN:
[%cdn_asset html:'0' library:'images'%]default_product.gif[%/cdn_asset%]Output results
Lightbox Javascript library:
<script type="text/javascript" src="https://cdn.neto.com.au/assets/neto-cdn/lightbox/2.10.1/js/lightbox.min.js"></script>Default Product image:
https://cdn.neto.com.au/assets/neto-cdn/images/default_product.gifFor a full list of available Neto CDN assets see the Options table below
3rd Party CDN
Return the Font Awesome Icon CSS library from the Font Awesome CDN:
[%cdn_asset html:'1' type:'css' domain:'use.fontawesome.com/releases' library:'' version:'v5.7.2'%]css/all.css[%/cdn_asset%]Output results
Font Awesome Icon library:
<link rel="stylesheet" type="text/css" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" media="all"/>All Neto themes utilise the Font Awesome Icon Library, so for consistency we include it via the CDN Asset tag. While this is not required, you can also insert other 3rd Party CDN assets this way. For example, if you were to implement the Slick Carousel plugin this could be done by either downloading the library source files and adding these to your theme folder to later reference in your code.
Or, you can reference the hosted jsDelivr versions directly in your code as needed.
CSS
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.css"/>JS
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script> These URLs can be generated through the Neto CDN Asset tag as follows:
CSS
[%cdn_asset html:'1' type:'css' domain:'cdn.jsdelivr.net/npm/slick-carousel@1.8.1' library:'slick' version:''%]slick.min.css[%/cdn_asset%]JS
[%cdn_asset html:'1' type:'js' domain:'cdn.jsdelivr.net/npm/slick-carousel@1.8.1' library:'slick' version:''%]slick.min.js[%/cdn_asset%] Either method is a valid way to add hosted assets to your theme templates. Need finer control over the script or link attributes? You may want to include the tags directly as per the first example so you can add additional attributes (such as deferring or prefetching). Happy with the URL 'as is' then you can include it in the CDN Asset tag to keep hosted assets consistent within your theme code.
Usage
The CDN Asset tag will load either a CSS file, a JS file, or default image from a hosted location based on the specified parameters
Parameters
| Name | Options | Description |
|---|---|---|
| `html:''` | `1` / `0` | A boolean that when true (1) will return a script OR link tag for the hosted asset depending on the `type` param. When set false (0) will return just the link to the hosted asset |
| `type:''` | `css`, `js` | Dictates whether the resulting HTML will be a `script` tag or `link` tag. Only applies if `html:'1'`. Defaults to `js` |
| `domain:''` | URL | Uses `//cdn.neto.com.au/assets/neto-cdn` as a default, this determines the base domain to load the asset from. Beginning http: OR https: will be removed if they are in the domain. Ending backslashes ('/') will also be removed. |
| `library:''` | String | The resource you wish to load from the Neto CDN and the third last section of the hosted URL, this is generally not required if using a custom `domain` value. |
| `version:''` | String | The version of the resource you wish to load from the Neto CDN and the second last section in the hosted URL, this is generally not required if using a custom `domain` value. |