How to add Vidigami to the Parent Portal

There are multiple options for adding content to the Parent Portal:

  • Log-in page: Same content for all visitors. 
  • Summary page: This is the page after successful log-in that displays all applicant/student accounts that the parent/guardian is tied to.  This page displays the same content for all visitors.
  • Student page: Within the Summary page, each applicant's/student's individual checklist can be accessed.  Within these pages, the content  can either be the same for all visitors, or personalized on a per student basis.

NOTE: The first two options are quick and easy to configure, and should take no more than a few minutes.  Personalized content within the Student pages is the most powerful and requires a bit more planning and consideration.  

Recommended: Add CSS to make your site responsive friendly for video 

Over 30% of parents engage with your school’s portal via mobile devices, which means it's important to ensure content can be viewed on a variety of screens.  To do this, we need to add a CSS div class to your site.  

Add CSS div style

  1. Go to your parent portal customization setup page within Settings-->Portal-->Parent Portal Design. 
  2. Add the following code to the 'Custom CSS' box and 'Save' it.

.video-responsive{

    overflow:hidden;

    padding-bottom:56.25%;

    position:relative;

    height:0;

}

.video-responsive iframe{

    left:0;

    top:0;

    height:100%;

    width:100%;

    position:absolute;

}

Add a Vidigami set to the Log-in, Summary or Student Pages

To add a Vidigami set to a page, choose which content area to manage from the Parent Portal Content setup page within Settings-->Portal-->Parent Portal Content.

  • Login Page Description: Customized content for the login page.
  • Portal Widget: Customizes content for the portal Summary page (the first page a parent views upon logging in, which lists all of their applicants/students).
  • Contact Communication Area: Customized content on the student checklist page, above all checklist items.
  1. Select which area you want to customize.
  2. Click over to the code view, which is a button along the far left : "< / >"
  3. Insert the following code into the SchoolAdmin parent portal template and save:<div class="video-responsive"><iframe src="SET_LINK" frameborder="0" allowfullscreen></iframe></div>
  4. Go to Vidigami and copy the direct link to your set and replace SET_LINK with the direct link.  

The result should look something like:

<div class="video-responsive"><iframe src="https://www.vidigami.com/external/slideshow/250203/b97a80f3f0fe6c18d0b803e1e98bcdfe?delay=3500&autoplay=true&loop=true&transparent=false&mute=true&show_title=true" frameborder="0" allowfullscreen></iframe></div>

Go to the Parent Portal and ensure the content is displaying properly.  If you added it to the 'Contact Communication Area' template, you’ll need to have a test student in the portal to preview the content.

IMPORTANT NOTE:  The above example is code snippet, which is different than a normal iframe embed link that you get from Vidigami. The code snippet is designed to work with the custom CSS we inputted earlier.  This embed link will format the content in a way that can be easily viewed on both desktops, iPads, and phone screens.  **If you use the standard Vidigami embed link, the content will display, however, it may be too large or un-viewable on a mobile device.

Add a Personalized Vidigami Content Student Page

It is possible to display custom content on the student page within the parent portal.  Content could be personalized based on interests or it could be unique to the student. 

Interest-Based Content

Interest-based content can highlight aspects of your school that parents are most interested in.  As you gather information during the inquiry and application process, you can focus your message to those topics.  

  1. Go to Settings-->Parent Portal Content and on the 'Contact Communication Area' template, add the following Liquid statement and save:
  2. {% if contact.interest =='STEM' %}<div class="video-responsive"><iframe src="STEM_SET_LINK" frameborder="0" allowfullscreen></iframe></div>{% else %}<div class="video-responsive"><iframe src="DEFAULT_SET_LINK" frameborder="0" allowfullscreen></iframe></div>{% endif %}

In this example, we are showing one set if the student’s interest field is defined as STEM but if not, then there is a default set that displays.  This statement can be nested to create options for multiple interests.  

Unique Per Student Content

Being able to provide content that's unique to the family and student is powerful.  A common example is during enrollment, for both new and returning families.  For returning families, this is an opportunity to share photos from previous years with the family to remind them of the deep bond they have with the school and the community.  

  1. Add a text field to SchoolAdmin (by contacting SchoolAdmin Support) and make sure it appears on the student’s record in the location you want.  Example field name: Vidigami.  Example location: Enrollment Grouping within the Enrollment tab of the student record. 
  2. Go to Settings-->Parent Portal Content and on the 'Contact Communication Area' template add the merge token for that field, which in our example is:  {{contact.vidigami}}
  3. Now go to your test student on the Admin side, find the field on the student record, click on the 'edit fields' button and paste the link for the student’s set into the field. Example:  <div class="video-responsive"><iframe src="STUDENT_SET_LINK" frameborder="0" allowfullscreen></iframe></div>
  4. Now go to your test student in the Parent Portal and you should see the set displayed on the student record.  In this example, if there is no content within the field, nothing will appear.  If you want to have default content appear, you’ll use a code snippet with a Liquid IF statement similar to the interest example.

Additional Resources

Did this answer your question?