This is a tutorial to start using htms
First create a new html file with boilerplate
<!DOCTYPE html>
<html>
<head>
<title>HTMS Tutorial</title>
</head>
<body>
<p>Hello world</p>
</body>
</html>
Adding HTMS
To add htms into the page you just have to add a script, style and a element, more info in the installation.
<!DOCTYPE html>
<html>
<head>
<title>HTMS Tutorial</title>
<!-- Import -->
<script src="https://htms.fsh.plus/js/v3.js" type="module" crossorigin="anonymous"></script>
<style>htms{display:none}</style>
<!-- Settings -->
<htms></htms>
</head>
<body>
<p>Hello world</p>
</body>
</html>
Well done, htms has been added to the page, now lets use it!
Using HTMS
In this section we will use htms to add a sample
First create a file to store samples, name it samples.htms for example, and add an example template:
<sample name="Test">
<p>This is a sample</p>
</sample>
Once the samples.htms has been created we just add it to the html file with the commands:
Finally modify the file with the changes
<!DOCTYPE html>
<html>
<head>
<title>HTMS Tutorial</title>
<!-- Import -->
<script src="https://htms.fsh.plus/js/v3.js" type="module" crossorigin="anonymous"></script>
<style>htms{display:none}</style>
<!-- Settings -->
<htms>
import "Test" from "samples.htms"
replace "Element" with "Test"
</htms>
</head>
<body>
<p>Hello world</p>
<Element></Element>
</body>
</html>
And done, htms has been added! Check other tutorials for more advanced usage.