Skip to main content

File Structures

A guide to understanding how Bootnews is structured and organized.

Download package

Download package contains three main assets/, html/ and snippets/ folders.

Once downloaded, unzip the compressed folder and you'll see something like this:

            bootnews/
              ├── assets/
              │   ├── css/
              │   │   ├── custom.css
              │   │   ├── theme.css
              │   │   ├── theme-rtl.css
              │   ├── img/
              │   │   ├── 99x68/
              │   │   ├── 110x77/
              │   │   ├── ...
              │   ├── js/
              │   │   ├── manifest.json
              │   │   ├── theme.js
              │   │   ├── theme-rtl.js
              │   ├── scss/
              │   │   ├── variables.scss
              │   │   ├── theme.scss
              │   │   ├── custom/
              │   │   │   ├── custom-styles.scss
              │   │   │   ├── ...
              │   │   ├── theme/
              │   │   │   ├── avatar/
              │   │   │   ├── breadcrumb/
              │   │   │   ├── card/
              │   │   │   ├── ...
              │   ├── vendor/
              │   │   ├── bootstrap/
              │   │   ├── ...
              ├── dist
              │   ├── css/
              │   │   ├── bundle.min.css
              │   ├── js/
              │   │   ├── bundle.min.js
              │   ├── img/
              │   │   ├── ... 
              ├── docs/
              │   ├── index.html
              │   ├── assets/
              │   │   ├── ...
              │   ├── components/
              │   │   ├── *.html
              │   │   ├── ...
              │   ├── customization/
              │   │   ├── *.html
              │   │   ├── ...
              │   └── getting-started/
              │   │   ├── *.html
              │   │   ├── ...
              ├── html/
              │   ├── category/
              │   │   ├── *.html
              │   │   ├── ...
              │   ├── home/
              │   │   ├── *.html
              │   │   ├── ...
              │   ├── pages/
              │   │   ├── *.html
              │   │   ├── ...
              │   ├── post/
              │   │   ├── *.html
              │   │   ├── ...
              │   ├── rtl/
              │   │   ├── *.html
              │   │   ├── ...
              │── snippets/
              │   │   ├── block/
              │   │   ├── features/
              │   │   ├── widget/
              │   │   ├── ...
              └── └── └──

This is the most basic form of bootnews: precompiled files for quick drop-in usage in nearly any web project. We provide compiled CSS and JS (theme.css and theme.js), as well as compiled and minified CSS and JS (theme.min.css and theme.min.js). You also get minified bundle CSS and JS ( plugin css and js included ) bundle.min.css and bundle.min.js

HTML

html/ is the source for HTML pages and contains HTML templates, which you see in the live preview. These HTML files can be opened easily in any browser, imported to any project, or modified to suit your needs.

Assets

assets/ includes all the assets that are referenced in the HTML pages.

Precompiled versions of JavaScript and CSS files are generated in their respective assets/js/ and assets/css folders to support the self-contained 'static website'.

Below given folders are used in the template:

  • ajax - Html Source ajax
  • css - CSS and Source Maps CSS
  • img - Images
  • js - JavaScript files
  • scss - SASS folders with their files
  • vendor - Third-party libraries

Dist

dist/ includes all the production files.

Below given folders are used in the template:

  • css - Minify CSS and Source Maps CSS
  • js - Minify JS
  • img - Minify Images

Advantages

  • Avoiding the probabilities of conflicts between bootnews codes and third party plugins (libraries).
  • Intuitive clear architecture.
  • Everything is structured, each component in its own file and in its component in the main object.
  • The ability of extending functionality without affecting the behavior of the core object and not changing the existing functionality.
  • By creating wrapper components, simply solves complicated initializations structures for the users.
  • Very easy access to any starters components and core settings from anywhere in the template.