File structure

Within this theme you’ll find the following directories and files, grouping common resources and providing both compiled and minified distribution files, as well as raw source files.

Contents

What’s great about Boomerang is that you have everything you need in one place. It is very simple and easy to understand. All styles, images, javascript and other third-party plugins are stored within the assets folder, while the page templates are stored within the pages folder.

Page templates

pages is where all HTML pages are stored. Use any of these to start building your website. Everything is exactly as see in the live preview.

Each page is named after its purpose so it can be easy for you to find the one you need. You can open it directly in your browser or your favorite editor to modify its contents.

Assets

assets contains all of the assets that will be used in the html pages, from CSS and JS to images and third party plugins. Below we will explain more in detail what each one does.

SCSS

assets/scss contains all of raw source files that are used to create the final CSS that is included in the theme. The SCSS is structured as follows:

  • bootstrap contains all the source files included in the official Bootstrap package (4.0.0). This way, you will use a single unified stylesheet that contains all styles. We will update it as long as Bootstrap releases new versions.
  • mixins contains overriden or new mixins used for grouping CSS declarations for reuse throughout our theme.
  • utilities contains all the source files responsable for spacing, fonts, colors and other quick modifier classes that can be used within our theme.
  • _variables.scss contains all SCSS variables used to override default values that Bootstrap provides.
  • _custom.scss is a file specially created for you, the user, in order to override SCSS variables and styles or add new ones.
  • theme.scss unifies all the components, utilities and mixins that are compiled in a single file that will be used as a stylesheet within our theme.

CSS

assets/css contains the minified and uncompressed CSS resulted from the SCSS files, including Bootstrap.

  • theme.css
  • theme.min.css

JS

assets/js contains all of the assets referenced in the html pages.

  • bootstrap contains all the javascript files included in the official Bootstrap package (4.0.0). We will update it as long as Bootstrap releases new versions.
  • theme.js contains all the custom plugins and additional scripts included in Boomerang.
  • theme.min.js is the minified version of theme.js that should be included in your website.

Vendor

assets/vendor contains all of the third party plugins used in the entire project. You can see what we used in the dedicated page for plugins.