Note: The following article applies only to ShoWorks 2006 and prior users.  Newer versions of ShoWorks allows for real-time formatting directly in text boxes by highlighting sections of text and changing the formatting with the toolbar that appears.

Several menus in the ShoWorks Web allow the fair to customize what displayed by typing in their own text.  For example, the fair may choose to display some helpful instructions on the Welcome Screen.  This text can be formatted (example, making paragraph breaks and line breaks) by using HTML tags.

HTML (Hypertext Markup Language) is the common way to format text on websites.

Two methods of generating HTML formatted text:

1. Writing your text in Microsoft Word to generate the HTML
2. Writing your HTML directly

Method A: Writing your text in Microsoft Word to generate the HTML

Steps:

1. Using MS Word create a new document and type your desired text and format to your preference.
2. Save the document (Save As..) as a format of "Web Page Filtered" (make sure to use the "Filtered" type of format).  You should save the file in a different location than the original Word document so as not to confuse it in step 4.
3. Exit Word.
4. Using Windows Explorer, locate the saved file.
5. Right-click on this file and select "Open With" and open with "Notepad". If Notepad does not exist, you will need to "Choose Default Program" and "Browse" for Notepad. It is found under the C:\Windows directory.
6. You will now see the HTML that was generated and it will be "very clean" (no lengthy overhead of unneeded scripts). Copy all of this text by selecting Edit > Select All, then Edit > Copy.
7. Exit Notepad.
8. Open ShoWorks and go to the Setup menu. Open any of the magnifying glass boxes (such as "Web Instructions") and replace the existing text by pasting using the shortcut "Ctrl-V" (you must use this shortcut as there are no menus available in these boxes).  This is done by holding down the Ctrl key and pressing "V" on your keyboard.

You can now upload your ShoWorks data file to the web and view the changes.

Method B: Writing your own HTML 

• HTML tags are used to mark-up (format) text.
• HTML tags are surrounded by the two characters < and >
• The surrounding characters are called angle brackets
• HTML tags normally come in pairs like <p> and </p>
• The first tag in a pair is the start tag, the second tag is the end tag
• The text between the start and end tags is the element content
• HTML tags are not case sensitive, <p> means the same as <P>

Popular Tags:

• Bolding: To make text in bold, surround the text with the <strong> and </strong> tags.
  <strong>this text is in bold</strong>
• Underline:  To make text italics, surround the text with the <em> and </em> tags.
  <em>this text is in italics</em>
• Italics:  To make text in bold, surround the text with the <i> and </i> tags.
• Paragraphs: To separate paragraphs, surround each paragraph with the <p> and </p> tags.
• Line Break: To make a line break (carriage return), use the <br> tag.
• Hyperlink: To make a link, surround some text with <a href="[website]"> and </a>. Notice how the website address is surrounded by double quotes ".  A common mistake is to forget to surround the address by quotes or using too many quotes.
  <a href="http://www.myfair.com/somepage.html">Click Here</a>to visit our fair.
• Email link: To make an email link, surround some text with <a href="mailto:[email address]"> and </a>. Notice how the email address is surrounded by double quotes " and preceeds with the word mailto followed by a colon :.  A common mistake is to forget to surround the address by quotes or using too many quotes.
  <a href="mailto:someone@example.com">someone@example.com</a>to email us.
• For a quick tutorial on more common HTML tags, please see:
  http://w3schools.com/html/html_elements.asp  
• For advanced styling (making text colored, changing the font, etc.) see CSS at: https://www.w3schools.com/Css/ and more specifically https://www.w3schools.com/Css/css_colors.asp