Welcome to Book Display Widgets Book Display Widgets allow you to create virtual book displays on your website, where covers link to that item s record in your catalog. As a subscriber to Ebook Central s Academic Complete collection, those holdings have been pre-loaded to your account along with subject lists to make creating new widgets quick and simple. You may also upload additional holdings, and combine your data with ours to show off award winners, series, genres, and more. Use our beautiful pre-set styles, or customize to your heart s content. Create as many widgets as you would like, and configure each individually. This manual contains three sections: 1) A quick introduction to Book Display Widgets 2) Configuring your LibraryThing for Libraries account 3) In-depth widget creation instructions A Quick Introduction to Book Display Widgets The widget creation process is separated into six different sections: Select Items, Results, Style, Preview, Save, and Embed. Select Items is where you choose which items go into your widget, and Results is where you refine and annotate those items. In Style, you select a display type and can modify from default settings. You can mix and match data sources and display types. Preview is where you can see what your widget will look like, and Save is where you name and save a widget. The Embed section gives you the code required for embedding a dynamic live widget on your website, or a static image to use on social media and newsletters.
Select Items Choose which data source you would like to use. Selecting Academic Complete will provide you with the subject lists curated specifically for your use with Book Display Widgets. Other examples of data sources are: a Webpage, a List of ISBNs, Genre, or Awards. Results Shows at-a-glance information about items in the widget. Also shows any items excluded for lack of cover, and number of annotated items. To check over individual results or write annotations, click on the See Details button. Style Choose what you want your widget to look like. The four options are: 3-D Carousel, Dynamic Grid, Carousel, and Scrolling. Every display type can be customized, or you can stick to the attractive default settings. More options are available by clicking the Advanced Options button. Preview We show what your widget will look like when embedded on a webpage. Don t like how something looks on your widget? Change it in the Style section above and see your widget change in this section. Save Remember to save your widget! You can always modify existing widgets after saving by opening them from your list of widgets. Embed This generates the code necessary to embed widgets onto your website or blog. There are two code snippets: Javascript which allows the widget s data to go through to your page and HTML so we know where to put it. Additionally, this section generates a static snapshot of your widget for use in places where regular widgets cannot go, such as Facebook posts, Tweets, Pinterest, or email newsletters. Multi Widgets and Facebook Integration You can create multi widgets that allow for multiple widgets to be in the same place, switchable in either tabs or a dropdown menu. Make a multi widget by first creating the individual widgets you want in the multi widget, then going to the multi widget section, creating a new multi widget, and selecting the widgets you want in it. You can then name the multi widget, choose a theme, and add your own custom CSS. Adding a multi widget to your web page or blog is done the same way as adding a regular widget. Add widgets to a Page Tab in Facebook through the Facebook Widgets section. Configure the widgets you want to use first, then connect while logged into a Facebook account that has administrative privileges for your library s Facebook page. Configuring your Facebook widgets
consists of selecting widgets to add to the Facebook tab and ordering them via drag and drop, then customizing the appearance of your Facebook Page Tab with CSS. The main classes and IDs have been provided. Customizing Your Widget Book Display Widgets have a set of default styles which are engineered to look good out of the box on most websites. However, if you would like to customize each widget, click on Advanced Options in the Style section to change additional aspects of the widget s appearance. You have the option to use outside custom content in your widgets, integrating with other cover services and directing a particular widget to a different catalog or search type than Ebook Central or your OPAC, as well. Custom Covers Book Display Widgets come with covers, but you can augment this cover service with your own. To incorporate your library s cover images, copy the URL of any cover in your service and replace the ISBN with MAGICNUMBER, e.g. http://www.coverservicehere.com/isbn/ MAGICNUMBER. Then place this URL into the Custom Cover URL field in Advanced Options under Style. Custom URL for the widget In most cases, widgets will use the account-wide ISBN URL from Global Configuration to link into Ebook Central or your OPAC. However, in some particular cases, you might prefer to link to a different catalog or use a different search parameter. For example, you may want to link specifically to a classic catalog, or use a search for UPCs or ISSNs. In cases such as these, simply create an ISBN (or ISSN or UPC) search URL for the desired destination (instructions below) and paste it into the Use a custom URL for this widget box located in Advanced Options under Style. Configuring Your LibraryThing for Libraries Account Before any off-campus user will be able to access your Ebook Central catalog through a Book Display Widget, you ll need to add your proxy prefix to the ISBN-based URL we created for you
when we opened your account. Navigate to the Enhancements Tab, and then to Global Configuration. Find your Ebook Central ISBN-based URL, and add the proxy prefix at the start of the URL, like so: http://ezproxy.domain.edu/login?url=https://ebookcentral.proquest.com/lib/yourschool/search.action?que ry=magicnumber If you only wish to create widgets using the pre-loaded Academic Complete holdings, you re all finished in Global Configuration and may ignore the following steps. However, if you want to take advantage of the full breadth of the product, you ll need to take just a few moments to set up OPAC and holdings information. ISBN URLs In Global Configuration, you ll see that we ve automatically created your Ebook Central ISBN-based URL, so you can use that as an example of what the URL for your catalog might look like. You need to figure out what URL can have an ISBN included in it to show you the search result or bib record for that item. Put the placeholder MAGICNUMBER where the ISBN will be filled in, e.g. http://www.yourlibrary.org/search=magicnumber Fill in your absolute ISBN-based URL. This URL will be used to link from the items in widgets to your catalog when holdings source (the default) or catalog is selected under linking options. Click "Save settings. Uploading Holdings Uploading your holdings allows you to use the full range of data source options available. Data sources you may use to create widgets of titles not in your Academic Complete collection without uploaded holdings are: List of ISBNs/ISSNs/UPCs, Webpage, and RSS Feed. All others require a holdings upload. To upload your holdings, go to the Enhancements tab of your LTFL administration section, then "Holdings" > "Upload Holdings." Export your holdings to a variety of MARC formats, or create a formatted.tsv file with the columns in this order: ISBN<tab>Title<tab>Author. Then upload that file to us, making sure to choose the correct setting for the file you are submitting. For an export of all your records, use Replace All Records. To add more records, choose Add New Records. You may also set up an FTP upload to our servers if your library has that capability. Most paid FTP clients offer an automation option, which allows you to configure FTP once and simply set it to run once a month or so. We will occasionally send you a reminder, but it is up to your library to determine how often you export and upload holdings.
In-depth Instructions In this section, every possible setting is discussed in detail. First for the general widget creation page, then the multi widget configuration and Facebook integration pages. The Widget Creation Page This is where each individual widget is created and customized, and the code is created to embed it on your webpage. Below are stepwise instructions for creating new widgets, as well as an exhaustive list of all available settings. 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. Academic Complete. This gives you a list of AC subjects from which to choose. List of ISBNs. Paste a comma-separated list of ISBNs. List of ISSNs. Paste a comma-separated list of ISSNs. List of UPCs. Paste a comma-separated list of UPCs. 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. Items from one or more award s recipients, 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. Random. 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. When Filter to Holdings is set to ON: If you have not uploaded holdings, you will only have Academic Complete as your holdings source option. If you have uploaded holdings: If you choose only your Academic Complete holdings under Holdings Source, we will only show items from that collection. If you choose your uploaded holdings, we will only show items from your OPAC holdings that have been uploaded to us. If you select both, we will show titles from both Academic Complete and your uploaded holdings, but nothing that is not in one or the other. This means that if you enter a list of ISBNs but your holdings aren t current, some items may not populate. 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, including links and gifs. Show Without Covers. By default, we only show covers for which we have a match. If you would like show all covers including automatically generated generic covers turn the toggle at the top of this page to on.
Exclude. All Items are included by default. Click the red exclude button to remove that specific item from the widget. This is useful in data sources like Tags, for example. 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 configuration of settings. Some options for customization appear immediately below the style selector. More options are available by clicking the "Advanced Options" button. Options By Style Cover size. All widgets have the option to select cover sizes, from x-small to x-large. Dynamic Grid Rows. Number of rows in the grid. Covers per row. How many covers in a given row. Carousel Covers per row. 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 available in both horizontal and vertical orientations. Scrolling Speed. 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, which is great for libraries with mobile-responsive sites. Choose Manual to
set your own height and widths. You ll also want to do this if there is extra white space at the bottom or to the side 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 of your widget using the Easy Share button that will appear below the bottom right corner of your widget. Custom Cover URL. Augment our existing cover service with your own. URLs should look something like http://www.yourcoverservicehere.com/magicnumber, where MAGICNUMBER is replaced with the ISBN of the corresponding title. Cover Sizing. Select whether covers should have forced width or height, or be cropped squares. Link to Catalog Custom Link URL. If you would like the widget to send users to a different destination from either Ebook Central, or your OPAC, you may enter an ISBN-based URL for that destination here. Remember to use the MAGICNUMBER configuration. Example: a widget of audiobooks where you want to send the user directly to the vendor site. Opens. Choose how you want covers to link into your catalog, by going directly to that page or launching in a new window. 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 check the item s in the library. Turn this setting off for clicking a cover to go directly to the catalog. Item Link Text. If Use Popup Box is set to On, modify the text of the button that links the detail of the item to the catalog. 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. These notes can only be seen by people with access to your LTFL account.
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 frequency 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. Step 5. Save Remember to Save Changes when you're done. Step 6. Embed Seen 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 of code where the widget should actually go on the page. In many cases, this might be a section that accepts outside code in your CMS. You might need to use Raw HTML or a similar setting for this step. 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 Media Use 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 icon below the text. Newsletters This HTML will show 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. Creating Multi widgets Multi widgets put multiple widgets into one location on a page, conveying large amounts of information in a smaller amount of pixels. Great for homepages, catalog search pages, or anywhere you might want to highlight several displays at once. Creating a multi widget is easy: first, make all the individual widgets which will go into the multi widget. Then, select them, add some flourishes (or don t), and embed your multi widget the same way you embed a regular one.
Detailed instructions First, make all the widgets you would like to be in your multi widget. Next, go to Enhancements > Configuration > Book Display Widgets, then at the bottom of the page of your list of widgets, click Add a new multi widget. Step 1: Select widgets to include. In this pop-up, click the green include button on the far right of your list of widgets to add each widget to the multi widget. Don t worry about order: you can change that later. If you wish to edit that individual widget, click the edit button. Once you have selected all the widgets, click the close button at the bottom of the pop-up. Then, give your widgets names to be displayed in the multi widget, in the text boxed provided. Step 2: Multi Widget settings. Give your multi widget a title which will appear above it (or don t). This is also where you can set a manual height and width for your multi widget, and choose from either tabs (default) or a dropdown list of widgets within the multi widget. CSS Tip! Our multi widgets come by default with a bright blue background on each tab. If you wish to change this color to something that suits your library s branding, use this code in the custom CSS box in Step 2 and change the color to your desired color:
ul#title_list li.active a { background-color: #333333!important; color: white!important; } ul#title_list li a { color: #333333; background-color: white; } Step 3: Preview Check to make sure your multi-widget looks like you want it to. This is the place where many librarians realize that the most attractive multi widgets are usually all of the same display style and cover size. Step 4: Save Don t forget to save your multi widget, the same as you do with regular widgets. Step 5: Embed As with regular widgets, copy the provided Javascript and HTML code snippets and place on your website or blog. Remember, each Javascript only needs to occur once per page, while the HTML for each widget is placed where you would like the widget to reside. Creating a Facebook Tab with Book Display Widgets You can add widgets to your library s Facebook page as a separate page tab, accessed similar to Photos or Events. It creates an interactive page of widgets which work as they do on regular webpages. Patrons can click right from your Facebook page into the catalog.
Connecting your account to Facebook In order to use Book Display Widgets in Facebook, first you need to connect your accounts. 1) Log in to a Facebook account that has administrative power over the intended Facebook page. 2) In the same browser, log in to your account for Book Display Widgets. 3) At the bottom of your list of widgets (Enhancements>Book Display Widgets), there is a table labeled "Facebook Widgets." Click "Configure Facebook Widgets." 4) After the introduction paragraph there is a sentence with a link to connect your Facebook: "In order to add Book Display Widgets to your Facebook page, click this page to authorize." Click "this page." 5) This will take you a page on Facebook where you select a Facebook page to put your Book Display Widgets on. 6) Select the Facebook page you're looking for, and then click 'Add Page Tab'. 7) You should see a page with a large button allowing you to click back into your account to configure your Facebook tab. Configuring your Facebook Tab Our Facebook tab allows you to add as many widgets as you want and insert text and custom elements around them. 1) Navigate to your list of widgets (Enhancements>Book Display Widgets). 2) Scroll down to see the Facebook Widgets area. Click on Configure Facebook Widgets. 3) Select which widgets you would like to include in your Facebook tab. Click "Add a Widget" and select widgets by clicking the "Include" button. Close the window when you're done choosing widgets. 4) You can change the order of the widgets by dragging them into new positions. 5) Give your widgets new titles (or don't!) You can change the title of your widgets that will show on the Facebook tab. This allows you to still retain the regular titles to use in your account while giving you an opportunity to customize each widget title. You can also add HTML elements in the box below the title for each widget. For example, you can add a few sentences above your widget to describe it. 6) Edit your display settings. Here, you can modify the title of the whole Facebook Tab you're creating. The "Page Description" text box is a place for you to put more information. You can choose to put HTML or just plain-text here. 7) In the second big text box, there is space to put your own custom CSS. We have a box to the right with examples of the common classes in Book Display Widgets. Change the color, underline, put it in the center: your widgets can be modified in many ways.