Skip to Main Content

LibGuide Tricks: Rotating Boxes

Tips to use in LibGuides 1 - DO NOT USE IN LIBGUIDES version 2.

LIBGUIDES 1

PLEASE NOTE THAT THIS INFORMATION IS FOR LIBGUIDES 1 ONLY - DO NOT ATTEMPT IN LIBGUIDES 2.0.

Rotating Boxes

Have boxes rotate on a page everytime it is refreshed or opened.

Code for example:

<script type="text/javascript">
// List the box IDs you want to select from. 
var randomBoxes = [12919885, 12920039, 12920080];

var randomBox = randomBoxes[Math.floor(Math.random()*randomBoxes.length)];

// Construct the API call below.

document.write("<style>#api_box_iid2039_bid" + randomBox + " .headerbox { display: none; } #api_box_iid2039_bid" + randomBox + " .outerbox { background: #FFF; } </style> <div id='api_box_iid2039_bid" + randomBox + "'></div><script type='text/javascript' src='http://api.libguides.com/api_box.php?iid=2039&bid=" + randomBox + "&context=object&format=js&css=0'>&lt;/script>"); 

</script>

</script>

Instructions

  • Create a page to house the boxes used to rotate, or use ones that are already created (you can not use linked boxes, must use original). See our New Materials Rotation page on this guide to show where we housed our boxes.
  • Create the boxes you want to use and write down the box IDs.
  • Enter the box IDs in the line of code: var randomBoxes = [12203444, 12203675, 12203721, 12203825, 12203901];
  • Replace 2039 with you institution ID code (obtain this from the url of your admin sign-in page).
  • Paste the code into a new box on the guide you want to feature the rotating box.

test