How to use our Nitro Apps

Millions of Students and Parents trust Nitro to help them afford college. Nitro has partnered with a diverse group of lenders to help consumers make informed decisions on how to close the gap when financing school expenses. The Nitro lender app is fully customizable to be integrated into your website, while Nitro manages the accuracy and presentation of information to ensure the consumer is equipped with the most up to date information.

The Nitro Private Student Loan App:

Live Example

Getting Started

Please ensure the element you're injecting the Nitro app into is responsive, and does not have a fixed height. It is responsive, but does not take the container widget into account. The minimum width of the container should be 400px.

Add a container

Insert a container on the page where you'd like the Nitro app to appear.

<div id="psl-products-widget"></div>

Include script

Include the below script before the closing tag, or after the div.
NOTE: Nitro will assign you a unique SiteID for use

<script src="https://loans.nitrocollege.com/v2/build/bundle.js"></script>
  <script>
    new NitroWidget({
      target: document.querySelector("#psl-products-widget"),
      props: {
        widgetId: "SL",
        placement: "page",
        style: "products-slm",
        siteId: "004",
      },
    });
  </script>

Inside a standard site, this may look something like:

<html>
<head>
<title>Your Title Goes Here</title>
</head>

<body>
<div class="container">
<div class="col-md-10">
<div id="psl-products-widget"></div>
</div>
</div>

<script src="https://loans.nitrocollege.com/v2/build/bundle.js"></script>
 <script>
  new NitroWidget({
    target: document.querySelector("#psl-products-widget"),
    props: {
      widgetId: "SL",
      placement: "page",
      style: "products-slm",
      siteID: "004",
    },
  });
</script>
</body>
</html>