Use Cases
Here is an example of using block content to build urgency. Using a block content banner on the home page, you can choose to target repeat visitors to your site. The first time a prospective student visits your home page they will see the default message. The second time, the call to action escalates and they see an application due message. If they visit a couple more times, you can offer the ability to schedule a personal meeting with an advisor to help them through the process.
Create HTML FilesLink to this section
Default Message HTML
First, let's create the HTML file we will use as the default message in our block content.
- Create a personalization folder in Content > Pages.
- Click +New.
- Select New File.
- Filename is
block-default.html
- Filename is
- Click Create.
- Create a 1x1 table.
- Add text in the table row.
- For example, You belong at Gallena
- Apply a Heading 1 style to the text.
- Start a new paragraph in the table row.
- Add button text.
- For example, DISCOVER YOUR PASSION
- Go to Source.
- Add styles to the table.
- For example,
<table style="border-collapse: collapse; width: 100%; height: 100%; background-color: #2dc26b;">
<tbody style="background-image: url('/_resources/images/personalization/block-default.png'); background-color: #cccccc; background-size: cover;">
<tr>
<td style="height: 100%; width: 100%; text-align: left; padding-top: 30px;">
<h1><span style="font-family: arial, helvetica, sans-serif; color: white;">You belong at Gallena</span></h1>
<p><button style="background-color: #e0712b; border: none; text-align: center; padding: 8px 9px; color: white; font-size: 12px;">DISCOVER YOUR PASSION</button></p>
</td>
</tr>
</tbody>
</table>
Save and Publish this file.
Now, we can copy this file and edit the text, images, and colors to create the HTML files for our "Applications Due" and "Meet with an Advisor" variations (see Variations HTML, as needed).
You are ready to
Variations HTMLLink to this section
Code blocks for the variations that your visitors see after their first visit.
Variation 1
On a second visit, give the visitor an urgent call to action. Go to Content > Pages, create a new file in your personalization folder with filename block-variation-1.html
<table style="border-collapse: collapse; width: 100%; height: 100%; background-color: #2dc26b;">
<tbody style="background-image: url('/_resources/images/personalization/block-variation-1.png'); background-color: #cccccc; background-size: cover;">
<tr>
<td style="height: 100%; width: 100%; text-align: left; padding-top: 30px;">
<h1><span style="font-family: arial, helvetica, sans-serif; color: white;">Applications Due 5/20</span></h1>
<p><button style="background-color: #ff4646; border: none; text-align: center; padding: 8px 9px; color: white; font-size: 12px;">TIME IS RUNNING OUT</button></p>
</td>
</tr>
</tbody>
</table>
Variation 2
On subsequent visits, offer the ability to meet with an advisor. Go to Content > Pages, create a new file in your personalization folder with filename block-variation-2.html
<table style="border-collapse: collapse; width: 100%; height: 100%; background-color: #2dc26b;">
<tbody style="background-image: url('/_resources/images/personalization/block-variation-2.png'); background-color: #cccccc; background-size: cover;">
<tr>
<td style="height: 100%; width: 100%; text-align: left; padding-top: 30px;">
<h1><span style="font-family: arial, helvetica, sans-serif; color: white;">Personal Connections</span></h1>
<p><button style="background-color: #21c3b6; border: none; text-align: center; padding: 8px 9px; color: white; font-size: 12px;">IT'S THE GALLENA WAY</button></p>
</td>
</tr>
</tbody>
</table>
More Use CasesLink to this section
Practical techniques for using Instinct at your school.
