Creating Email Stationery for SwiftK12 Messages

Creating Email Stationery for SwiftK12 Messages

The messages that are sent from us as announcements about PowerSchool utilize an HTML template. These are useful for establishing a consistent look and feel to your messages from your church and school. Creating one is easier than you think and consists of the following steps:

  1. Use an online WYSIWYG editor like Mosaico. If you are already using Mail Chimp, you can export your HTML from there as well. You can also search for HTML email design and find lots of other options to try.
  2. Create a location on a public server to host your images.
  3. Import your template into SwiftK12.
  4. Use your newly created email stationery to send a message in SwiftK12.

Our template looks like this:

WELS PowerSchool Support Services
 
WELS PowerSchool

PS-Support Announcement

 

Hello WELS PS Users,

Here is the message to send.

 

Here is the code for the template:

<meta charset="UTF-8"><meta content="width=device-width, initial-scale=1" name="viewport"><meta content="telephone=no" name="format-detection">
<title></title>
<style type="text/css">#outlook a {
padding:0;
}
.ExternalClass {
width:100%;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height:100%;
}
.es-button {
mso-style-priority:100!important;
text-decoration:none!important;
}

.es-desk-hidden {
display:none;
float:left;
overflow:hidden;
width:0;
max-height:0;
line-height:0;
mso-hide:all;
}
.es-button {
border-width:0!important;
padding:10px 20px 10px 20px!important;
}
@media only screen and (max-width:600px) {p, ul li, ol li, a { line-height:150%!important } h1 { font-size:30px!important; text-align:center; line-height:120%!important } h2 { font-size:26px!important; text-align:center; line-height:120%!important } h3 { font-size:20px!important; text-align:center; line-height:120%!important } .es-menu td a { font-size:16px!important } .es-header-body p, .es-header-body ul li, .es-header-body ol li, .es-header-body a { font-size:16px!important } .es-content-body p, .es-content-body ul li, .es-content-body ol li, .es-content-body a { font-size:16px!important } .es-footer-body p, .es-footer-body ul li, .es-footer-body ol li, .es-footer-body a { font-size:16px!important } .es-infoblock p, .es-infoblock ul li, .es-infoblock ol li, .es-infoblock a { font-size:12px!important } { display:none!important } .es-m-txt-c { text-align:center!important } .es-m-txt-r { text-align:right!important } .es-m-txt-l { text-align:left!important } .es-m-txt-r img, .es-m-txt-c img, .es-m-txt-l img { display:inline!important } .es-button-border { display:block!important } a.es-button, button.es-button { font-size:20px!important; display:block!important; border-width:10px 0px 10px 0px!important } .es-btn-fw { border-width:10px 0px!important; text-align:center!important } .es-adaptive table, .es-btn-fw, .es-btn-fw-brdr, .es-left, .es-right { width:100%!important } .es-content table, .es-header table, .es-footer table, .es-content, .es-footer, .es-header { width:100%!important; max-width:600px!important } .es-adapt-td { display:block!important; width:100%!important } .adapt-img { width:100%!important; height:auto!important } .es-m-p0 { padding:0px!important } .es-m-p0r { padding-right:0px!important } .es-m-p0l { padding-left:0px!important } .es-m-p0t { padding-top:0px!important } .es-m-p0b { padding-bottom:0!important } .es-m-p20b { padding-bottom:20px!important } .es-mobile-hidden, .es-hidden { display:none!important } tr.es-desk-hidden, td.es-desk-hidden, table.es-desk-hidden { width:auto!important; overflow:visible!important; float:none!important; max-height:inherit!important; line-height:inherit!important } tr.es-desk-hidden { display:table-row!important } table.es-desk-hidden { display:table!important } td.es-desk-menu-hidden { display:table-cell!important } .es-menu td { width:1%!important } table.es-table-not-adapt, .esd-block-html table { width:auto!important } table.es-social td { display:inline-block!important } table.es-social { display:inline-block!important } }
</style>
<div class="es-wrapper-color" style="background-color:#CCCCCC">
<table cellpadding="0" cellspacing="0" class="es-wrapper" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;padding:0;Margin:0;width:100%;height:100%;background-repeat:repeat;background-position:center top" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td style="padding:0;Margin:0" valign="top">
<table align="center" cellpadding="0" cellspacing="0" class="es-content" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" class="es-adaptive" style="padding:0;Margin:0">
<table align="center" bgcolor="#efefef" cellpadding="0" cellspacing="0" class="es-content-body" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:#EFEFEF;width:600px">
<tbody>
<tr style="border-collapse:collapse">
<td align="left" style="padding:10px;Margin:0">
<table align="left" cellpadding="0" cellspacing="0" class="es-left" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;float:left">
<tbody>
<tr style="border-collapse:collapse">
<td align="left" style="padding:0;Margin:0;width:280px">
<table cellpadding="0" cellspacing="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="left" class="es-infoblock" style="padding:0;Margin:0;line-height:14px;font-size:12px;color:#CCCCCC">WELS PowerSchool Support Services</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>

