Code-Free Templating, a new tool |
Code-Free Templating, a new tool |
Johny Why |
Dec 8 2022, 04:36 AM
Post
#1
|
Group: Members Posts: 1 Joined: 7-December 22 Member No.: 28,676 |
I'm just sharing a free tool i developed that might be helpful to others.
It's a code-free, client-side templating tool, that will enable an HTML dev to display a collection of repeated items on a webpage with identical HTML, but different content. "Template" meaning there's only one copy of the HTML, shared by all the items in the collection. To change the layout of all the items, you only have to edit the template. Code-free meaning, you don't need to write or know Javascript. Everything is done in HTML, including the template, container, and data. The content is separate from the HTML, so you can update the data without touching the HTML. It's best for small projects with few items that don't change too often, where you can't or don't want to do server-side programming. Feel free to ask questions here or on github. https://github.com/johnaweiss/HTML-Micro-Templating Here's a simple example.
CODE <body> <!-- CONTAINER --> <span mt-records="EEs" mt-template="engineer" class="engineers"></span> </body> <!-- TEMPLATE --> <template id="engineer"> <span> <a target="_blank" href="http://[[LINK]]"> <img src="[[IMAGE]]" alt=""> <div class="caption">[[NAME]]</div> </a> </span> </template> <!-- DATA --> <mt-records hidden id="EEs"> NAME LINK IMAGE Benervive Guper https://www.Guper.com Guper.jpg Phoey Ramstung https://Ramstung.com Ramstung.jpg Sam Smith https://samsmith.com sam.jpg </mt-records> This post has been edited by Johny Why: Dec 8 2022, 04:56 AM |
Lo-Fi Version | Time is now: 4th June 2024 - 10:53 PM |