1. Home
  2. Display Widgets

Configure Book Display Widget

This page lets you create a new widget, or edit an existing one.

Step 1. Select Items?

Select a Data source. What kinds of items do you want your widget to show off? Choose one, then fill out the additional input below.

  • List of ISBNs. Paste a list of ISBNs to select from.
  • List of ISSNs. Paste a list of ISSNs to select from.
  • List of UPCs. Paste a list of UPCs to select from.
  • Webpage. A URL from which we gather ISBNs.
  • RSS feed. An RSS URL from which we gather ISBNs.
  • Items tagged. Draws from LibraryThing for Libraries' 90+ million tags—tags like "chick lit," "paranormal romance," "American history." "Tagmashes," the intersection of two tags, such as "romance, zombies" are also possible.
  • Genre. Pre-determined subject categories.
  • Series. Items from one or more series, drawn from ProQuest's series coverage.
  • Awards and Honors. Items from one or more awards, drawn from LibraryThing's awards coverage.
  • Publication date. Items published within a specified date range.
  • Call numbers. Items within a given call-number range or ranges.
  • Popular. Items popular in your library and libraries like yours.
  • Uploaded holdings. Anything in your library's holdings.

Filter to Holdings. Choose whether you want to limit items in your widget to items found in your holdings or not. If you choose only your holdings, we will only show items in your library.

Step 2. Results

At-a-glance information about the items in the widget: Number, Excluded items, and Annotated items. To exclude or annotate items, click on "See Details."

See Details Popup

Annotate items, show items without covers, and exclude items.

  • Annotate Add information to any item with plain text or HTML.
  • Show Without Covers By default, we do not show items for which we have no cover match. If you would like show those, turn the toggle at the top of this page to on.
  • Exclude Items are included by default. Click the red exclude button to remove that specific items from the widget.
  • List of ISBNs We generate a plain text list of all ISBNs found in a widget. Click "Toggle List of ISBNs" to reveal them.

Step 3. Style

Select one of four display types: Dynamic Grid, Carousel, Scrolling, or 3-d Carousel. Each style defaults to an appealing group of settings. Some options for customization appear immediately below the style selector. More options are available under the "Advanced Options" button.

Options for each style

  • Cover size Select from x-small to x-large cover sizes
  • Dynamic Grid
    • Rows Number of rows in the widget.
    • Covers per row How many covers in a given row.
  • Carousel
    • Covers per row Select how many covers you want to show in every rotation through the shelf.
    • Type This widget can be horizontal or vertical, and has a shelf option for horizontal orientation.
  • Scrolling
    • Type Scrolls come in both horizontal and vertical orientations.
    • Scrolling Speed Select how fast you want the scroll to flow across or up the page.

Advanced Options: General

Appearance

  • Widget size Widgets will automatically resize to best fit the surrounding page whenever the page is loaded. Great for libraries with mobile-responsive sites! Choose Manual to set your own height and widths. Good if there's extra white space at the bottom of your widget.
  • Display Sorting Select in what order you want items to show in the widget. Sorting randomly will show a different selection of items every time the widget loads. Other options are alphabetical by title or author, or date of publication (recent first).
  • Easy Share Icon Select On to let anyone take a screenshot off your widget through the Easy Share button that will appear on the bottom right corner of your widget. Turn off and make screenshots yourself within widget creation.
  • Custom Cover URL Augment our existing cover service with your own. URLs should look something like http://www.yourcoverservicehere.com/UNBOUNDREPLACE, where UNBOUNDREPLACE is replaced with the ISBN of the cover
  • Cover Sizing Select whether covers should have forced width, height, or be cropped squares.

Link to Catalog

  • Custom Link URL Add a different URL than your regular ISBN linking URL if items in this widget should go a different destination. Remember to use the “XXX” configuration. Example: a catalog that requires a different search URL for ISSNs or UPCs rather than ISBNs.
  • Opens Choose how you want covers to link into your catalog, by going directly to that page or launching in a new window. Note: some mobile devices (iOS) block popups by default, which breaks functionality if you choose to open in a new window. Direct linking is recommended to ensure mobile compatibility.
  • Use Popup Box Choose to show a popup detail box containing cover, title, author, and in many cases summary, as well as a link to the item in the library. Turn this setting off if clicking a book and going to the catalog directly is desired.

More Advanced Options

  • Custom HTML/CSS to output Add your own HTML or CSS to the widget to help adapt it to your site. See sample CSS classes and ids in the purple floating box.
  • Internal Notes These are internal notes about the widget, viewable from the main list of widgets.

Advanced Options: By Style Type

Carousel

  • Scroll count How many items to scroll forward when the widget advances through the items.
  • Maximum items How many items to load into the widget at a given time.
  • Automatic Scrolling If "on," the widget will advance forward a few titles at a time without clicking the arrows.

3-D Carousel

  • Automatic Scrolling 3-D carousels can be still, or advance one item at a constant interval. Determine that with the drop down menu, here.
  • Number of Covers Most widgets will work well with auto covers. Adjust up or down in this setting.

Step 4. Preview

This area shows what the widget will look like on the webpage, and changes dynamically as you adjust settings. When the preview is perfect, remember to save your widget!

Step 5. Save

Remember to Save Changes when you're done.

Step 6. Embed

Here are the two pieces of code required to add a widget to your webpage or blog, and also links to static images of the widget, formatted for different social media platforms.

The HTML box is a div containing the widget. Place this bit code of where the widget should actually go on the page. In many cases, this might be a section that accepts outside code in your CMS. This must go where you want the widget to be.

The Javascript box contains our snippet of Javascript code that lets us send data to your website or blog. You can place this anywhere on the webpage, but most libraries put it next to the HTML code so it’s all in the same place.

Share Images

Social MediaUse this function in webpages or blogs where Javascript isn't allowed. Select which social media platform you wish to use the image on and use the provided link or click the download button, below.

Newsletters This HTML will show to an image of the most recent version of your widget. Add a URL for the image to link to (like a homepage or reader guide), or leave it blank. Great for newsletters and blogs that don't accept Javascript.

Need more help?