Overview

Occasionally a third-party provider might give you some code to add to your website, to allow you to include an element of their product within your page content area. This article explains how to do this, including examples for MyNewTerm and Microsoft PowerPoint.

Use this option carefully. Making mistakes might affect your website's functionality or cause it to go offline. If you're unsure about what you are doing, speak to someone in your school who is familiar with adding code, or contact our Support Team.

Instructions

1. Select the content area of your page, where you would like to add the third-party element.
2. Select the Add a custom code snippet tool from the Edit toolbar:
   
3. Paste the code provided into the Custom Code Snippet window. The code can contain HTML, CSS, and JavaScript tags:
   
4. Save the page. For more information about save options, visit Juniper Websites: What do the different save options mean?

Outcome

A code snippet block will appear in the content area, to show you have added the item.  

Select Preview in the Edit toolbar to test how the content will look to your end users.

Embedding MyNewTerm

You will need to obtain the API code from My New Term. They will provide three pieces of code (A, B and C) but you will not need all of it.

1. Copy the following code and paste it into the Custom Code Snippet window:
    

   <div id="mnt-parent-container" style="width: 96.7%; margin: 0 auto; background-color: transparent;"></div>
   <script>
   var mntInitCounter = 0, mntApiScript = document.createElement("script");
   mntApiScript.type = "text/javascript";
   mntApiScript.src = "https://api.mynewterm.com/assets/v1/dist/js/school_vacancies.js?v=" + (new Date().getTime());
   document.body.appendChild(mntApiScript);
   
   mntApiScript.onload = function () {
   if(mntInitCounter == 0) {
   mntInitCounter = 1;
   <-- this line will need replacing with the code from mynewterm 
   }
   };
   </script>

2. Open Part C of the MyNewTerm code. Replace the purple text in the Custom Code Snippet window labelled <-- this line will need replacing with the code from mynewterm above with the line in Part C highlighted below:
   
3. If the website is a Trust, you must modify an additional line of code in the Custom Code Snippet. Change the section highlighted below from school_vacacnies.js to trust_vacancies.js:
4. To change the colour of the buttons and titles within the MyNewTerm section, from the default orange, you will also need to add the following code after the </script> tag in the code you have added to the Custom Code Snippet window.  When you do this, replacing the HEX code (highlighted orange) with the code of the alternate colour you would like to use:
    

   <style>
   a.orange-btn-hover,a.orange-btn-hover:hover,span.orange-btn-hover
   {
   background-color: #F06D2D !important;
   color: #ffffff !important;
   }
   .orange-vacancy-div-bg
   {
   background-color: #F06D2D !important;
   }
   .orange-vacancy-title,.orange-vacancy-icon,.orange-vacancy-link
   {
   color: #F06D2D !important
   }
   </style>

Embedding a PowerPoint presentation 

Open the Embed a presentation in a web page or blog article in the Microsoft Support Centre that explains how to embed a PowerPoint into your website.

Updated 12 December 2024 10:24