How to share template between pages?

  • 1
  • Question
  • Updated 5 years ago
I'm sure this has been answered somewhere already, but I haven't found it.

What's the best way to share a small snippet of HTML between lots of Skuid pages? A typical use case is a nav bar that's reused across pages. I guess I just want a shared template component.
Photo of Glenn Elliott

Glenn Elliott, Champion

  • 7,738 Points 5k badge 2x thumb

Posted 5 years ago

  • 1
Photo of Zach McElrath

Zach McElrath, Employee

  • 49,004 Points 20k badge 2x thumb
I'd probably refactor this snippet of HTML into a reusable custom component, and then include this custom component in a StaticResource that you include in all of your Skuid Pages by adding a JavaScript Resource of type "Static Resource".

So you'd have something like this in your Static Resource:



(function(skuid){

var $ = skuid.$;

skuid.componentType.register(
'mystuff.navBar',
function(element,xmlDefinition,component) {
var content1 = $('<div>').text('Ipsum lorum');
var searchBox = $('<input type="search">');
var content2 = $('<div>').text('Amet sic');
element.addClass('my-nav-bar').append(
content1,searchBox,content2
);
}
);

})(skuid);


Photo of Glenn Elliott

Glenn Elliott, Champion

  • 7,738 Points 5k badge 2x thumb
Thanks Zach. That makes sense.