<table align="right" cellpadding="0" cellspacing="0" class="es-right" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;float:right">
<tbody>
<tr style="border-collapse:collapse">
<td align="left" style="padding:0;Margin:0;width:280px">
<table cellpadding="0" cellspacing="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="right" class="es-infoblock" style="padding:0;Margin:0;line-height:14px;font-size:12px;color:#CCCCCC">&nbsp;</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>

<table align="center" cellpadding="0" cellspacing="0" class="es-header" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;background-color:transparent;background-repeat:repeat;background-position:center top">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0">
<table align="center" cellpadding="0" cellspacing="0" class="es-header-body" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:#FFFFFF;width:600px">
<tbody>
<tr style="border-collapse:collapse">
<td align="left" style="Margin:0;padding-top:10px;padding-bottom:10px;padding-left:10px;padding-right:10px">
<table cellpadding="0" cellspacing="0" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0;width:580px" valign="top">
<table cellpadding="0" cellspacing="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0;font-size:0px"><a href="https://wels.powerschool.com/admin" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:underline;color:#CCCCCC;font-size:14px" target="_blank"><img alt="WELS PowerSchool" height="143" src="https://hesk000.blob.core.windows.net/hesk/1kMjAwiiL8jBcfAw8RU38UZ64UvDG29Dc.png" style="display:block;border:0;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic" title="WELS PowerSchool" width="573" /></a></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr style="border-collapse:collapse">
<td align="left" bgcolor="#00b6ef" style="padding:0;Margin:0;padding-left:5px;padding-right:5px;background-color:#00B6EF">
<table cellpadding="0" cellspacing="0" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0;width:590px" valign="top">
<table cellpadding="0" cellspacing="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td style="padding:0;Margin:0">
<table cellpadding="0" cellspacing="0" class="es-menu" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr class="links" style="border-collapse:collapse">
<td align="center" bgcolor="transparent" style="Margin:0;padding-left:5px;padding-right:5px;padding-top:10px;padding-bottom:10px;border:0" width="25.00%"><a href="https://wels.powerschool.com/admin" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:none;display:block;color:#FFFFFF;font-size:14px" target="_blank">WELS PS</a></td>
<td align="center" bgcolor="transparent" style="Margin:0;padding-left:5px;padding-right:5px;padding-top:10px;padding-bottom:10px;border:0" width="25.00%"><a href="https://ps-support.hesk.com" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:none;display:block;color:#FFFFFF;font-size:14px" target="_blank">PS-Support</a></td>
<td align="center" bgcolor="transparent" style="Margin:0;padding-left:5px;padding-right:5px;padding-top:10px;padding-bottom:10px;border:0" width="25.00%"><a href="https://support.powerschool.com/" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:none;display:block;color:#FFFFFF;font-size:14px" target="_blank">PowerSource</a></td>
<td align="center" bgcolor="transparent" style="Margin:0;padding-left:5px;padding-right:5px;padding-top:10px;padding-bottom:10px;border:0" width="25.00%"><a href="https://help.powerschool.com" style="-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;text-decoration:none;display:block;color:#FFFFFF;font-size:14px" target="_blank">PS Community</a></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>

<table align="center" cellpadding="0" cellspacing="0" class="es-content" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0">
<table align="center" bgcolor="#ffffff" cellpadding="0" cellspacing="0" class="es-content-body" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:#FFFFFF;width:600px">
<tbody>
<tr style="border-collapse:collapse">
<td align="left" style="Margin:0;padding-top:20px;padding-bottom:20px;padding-left:40px;padding-right:40px">
<table cellpadding="0" cellspacing="0" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0;width:520px" valign="top">
<table cellpadding="0" cellspacing="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="left" style="padding:0;Margin:0">
<h1 helvetica="" style="Margin:0;line-height:36px;mso-line-height-rule:exactly;font-family:helvetica, ">PS-Support Announcement</h1>
</td>
</tr>
<tr style="border-collapse:collapse">
<td align="left" style="padding:0;Margin:0;padding-top:5px;padding-bottom:20px;font-size:0">
<table border="0" cellpadding="0" cellspacing="0" height="100%" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="5%">
<tbody>
<tr style="border-collapse:collapse">
<td style="padding:0;Margin:0;border-bottom:2px solid #999999;background:#FFFFFF none repeat scroll 0% 0%;height:1px;width:100%;margin:0px">&nbsp;</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr style="border-collapse:collapse">
<td align="left" style="padding:0;Margin:0;padding-bottom:10px">
<p helvetica="" style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, ">Hello WELS PS Users,</p>
</td>
</tr>
<tr style="border-collapse:collapse">
<td align="left" style="padding:0;Margin:0">
<p helvetica="" style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, ">Here is the message to send.</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>

