> ## Content Index
> Fetch the complete content index at: https://getpublii.com/dev/llms.txt
> Use this file to discover other available public pages before exploring further.

# Dynamic assets

- URL: https://getpublii.com/dev/dynamic-assets/
- Published: 2022-03-22T16:56:38.997Z
- Updated: 2022-03-22T17:28:15.319Z
- Description: As themes are getting more and more complicated, we need to way of excluding some theme files from sync. That's why in Publii v.0.39 we…
- Author: Tomasz Dziuda
- Tags: Guides

As themes are getting more and more complicated, we need to way of excluding some theme files from sync. That's why in Publii v.0.39 we have added a new feature called dynamic assets.

This feature requires to work three things:

-   option **files.useDynamicAssets** under theme **config.json** must be set to **true**
-   theme must contain file **dynamic-assets-mapping.js**
-   theme should contain **dynamic** directory under **assets** directory

## How to implement dynamic assets?

Let's analyze how it is implemented in our [Simple theme](https://marketplace.getpublii.com/themes/simple/) to handle local fonts without uploading all possible font files to the server during sync.

Under theme config.json we will find these fragments:

```javascript
"files": {
    ...
    "useDynamicAssets": true,
    ...
}
```

Option **files.useDynamicAssets** enables use of the dynamic assets at all.

Under **assets** directory we will find the following structure:

```javascript
assets
- dynamic
  - fonts
    - andadapro
      - OFL.txt
      - andadapro.woff2
    - antonio
      - OFL.txt
      - antonio.woff2
    ...
    - yanonekaffeesatz
      - OFL.txt
      - yanonekaffeesatz.woff2
      
```

It is almost 50 different fonts - uploading them during sync would be time-consuming.

That's why we create file **dynamic-assets-mapping.js** in the theme root directory, which contains a function with access to the theme configuration:

```javascript
/*
 * Generate  dynamic assets
 */

module.exports = function (themeConfig) {
   let fontBody = themeConfig.customConfig['fontBody'];
   let fontHeadings = themeConfig.customConfig['fontHeadings'];

   return [
      '/fonts/' + fontBody + '/' + fontBody + '.woff2', 
      '/fonts/' + fontHeadings + '/' + fontHeadings + '.woff2'
   ];
};
```

Above function returns a list of files from **assets/dynamic/** directory which will be deployed during sync. Other files from **assets/dynamic/** directory won't be synced.
