University of Michigan-Flint

Similar to other body elements, the HTML element can be added to a form by clicking on the "+" sign next to a "Block" (see image below).  This element will add a box to the form that allows you to input raw HTML code to generate a desired output.  In order to use this element it is highly recommended that you have a working knowledge of HTML coding.  If you lack a background in HTML, you may want to just use the other elements to generate your TeamSite content.  Included on this page are a few useful ways to implement the HTML element into your site. 

The HTML element can be used to create bookmarks within a webpage.  Bookmarks within a page allow you to link directly to information on the page from a sidebar.  Bookmarks can also be included by using the "anchor" feature in the text element.

1. Identify the element that you would like to bookmark.  Position a HTML element block before the element.  You may need to use the  button (move the associated element up) and the  button (move the associated element down) to rearrange the elements appropriately.
2. In the HTML element box, enter the following code:  <a name="nameofbookmark"></a>
3. Make sure you replace nameofbookmark from the previous code with the word or phrase you want to use to bookmark the following element.  For example, as it is written in the image below, the bookmark for the text "What is the HTML Element?" will be called bookmarkname.
   
   
   
4. Once you have placed the bookmark you can refer to it from a sidebar on the same page by placing "#bookmarkname" in the "Link URL" textbox (without the quotation marks). 
   
   

Please Note:  You should not create multiple bookmarks with the same name.  Every bookmark should have a unique name which is named following appropriate conventions (numbers and letters only, and no spaces or special characters except for "-" or an underscore).  For example, if you wish to implement your own "back to top" link, do not name more than one bookmark "top".

If you're creating bookmarks to specific areas of a webpage, you may also want to include a "back to top" link so users can easily bounce back to the top of the page (as opposed to scrolling). 

1. Follow the instructions under the section "Creating Bookmarks Within a Page" to create a HTML element at the very top of the form.  Do not place any elements before this HTML element, otherwise it won't mark the very "top" of the page.  Use the word "top" for the bookmark name.
2. Once you have placed the HTML element with the "top" bookmark you simply need to insert a "Links" block with the following as the only link:
   • In the "Link Text" and "Link Description" areas enter "back to top".
   • In the "Link URL " area enter: #top

You may also highlight text in a text block and enter "#top" for the hyperlink address.

When you include an image in a page, you may have a problem with text after the image.  To eliminate this problem you can include a "break" in a HTML element block after the image to make sure the text displays beneath the image and not next to it.

Without a break text may display next to the picture:

Follow these steps to make the text display beneath the picture:

1. Add a HTML element block to your form.  Position the HTML element block directly beneath the image block.
   
2. Enter the following code in the HTML element block:
   <br clear="left">
3. Text placed after the image and HTML element block will now be displayed like the image below: