Guide FAQ - Your LibGuides Questions. Answered!

Click on one of the links above - the instructions will appear here!

Have a random box display each time the page is loaded

1. Go to a guide—any guide—and create individual boxes for all of the content you want to feature in the rotation. (It can be an unpublished guide or a hidden page on the guide where you want the content to appear.)

   If the boxes already exist in your system, even easier! You can always use those box IDs.

2. After that's done, jot down the box ID numbers of the boxes you created. This is easy: just hover your mouse over the 'edit' link in the upper right hand corner of each box. It will show you the box number.

3. Open a new tab or browser window, and create a Rich Text box to display your rotating content. Click add/edit text, and then click the Plain-Text Editor tab.

   Paste the code from the Rotating Box Code file (download below).

4. Go to the third line of the code—the one that has a list of numbers between brackets. It looks like this:

   var randomBoxes = [12203444, 12203675, 12203721, 12203825, 12203901];

   Replace those numbers with the box ID numbers you jotted down in step 2.

5. Change #### in the code—it appears four times—to the institution ID of your LibGuides site. (How to find your site ID)
6. Click Save and Close! Reload the page a few times to see the rotation in action. That’s all there is to it. When you want to add different content to the rotation, just edit the boxes you created in step 1. :)

Caveats:

1. You cannot use linked boxes. (You can, however, use the original box, or make a copy of box.)
2. You cannot use boxes that contain JavaScript, because this code will not render the JavaScript.

Have boxes rotate at a certain interval

1. Go to a guide—any guide—and create individual boxes for all of the content you want to feature in the rotation. (It can be an unpublished guide or a hidden page on the guide where you want the content to appear.)

   If the boxes already exist in your system, even easier! No need to create new content if you don't want to.

2. Open a new tab or browser window, and create a Rich Text box to display your rotating content. Click add/edit text, and then click the Plain-Text Editor tab.

   Paste the code from the Rotating Boxes - Changes At Intervals file (download below).

   Go back to the set of boxes you created in step #1. Grab the API call for each box by heading to edit > Edit Box Info > Box Link & Embed Code:

   

   Paste all your API calls between the headings labeled

   <!-- BEGIN: API box output -->
   and
   <!-- END: API box output -->
3. Next, modify each API call. The first API call should have style="display: block;" added to it, while the rest should have style="display: none;" added to them. Here's an example:

   <div id="api_box_iid880_bid8312632" style="display:block;"></div><script type="text/javascript" src="http://api.libguides.com/api_box.php?iid=880&bid=8312632&context=object&format=js&css=0"> </script>

<div id="api_box_iid880_bid10454330" style="display:none;"></div><script type="text/javascript" src="http://api.libguides.com/api_box.php?iid=880&bid=10454330&context=object&format=js&css=0"> </script>

<div id="api_box_iid880_bid8312638" style="display:none;"></div><script type="text/javascript" src="http://api.libguides.com/api_box.php?iid=880&bid=8312638&context=object&format=js&css=0"> </script>

4. Skip down to the section that begins with Function call..., and replace YOUR BOX DIVS with the ID listed in each of your API calls. If you'd like, you can also change the time each box displays (the rotation time). To use our example above:

   // Function call with list of API box div ids and rotation time (seconds).
rotateContent({ content_ids: ['api_box_iid880_bid8312632', 'api_box_iid1_bid6366801','api_box_iid880_bid8312638'], rotation_time: 10 });

5. Click Save and Close - you're done!