HTML Helper
The HTML Helper file contains handlers that assist in working with HTML.
- rigHtmlBr()
- rigHtmlHeading()
- rigHtmlImg()
- rigHtmlLinkTag()
- rigHtmlNbs()
- rigHtmlOL() and rigHtmlUL()
- rigHtmlMeta()
- rigHtmlDocType()
Loading this Helper
This helper is loaded using the following code:
rigLoadHelper "html"
The following handlers are available:
rigHtmlBr()
Generates line break tags (<br />) based on the number you submit. Example:
put rigHtmlBr(3) into gData["threeBreaks"]
The above would produce: <br /><br /><br />
rigHtmlHeading()
Lets you create HTML <h1> tags. The first parameter will contain the data, the second the size of the heading. Example:
put rigHtmlHeading("Welcome!", 3) into gData["welcomeH"]
The above would produce: <h3>Welcome!</h3>
rigHtmlImg()
Lets you create HTML <img /> tags. The first parameter contains the image source. Example:
put rigHtmlImg("images/picture.jpg") into gData["myPic"]
-- gives <img src="http://site.com/images/picture.jpg" />
There is an optional second parameter that is a TRUE/FALSE value that specifics if the src should have the page specified by gConfig["indexPage"] added to the address it creates. Presumably, this would be if you were using a media controller.
put rigHtmlImg("images/picture.jpg", TRUE) into gData["myPic"]
-- gives <img src="http://site.com/index.lc/images/picture.jpg" />
Additionally, an associative array can be passed to the rigHtmlImg() function for complete control over all attributes and values.
put "images/picture.jpg" into tImgProperties["src"]
put "Me, demonstrating how to eat 4 slices of pizza at one time" into tImgProperties["alt"]
put "post_images" into tImgProperties["class"]
put "200" into tImgProperties["width"]
put "200" into tImgProperties["height"]
put "That was quite a night" into tImgProperties["title"]
put "lightbox" into tImgProperties["rel"]
put rigHtmlImg(tImgProperties) into gData["myPic"]
-- <img src="http://site.com/index.lc/images/picture.jpg" alt="Me, demonstrating how to eat 4 slices of pizza at one time" class="post_images" width="200" height="200" title="That was quite a night" rel="lightbox" />
rigHtmlLinkTag()
Lets you create HTML <link /> tags. This is useful for stylesheet links, as well as other links. The parameters are href, with optional rel, type, title, media, indexPage and cors. indexPage is a TRUE/FALSE value that specifies if the href should have the page specified by gConfig["indexPage"] added to the address it creates; cors is a boolean which adds the "crossorigin" attribute if set to TRUE.
put rigHtmlLinkTag("css/mystyles.css") into gData["myStyleLink"]
-- gives <link href="http://site.com/css/mystyles.css" rel="stylesheet" type="text/css" />
Further examples:
put rigHtmlLinkTag("favicon.ico", "shortcut icon", "image/ico") into gData["myIconLink"]
-- <link href="http://site.com/favicon.ico" rel="shortcut icon" type="image/ico" />
put rigHtmlLinkTag("feed", "alternate", "application/rss+xml", "My RSS Feed") into gData["myFeedLink"]
-- <link href="http://site.com/feed" rel="alternate" type="application/rss+xml" title="My RSS Feed" />
Additionally, an associative array can be passed to the rigHtmlLinkTag() function for complete control over all attributes and values.
put "css/printer.css" into tLink["href"]
put "stylesheet" into tLink["rel"]
put "text/css" into tLink["type"]
put "print" into tLink["media"]
put rigHtmlLinkTag(tLink) into gData["myStyleLink"]
-- <link href="http://site.com/css/printer.css" rel="stylesheet" type="text/css" media="print" />
Preloading a font:
put "assets/fonts/dosis-v7-latin-300.woff2" into tFontLinkDosis["href"]
put "preload" into tFontLinkDosis["rel"]
put "font/woff2" into tFontLinkDosis["type"]
put true into tFontLinkDosis["cors"]
put rigHtmlLinkTag(tFontLinkDosis) into gData["fontLinkDosis"]
-- <link href="https://site.com/assets/fonts/dosis-v7-latin-300.woff2" rel="preload" type="font/woff2" crossorigin />
rigHtmlNbs()
Generates non-breaking spaces ( ) based on the number you submit. Example:
put rigHtmlNbs(3) into gData["threeNbs"]
The above would produce:
rigHtmlOL() and rigHtmlUL()
Permits you to generate ordered or unordered HTML lists from simple or multi-dimensional arrays. Example:
rigLoadHelper "html"
put "red,blue,green,yellow" into tList
split tList using comma
put "boldlist" into tAttributes["class"]
put "mylist" into tAttributes["id"]
put rigHtmlUL(tList, tAttributes) into gData["myUL"]
Note: You can use a comma separated list for the tList parameter. There is no need to use an array as in the example.
The above code will produce this:
<ul class="boldlist" id="mylist">
<li>red</li>
<li>blue</li>
<li>green</li>
<li>yellow</li>
</ul>
Here is a more complex example, using a multi-dimensional array:
rigLoadHelper "html"
put "boldlist" into tAttributes["class"]
put "mylist" into tAttributes["id"]
put "red" into tList[1]["colors"][1]
put "blue" into tList[1]["colors"][2]
put "green" into tList[1]["colors"][3]
put "round" into tList[2]["shapes"][1]
put "square" into tList[2]["shapes"][2]
put "ellipse" into tList[2]["shapes"][3]["circles"][1]
put "oval" into tList[2]["shapes"][3]["circles"][2]
put "sphere" into tList[2]["shapes"][3]["circles"][3]
put "happy" into tList[3]["moods"][1]
put "dejected" into tList[3]["moods"][2]["upset"][1]["defeated"][1]
put "disheartened" into tList[3]["moods"][2]["upset"][1]["defeated"][2]
put "depressed" into tList[3]["moods"][2]["upset"][1]["defeated"][3]
put "annoyed" into tList[3]["moods"][2]["upset"][2]
put "cross" into tList[3]["moods"][2]["upset"][3]
put "angry" into tList[3]["moods"][2]["upset"][4]
put rigHtmlUL(tList, tAttributes) into gData["myUL"]
The above code will produce this:
<ul class="boldlist" id="mylist">
<li>colors
<ul>
<li>red</li>
<li>blue</li>
<li>green</li>
</ul>
</li>
<li>shapes
<ul>
<li>round</li>
<li>square</li>
<li>circles
<ul>
<li>elipse</li>
<li>oval</li>
<li>sphere</li>
</ul>
</li>
</ul>
</li>
<li>moods
<ul>
<li>happy</li>
<li>upset
<ul>
<li>defeated
<ul>
<li>dejected</li>
<li>disheartened</li>
<li>depressed</li>
</ul>
</li>
<li>annoyed</li>
<li>cross</li>
<li>angry</li>
</ul>
</li>
</ul>
</li>
</ul>
rigHtmlMeta()
Helps you generate meta tags. You can pass strings to the function, or simple arrays, or multidimensional ones. Examples:
put rigHtmlMeta("description", "My Great site") into gData["desc"]
-- Generates: <meta name="description" content="My Great Site" />
put rigHtmlMeta("Content-type", "text/html; charset=utf-8", "equiv") into gData["contType"] -- Note the third parameter. Can be "equiv" or "name"
-- Generates: <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
put "robots" into tArray["name"]
put "no-cache" into tArray["content"]
put rigHtmlMeta(tArray) into gData["robMeta"]
-- Generates: <meta name="robots" content="no-cache" />
put "robots" into tMeta[1]["name"]
put "no-cache" into tMeta[1]["content"]
put "description" into tMeta[2]["name"]
put "My Great Site" into tMeta[2]["content"]
put "keywords" into tMeta[3]["name"]
put "love, passion, intrigue, deception" into tMeta[3]["content"]
put "robots" into tMeta[4]["name"]
put "no-cache" into tMeta[4]["content"]
put "Content-type" into tMeta[5]["name"]
put "text/html; charset=utf-8" into tMeta[5]["content"]
put "equiv" into tMeta[5]["type"]
put rigHtmlMeta(tMeta) into gData["myMeta"]
-- Generates:
-- <meta name="robots" content="no-cache" />
-- <meta name="description" content="My Great Site" />
-- <meta name="keywords" content="love, passion, intrigue, deception" />
-- <meta name="robots" content="no-cache" />
-- <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
rigHtmlDocType()
Helps you generate document type declarations, or DTD's. XHTML 1.0 Strict is used by default, but many doctypes are available.
put rigHtmlDocType() into gData["docType"]
-- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
put rigHtmlDocType("html4-trans") into gData["docType"]
-- <!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
The following is a list of doctype choices. These are configurable, and pulled from application/config/doctypes.lc
Doctype | Option | Result |
---|---|---|
XHTML 1.1 | "xhtml11" | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
XHTML 1.0 Strict | "xhtml1-strict" | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
XHTML 1.0 Transitional | "xhtml1-trans" | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
XHTML 1.0 Frameset | "xhtml1-frame" | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> |
HTML 5 | "html5" | <!DOCTYPE html> |
HTML 4 Strict | "html4-strict" | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
HTML 4 Transitional | "html4-trans" | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
HTML 4 Frameset | "html4-frame" | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> |