Functions for HTML

"It's still web development, it's just way easier!"
Tag Generation
Text to HTML
Example
About

HTML Tag Generation

The tag function takes its value and generates an HTML tag out of it. To manage tabs and new line spacing you can use <#tab> and <#nl> as needed. If a Wrival Insert's value just needs a single tag then the ; shortcut can be used instead.

Example Result Displays As
<#date:tag="B"> <B>August 19, 2017</B> August 19, 2017
<#date;B> <B>August 19, 2017</B> August 19, 2017
<#date:tag="B",tag="I"> <I><B>August 19, 2017</B></I> August 19, 2017
<#date:tag='font size="+1"'> <font size="+1">August 19, 2017</font> August 19, 2017
<#date;font size="+1"> <font size="+1">August 19, 2017</font> August 19, 2017
<#"Some Text";span='style="color: green;"'> <span style="color: green;">SOME TEXT</span> Some Text
<#"Some Text":tag="b"> <b>Some Text</b> Some Text
<#"Some Text";b> <b>Some Text</b> Some Text
<#"Some Text":upper;b> <b>SOME TEXT</b> SOME TEXT

Text to HTML Reference Chart

In addition to applying the Text-to-HTML function to an entire page, here's a couple other ways to implement the Text-to-HTML function:

Apply to a File:

<#/_/files/texttohtml.txt:html>

Apply to a Block of Text:

<#"
* List Items
* List Items
* List Items
">
Raw Text Rendered without Formatting Formatting Created Rendered
^ABC ^ABC <h1>ABC</h1>

ABC

^^ABC ^^ABC <h2>ABC</h2>

ABC

^^^ABC ^^^ABC <h3>ABC</h3>

ABC

^^^^ABC ^^^^ABC <h4>ABC</h4>

ABC

ABC

 DEF

GHI
ABC DEF GHI <p>ABC</p>
 <blockquote>DEF</blockquote>
<p>GHI</p>

ABC

DEF

GHI

ABC\
DEF\
ABC\ DEF\ ABC<br>DEF<br> ABC
DEF
* ABC
* DEF
* GHI
* ABC * DEF * GHI <ul>
  <li>ABC</li>
  <li>DEF</li>
  <li>GHI</li>
</ul>
  • ABC
  • DEF
  • GHI
* AAA
** AAB
*** AAC
* AAA ** AAB *** AAC <ul>
  <li>AAA</li>
    <ul><li>AAB</li></ul>
    <ul><ul><li>AAC</li></ul></ul>
</ul>
  • AAA
    • AAB
      • AAC
# ABC
# DEF
# GHI
# ABC # DEF # GHI <ol>
  <li>ABC</li>
  <li>DEF</li>
  <li>GHI</li>
</ol>
  1. ABC
  2. DEF
  3. GHI
- - <hr>
-- -- --strike text-- strike text
http://www.wrival.com <a href="http://www.wrival.com">http://www.wrival.com</a> http://www.wrival.com

Text-to-HTML Example

The following text is shown below as the same text as displayed by a browser processed, and then the result after it's passed through the Text-to-HTML function.

Example

Original Composition:

^Title 1

^^Title 2

^^^Title 3

^^^^Title 4

A paragraph because there's space before and
after this.

A blockquote because there's a leading space at
start of of this block of text.

Name\
Address1\
City, State

http://www.wrival.com

^^^^A horizontal rule:

------------------------------------------------

* A List Item
* Another
** A sub-list item.
*** Sub of a sub-list item.
* And so on.

2 dashes outside a term --strikes text--.

# A numbered list
# A numbered list
# A numbered list

As Is (Without Text to HTML):

^Title 1 ^^Title 2 ^^^Title 3 ^^^^Title 4 A paragraph because there's space before and after this. A blockquote because there's a leading space at start of of this block of text. Name\ Address1\ City, State http://www.wrival.com ^^^^A horizontal rule: ------------------------------------------------ * A List Item * Another ** A sub-list item. *** Sub of a sub-list item. * And so on. Long Dashes -- just use 2 dashes in a row anywhere. # A numbered list # A numbered list # A numbered list

With Text to HTML Feature Enabled:

Title 1

Title 2

Title 3

Title 4

A paragraph because there's space before and after this.

A blockquote because there's a leading space at start of of this block of text.

Name
Address1
City, State

http://www.wrival.com

A horizontal rule:


  • A List Item
  • Another
    • A sub-list item.
      • Sub of a sub-list item.
  • And so on.

Long Dashes – just use 2 dashes in a row anywhere.

  1. A numbered list
  2. A numbered list
  3. A numbered list

How Browsers Display Text

Web browsers interpret HTML to format text. HTML is a markup language that tells a browser how to format the tagged information. It is important to understand the basic behavior of how text is treated when managing or building content that is going to be displayed in a browser. Multiple spaces are rendered as only one space including carriage returns. If you have two or more paragraphs that do not offer a means of letting the browser know that they are separate paragraphs, the entire text will be displayed as one. Text and other embedded elements wrap to the space available to them, potentially as one long paragraph, unless tagged with HTML.

Wrival has a special feature to help speed up the HTML requirements and allow users to avoid writing their own code. By checking the Text-to-HTML checkbox in your pages and objects you can use the text patterns found here to convert raw text to some basic HTML formats. Not only that, but you can rest assured knowing that your HTML will be done correctly.


Text to HTML Patterns

The Text-to-HTML function first takes the entire value passed and "chunks" it into groups, which are then converted to HTML. Wrival's parsing engine splits the value's start, end, and double carriage returns within the original value to create each chunk. Each chunk then is converted to an HTML tagged paragraph, blockquote, list, or a horizontal rule. Specific rules are as follows.

  • Lines starting with carrots ^, ^^, ^^^, ^^^^ get converted to headers (H1 - H4).
  • A chunk starting with a space is converted to a blockquote.
  • A line that starts with a dash becomes a horizontal rule.
  • Two dashes become a long dash (as the HTML symbol).
  • A series of lines starting with an asterisks, plus a space, gets converted to a bulleted list.
  • A series of lines starting with hash symbol (#), plus a space, gets converted to a numbered list.
  • All other chunks get converted to a paragraphs.

Using this feature does not mean that you can't include HTML tags within the auto-formatted content or other objects for that matter.