Submission Portal Inline Frame Code

This article is considered appropriate for administrators or workspace users with an intermediate level of knowledge about submission portals. If you are a beginner, we recommend reading the following article first:

• Submission Portal Key Concepts: Beginner

For more information about suggested learning paths, see Introduction to Submission Portals: START HERE.

Contents

• Overview
• The Purpose of Submission Portal Inline Frame Code
• Where to Find the Submission Portal Inline Frame Code
• Copying the Submission Portal Inline Frame Code

Overview

This article will explain where to find and copy the HTML code to insert the submission portal into another website as an inline frame, or “iframe.”

The Purpose of Submission Portal Inline Frame Code

While portal users will typically access a submission portal using a separate URL web address in their browser, it is possible to embed access to the submission portal directly into a website using an “inline frame,” or iframe. An iframe is an HTML document embedded inside another HTML document on a website. While these are commonly used for advertisements, they can also be easily used to allow users to access a different website without navigating away from the website they are currently viewing. 

Embedding the submission portal into a webpage in an organization’s website as an iframe is the most common usage of this feature. While it is optional, some organizations prefer to do this rather than publishing an external link. This may be the case if a program’s applicants will be less likely to apply if doing so requires accessing a different website. It may also be preferable if specific terms and conditions for applying to a program are clearly listed on an organization’s website, and adding those links in forms or portal text in the submission portal itself is not desirable for whatever reason.

Finding the HTML code to embed the submission portal into a different website is simple and can be accessed within the Submission Portal Settings. However, embedding it in another website does require a moderate knowledge of HTML coding, and those steps are not covered in this article.

Where to Find the Submission Portal Inline Frame Code

In the Submission Portal Settings, the iframe code for a specific submission portal can be found on the Portal Settings page. 

To access the submission portal iframe code:

1. Logged into a program as an administrator, navigate to the Settings & Tools section by selecting the cog wheel icon in the top navigation bar.
2. Select the Submission Portal tile from the Plugin Settings section.
3. Select the Edit button to the appropriate submission portal.

4. The Submission Portal URL section, where the iframe code button is found, is at the top of the General Settings tab of the Portal Settings page. This is the landing page upon entering the Submission Portal Settings.  

5. The Copy iframe Code is the right-most button (</>) next to the submission portal URL. (This button’s alt text will read “Copy iframe Code” when you hover a mouse cursor over the button.)

Copying the Submission Portal iframe Code

After navigating to the Submission Portal URL area:

1. Select the Copy iframe Code button to the right of the URL as shown below.

2. A popup appears with the full HTML code snippet displayed, allowing the HTML code to be copied. 

3. After copying the code, select the Close button on the popup window.

4. After the code has been copied, open the HTML editor of choice and insert the code into the larger code block where the submission portal iframe should appear.

--- IMPORTANT ---

If the submission portal URL is edited or changed after the iframe code for the submission portal is used in another website, the iframe code snippet will have to be updated on that website for it to continue to work.  The iframe code includes the submission portal URL, and will not automatically update if the URL is changed.