Skip to main content

Template Assets

Template assets are publicly accessible source files that contain the frontend code for Shoptet templates. These assets include CSS (Less), JavaScript, fonts, and icon fonts for each template.

You can find these frontend assets in the public repository on GitHub: https://github.com/shoptet/templates-assets

Information about changes in assets

Important changes or updates to the assets are communicated through Frontend News.

3rd generation of templates​

Currently, there are seven public templates of the 3rd generation. You can view them on the page https://www.shoptet.cz/sablony/ or in the list below.

You can find the template number in the class on the body element (e.g. template-11) or in the shoptet.abilities object.

List of templates​

What are assets used for?​

  • Inspiration for individual changes in templates.
  • Basis for new templates in Blank mode for Premium tariffs.
  • Development and testing of new addons.
  • Tracking smaller updates to the 3rd generation templates.

Folder Structure​

├── 00 (Assets shared between 3rd generation templates)
│   ├── css
│   │   ├── bootstrap
│   │   ├── jqueryui
│   │   ├── libs
│   │   ├── modules
│   │   ├── theme_modules
│   │   │   └── components
│   │   └── uitweaks
│   ├── fonts
│   ├── img
│   └── js
│       ├── bootstrap (External library)
│       ├── libs
│       └── modules
│
├── 07, 09, 10, 11, 12, 13, 14 (Each template contains template-specific CSS and icon font)
│   ├── css
│   │   ├── main-07.less (Main CSS file with template number)
│   │   ├── modules
│   │   ├── theme_modules
│   │   └── uitweaks
│   └── fonts
│       └── shoptet
│
└── shared
    ├── fonts (Fonts used in templates)
    ├── js
    │   ├── jqueryui (External library)
    │   ├── libs 
    │   └── modules
    └── modules

JavaScript​

All JavaScript for the 3rd generation templates is shared, but behavior may vary slightly due to shoptet.abilities. This object you can inspect in the console of browsers.

How to use the assets​

Clone the repository to your working directory:

git clone git@github.com:shoptet/templates-assets.git

Code deployment example​

Once built, you can upload the following files to your e-shop FTP in the appropriate directory:

  • build.min.js
  • main.css

For example, the paths for your CSS and JavaScript files could be:

https://cdn.myshoptet.com/usr/YOUR_WEB/user/documents/assets/main.css
https://cdn.myshoptet.com/usr/YOUR_WEB/user/documents/assets/build.min.js