Skip to main site navigation
Skip to main content
Switch to text-only view
Switch to default view
this is a photo of an ethernet cable

Inserting JavaScript


Creating a folder

**NOTE: This step may be optional, depending on whether or not you have already created a folder for JavaScript files on your site. Create a new web content folder inside of the main folder of your site:

  1. Click New > WRAP_SDDU > SB-IUSB-CAMPUS > IUSB-Site > Web Content Folder
  2. In the display name field, type "javascript"
  3. Select the "no" option for "Display in the Left Navigation?"
  4. Click Submit

Creating your JavaScript file

First you will create a file for your javaScript code. Inside your javascript folder create a new default file:

  1. Click New > Default > File
  2. In the system name field, give your new file a meaningful name, in this example "script.js"
  3. Type or Copy/Paste your javaScript into the File Contents text box

New Default File

You can always come back to this file later to make edits.

Link your JavaScript to your web page

Now that your javaScript file has been created in Cascade, you need a way to link it to your page. You will have to create a new XML code block that allows you to insert content in the head section of your web page. To create a new XML code block:

  1. Select the javascript folder
  2. Click New > Default > Block
  3. Select XML Block
  4. Click Submit

New XML block

After clicking submit, a second new block page loads in the browser window.

  1. In the System Name field give your new block a meaningful name, in this example javascript-head-block
  2. In the XML text box type this HTML code:

    <script src="[path]/[filename]" type="text/javascript">
    </script>

    *[path] is the file path to your javascript file
    *[filename] is the name of your javascript file

New Block Screen

Finally you will need to insert the XML code block into your page:

  1. Click the page that you want to edit
  2. Click the edit tab at the top of the page
  3. Click the Configurations link under the Copy tab
  4. Scroll to the bottom of the page and locate the Optional-Head-Code section
  5. Click the block icon leggo block icon, a new window will pop up
  6. Navigate to and click your XML code block
  7. Click Confirm, the pop up window will disapear
  8. Click Submit at the bottom of the configurations page

Navigate to block

After completing all of these steps make sure to publish your page and your javascript folder. Your javaScript should now be ready to go. To test your javaScript navigate to your page through a web browser.

Troubleshooting

If your script isn't working try the following:

  1. Make sure your javaScript is written properly. One simple syntax error can break your whole script. You can find help with writing javaScript here:
  2. Make sure the file path in your XML code block is written correctly.
  3. Publish your javascript folder AND your web page.