Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

New Books: Creating an online display to highlight new additions to your collection

333 views

Published on

Adding a virtual bookshelf display of new material to your library website: what to consider and a basic how-to on getting started.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

New Books: Creating an online display to highlight new additions to your collection

  1. 1. New Books Creating an online display to highlight new additions to your collection Jaime Jones ILS Administrator Arizona State University Libraries
  2. 2. Why highlight new material? Patron awareness Library value
  3. 3. Physical shelf Doesn’t show e-books Limited subset of material Not accessible to online patrons https://www.pinterest.com/pin/534591418238178326/
  4. 4. Virtual shelf Electronic and print material together Material from all libraries Accessible to all patrons Provide multiple display options
  5. 5. Examples
  6. 6. Advantages of the carousel Visual Auto-scroll and manual scroll Mobile friendly Compact
  7. 7. What to display? No serials Items with cover images Material types Locations Subject areas
  8. 8. Creating a display https://bitbucket.org/curtin-library/virtual- bookshelf Download code repository
  9. 9. Substitute Covers
  10. 10. Creating a display Upload bookshelf.js to your web server If using substitute covers, also upload substitute.css and book200.png
  11. 11. Creating a display <head> ... <script src= "//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"> </script> <script src="bookshelf.js" type="text/javascript"></script> ... </head>
  12. 12. Creating a display <head> ... <script src= "//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"> </script> <script src="bookshelf.js" type="text/javascript"></script> ... </head>
  13. 13. Creating a display For substitute covers, also link to the stylesheet: <link rel="stylesheet" type="text/css" href="substitute.css">
  14. 14. Creating a display <body> ... <div id="virtual-bookshelf" style="width: 700px; height: 300px"> </div> ... </body>
  15. 15. Creating a display <script type="text/javascript"> var books = [ { title: 'The Adventures of Sherlock Holmes', image: 'http://covers.openlibrary.org/b/isbn/9780688107826-M.jpg', link: 'http://en.wikipedia.org/wiki/The_Adventures_of_Sherlock_Holmes' }, /* ... more items ... */ ]; </script>
  16. 16. Creating a display <script type="text/javascript"> $(function() { var bookshelf = new VirtualBookshelf.Carousel('#virtual- bookshelf', { stream: new VirtualBookshelf.ArrayStream(books) }) }); </script>
  17. 17. Getting the data Manually generate the file Create a process to translate the data into the file Pull data from system automatically
  18. 18. Getting the data Sierra API MySQL Database PHP queries the MySQL DB and inserts the data into the page
  19. 19. Promotion Mini-carousels Social media
  20. 20. Thank you jaime.jones@asu.edu

×