Box Embed Widget

You can insert an embedded box widget to allow for people to upload files to a folder on a BOX account or access certain files. Learn how to embed a box widget below!

Steps to Embedding Your Widgets

1. Create a Box Folder (if you don't have one already)
2. Get your embed code
3. Go to the page where you want to place the Box Upload Widget and get to the edit screen
4. Place your cursor where you want the Box Upload Widget to appear
5. Create a Javascript - External Source component
6. Add the copied embed code to the component
7. Save the component
8. To view the widget, save the page 

Getting Your Embed Code

In Box, hover over the folder you would like to embed and on the far right a box with 3 dots should appear. To do this, you must be the owner or co-owner of the file/folder.

Select 'File Request'

Customize your widget appearance in the popup window (title, instructions, etc.) and preview what it will look like.

Don't forget to use the 'Copy' button to copy the source code.  This needs to be from the Upload Embed Widget section, NOT the File Request Link section.

Creating Your Javascript - External Source Component

While editing the page, place your cursor where you want the Box Upload Widget to be and click the component button on the edit bar.

Choose the Javascript - External Source component, and insert.

Add only the URL string from the copied embed code to the External Javascript URL box.

Your original code will look something like this:

You will only be adding content after src= and before the type= section (without the ""), like this:

https://usu.app.box.com/upload-widget/embed.js?folderID=51196847998&height=420&isDescriptionFieldShown=0&isEmailRequired=0&title=Submit%20File(s)%20to%202019&token=axhbqyuvfsi7beju1cg39wpcpgybsbbl&width=385

Be sure to save!

It will look like a blue "pill" on the page until you save the page and preview.

Trouble Getting Access to Your Folder?

If you can't see the 'Upload Embed Widget', you are not an owner or co-owner of the folder.

You can find the person who owns the folder, and ask them to grant you co-ownership (you can do this temporarily), by clicking on More Actions --> Manage Collaborators.  They will be listed as owner or co-owner under permissions.