Overview

Within SchoolAdmin, you can use HTML formatting in templates (e.g. emails, parent portal pages, etc.), online forms, and even parent explanations on checklist items to customize the look and feel. This article will go over some of the basic HTML that you can use.

Please note: There are some limitations with how HTML is rendered in different email clients, so highly formatted emails may not always be the right choice. Click here for more information.

--

How-To: Use HTML Formatting

HTML Usage in SchoolAdmin

  • If you are using HTML in templates (e.g. emails or parent portal content), you will need to click on the </> button in the toolbar of the SchoolAdmin Template Editor. This will open up the code view - click here for more information.
  • If you are using HTML in online forms, you will need to place them in a Comment Field - click here for more information.

HTML elements are defined by using tags, identifiable by the less-than (<) and greater-than (>) signs. You will generally start with an opening tag - such as <p> - and end with a closing tag that is indicated by a forward slash (/) - such as </p>. The text you want to output with the format will be enclosed within these opening and closing tags. Example:

<p>This is an HTML paragraph. <b>This text is in bold.</b></p>

Below are some common HTML elements that you can use in SchoolAdmin.

Bold Text

<b>Your Text Goes Here.</b>

OR

<strong>Your Text Goes Here</strong>



Italic Text

<i>Your Text Goes Here.</i>



Underlined Text

<u>Your Text Goes Here.</u>



Colorful Text

<font color="red">Your Text Goes Here</font>


Indented Text

<p style="text-indent: 40px">Your Text Goes Here.</p>
  • You can change the number before 'px' to increase or decrease the indent.
  • Changing to a bigger number will increase the indent, while changing to a smaller number will decrease the indent.

Line Break

Use the <br> tag to add a line break. 

Add additional lines between paragraphs by using additional <br> tags. Each <br> tag you enter creates another blank line.
  • This does not have a closing tag.


Inserting Images

<img src="the-direct-link-to-your-picture.jpg">
  • This does not have a closing tag.
  • You must use a direct link to the image in order for this to work. Typically, these will end in JPG or PNG. You can upload images to the File Manager in SchoolAdmin.
  • Always pre-size your images to 600px before uploading them to SchoolAdmin to ensure correct visibility. Some email clients do not respect the image size HTML tag, so resizing the image first will help ensure consistency of its look across the different email clients receiving the email. Click here for more information.


Hyperlinks

<a href="http://www.your-link-goes-here.com">Your Link Text Goes Here</a>

If you want the link to pop out in a new window, you can add target="_blank" after the URL in the opening tag. Example:

<a href="http://www.your-link-goes-here.com" target="_blank">Your Link Text Goes Here</a>
  • You must use a direct link in order for this to work. You can upload files to the File Manager in SchoolAdmin and link to them so that families can view or download them as needed.


Combining Elements

You can combine elements to get the desired look and feel. Example:

<b><u>This is bold and underlined text.</b></u>

--

Related Articles

Did this answer your question?