4 – Images and Fonts


It is recommended to store template image assets in your theme directory:


Ideally other images should be managed through the Media Library of WordPress. Try to only store SVG or minimal assets in your theme directory to keep the template as light as possible.

In the production build SVGs and other image assets will go through a minification process.


Fonts are always special. Your fonts should be stored in:


Then you can include them in your CSS:

@font-face {
    font-family: 'Helvetica Neue Thin';
    src: url('./fonts/Helvetica-Neue-Thin.eot?#iefix');
    src: url('./fonts/Helvetica-Neue-Thin.eot?#iefix') format('eot'),
    url('./fonts/Helvetica-Neue-Thin.woff2') format('woff2'),
    url('./fonts/Helvetica-Neue-Thin.woff') format('woff'),
    url('./fonts/Helvetica-Neue-Thin.ttf') format('truetype'),
    url('./fonts/Helvetica-Neue-Thin.svg#e3b7d1e7c160') format('svg');

Continue to:
5 – ES6 JavaScript