Skip to content

alesanchezr/html-template-engine

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

29 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

HTML Template Engine (live demo)

Include other files into your current file:

<!-- Include other html files into your own -->
<span require-file="./parts/footer.html"></span>

Instalation

  • Using NPM
$ npm install html-template-engine --save
  • Or using a simple script tag before your body closing tag and use the autoload feature to avoid using any Javascript whatsoever.
<script type="text/javascript" src="https://rawgit.com/alesanchezr/html-template-engine/master/dist/html-template-engine.js?autoload"></script>

Important! Please notice the ?autoload at the end of the script url, here is the library code

Usage (Remember to install the library first)

On your HTML paste the following code whenever you want to include another html file (nested calls are supported since version 0.0.5)

<!-- Include other html files into your own -->
<span require-file="./parts/footer.html"></span>

<!-- You can also include svg files -->
<span require-file="./parts/images/name.svg"></span>

Only for NPM installations:

import TemplateManager from 'html-template-engine';

//if you want to load the templates when the website finishes loading
window.onload = function(){ TemplateManager.start(); }

Additional Available Params

  1. Log on the console all the pieces being loaded into the html
    <body log-template-requests="true">
  1. Set a base template path for all your url's
    <body base-template-path="./parts/">
    ...
        <span require-file="footer.html"></span>
    </body>

Authors

Alejandro Sanchez Alejandro Sanchez @alesanchezr alesanchezr.com