WiscWeb - Embedding Files from UW Box

The WiscWeb service allows its users the ability to embed files from a UW Box directory into a Text Block page element and a post. This document walks you through this process.

Finding and Copying Box Embed Code

You will first need the code from your Box file that you want to embed before placing it on a web page.

  1. Navigate your browser to https://uwmadison.account.box.com/login to log in to your UW-Madison Box directory.
  2. Find the file that you want to embed into your page, and click the three dots icon to the right

    More actions ellipsis

  3. In the menu that appears, hover your mouse over the More Actions option, and then click on Embed Widget.

    Menu Path to Embed Widget selection

  4. The Embed Code will be displayed, as well as a Size option for your item. There will be an opportunity to edit this size value when the code is used in your page. Click the Copy button to copy the embed code.

    Embed code that needs to be copied

Embedding Item on a WiscWeb Page

Now that you have your embed code, you can navigate your browser to your WiscWeb dashboard and edit the page or post that you are going to place this item on.

In a Text Editor text area, Paste the copied text directly into the Visual tab of the text editor. The embed functionality will automatically place the item into the text area and display it.

Embedded code for placing Box item on page

If necessary, you can change the height and width of the placed item. You can do this by clicking on the Text tab of the text editor, and at the end of the code add a question mark (?), followed by a width= and height= parameter depending on what you want to change.

Updated dimensions of an embedded content item

Accessibility and usability barriers

The Center for User Experience has documented accessibility information in Box Accessibility and Usability Information.

Troubleshooting

  • Remember to simply click copy from the Embed Widget function in Box and paste that code directly into the Text Editor area. This will do the embedding functionality automatically.

  • If you are editing the width and height of an item, be sure to put a question mark (?) at the end of the URL, and separate each parameter with an ampersand (&).

  • Issues have been observed with Box file embeds in Firefox. Please consider including a link directly to the Box file in a Text Block in case users aren't able to view the embed.


Keywordsimage, pdf, powerpoint, Box, UW Box, embed, file, page, post, page element   Doc ID109291
OwnerMatt G.GroupWiscWeb
Created2021-02-22 14:51:36Updated2024-06-14 14:05:53
SitesDoIT Help Desk, WiscWeb
Feedback  0   0