<table align="center" cellpadding="0" cellspacing="0" class="es-footer" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;background-color:transparent;background-repeat:repeat;background-position:center top">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0">
<table align="center" cellpadding="0" cellspacing="0" class="es-footer-body" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:#EFEFEF;width:600px">
<tbody>
<tr style="border-collapse:collapse">
<td align="left" style="padding:0;Margin:0;padding-bottom:15px;padding-left:20px;padding-right:20px">
<table cellpadding="0" cellspacing="0" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="center" style="padding:0;Margin:0;width:560px" valign="top">
<table cellpadding="0" cellspacing="0" role="presentation" style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px" width="100%">
<tbody>
<tr style="border-collapse:collapse">
<td align="left" esdev-links-color="#333333" style="padding:0;Margin:0">
<p helvetica="" style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, ">Please do not reply to this email. Responses to this address are not monitored.</p>

<p helvetica="" style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, ">&nbsp;</p>

<p helvetica="" style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:helvetica, ">You are receiving this email because you requested to be added to the WELS PowerSchool support mailing list when your school signed up for PowerSchool. If you no longer want to receive these emails, please submit a request via the <a href="https://ps-support.hesk.com" target="_blank">PS-Support </a>web site.</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>

As you can see, the code generated by the HTML editors is a bit much, but with a basic understanding of HTML, you can find your way around it and tweak it as necessary. The next step is to create a location to store your images. An email template will contain the URL's to any images used in the template. These images need to be on a public server and available by their URL. This means that you will need to use your school's web server or some other public server like Google Drive. If you choose to host your images on Google Drive, you'll need to tweak the URL following these instructions.

Once your template is compete and the images are on a public server, it's time to import the code into SwiftK12.

  1. Log into PowerSchool Admin and click the SwiftReach SwiftK12 link in the upper left. Go to Settings > Email StationeryThis area allows you to create new email stationery/templates, set default stationery via on/off switches, edit stationery content (pencil icon), and delete email stationery (via the red ‘x’ option). Click the Add Stationery Template button to the right of the Manage Email Stationery panel.
  2. Next you will be prompted to enter in the name of the template, a description, and your template content. You could develop your template here, but since you've already done that, click on the Source toolbar button and then paste in the HTML code you developed.
  3. Once you are happy with the email template, click the Save button at the bottom.

The last step is to use your stationery when sending an email with SwiftK12. Click on Send an Alert and give it a name and any details you want, specify who you are sending it to, and click next. On this screen, select the type of message (email), where you'd like it posted as well (if any), and then choose Advanced - Define content differently for each of the selected message types click next. This will open the editor. Enter your email subject and then in the upper-left of the toolbar, click the email template icon. It looks like a piece of paper with lines on it. This will open the template selector and you can click on the template you just added.

You can create multiple templates for various times of the year or for church and school, etc. It is also important to note that you can add custom lists of recipients that are not in PowerSchool, like prospects, grandparents, etc. You can then use this to send to them as well. Just follow these steps to create a custom list.

  1. Click on your SwiftK12 link, and then go to the Contacts tab.
  2. Click on the +Create New Contact List  button
    1. On the first screen, give the list a name and then check the Import File radio button
    2. Click on the Next button
    3. Choose an Excel file from your computer which is saved in .CSV file format. The column headings should be LastName, FirstName, Phone1, Phone2, Phone3, Email1, Email2, Email4, Language. You don't need to use all the columns. Language should be English, unless you are specifically using the language translation option. Each contact should have at least one phone and email.
  3. You will then see a list of all the column labels from your spreadsheet. For each one of them, choose a Type from the dropdown menu which best matches up with what kind of information is stored in that column.
  4. Click on Next, and you’re all done!

TIP: If you have an Excel spreadsheet which is not in .CSV file format, don’t worry! Just open it in Excel, then go to File > Save As and choose CSV Comma Delimited from the list of options to save it as a CSV.

Tip: When you are putting the data into the excel file, put all phone numbers in as just numbers no dashes.