Working with assets

The subfolder Assets contains all assets of your theme. This are usually CSS, Javascript or image files but can be anything else you need, like videos, PDF files, etc.

The folder is located here:

ROOT/
  src/
    Themes/
      MyFirstTheme/
        Assets/
          /css
          /fonts
          /images
          /js

Each asset you want to use within your theme must be stored in this folder and its appropriate subfolder.

Then, you can reference these asset files in your theme using HTML code like this:

<script src="{{rootUrl}}/theme/assets/js/plugins/jquery-ui.min.js"></script>

Example: Referencing a Javascript file in the Header.twig template

<link rel="stylesheet" href="{{rootUrl}}/theme/assets/css/vendor/bootstrap.min.css">

Example: Referencing a CSS file in the Header.twig template

You should have mentioned that a {{rootUrl}} variable is used. This is the way how variables in the TWIG templating engine are used. If you do not know TWIG, you should get familiar with it as this is the engine used to create the design.

We also recommend that you read through the list of default variables available in each TWIG template.

Surikata
E-commerce development framework