Collection Spotlight Grid#
Primarily used on the Books Movies Music pages to display a 4-column row of single-cover catalog promos. Each grid row must contain 4 collection spotlights across.
Create Collection Spotlight in Library Catalog#
-
Go to the library catalog, create a list, and add items to the list. If you already have a list, skip this step.
-
Go to the lists page:
-
Click the user icon in the upper right.
-
Select “lists” from the menu.
-
-
On the list page, click the Edit button.
-
On the edit screen, mark the list public. Your list must be public to create a collection spotlight.
-
Once your list is marked public, you have the option to include or exclude the list from search results. Select yes or no, then click Update to save your changes.
-
After saving your changes, you’ll see “create spotlight” at the top of your list. Click “create spotlight.”
-
You’ll be asked to give your spotlight a name. We recommend naming the spotlight the same as your list so the spotlight and list titles match. IMPORTANT! Your spotlight title must have less than 50 characters.
-
On the next page, we need to customize the spotlight. Click Edit.
-
Fill out the following fields:
-
Name: If you need to edit the spotlight name, do it here. The name must be less than 50 characters.
-
Description: Add a note about where the spotlight is used. If you’re adding to a blog post, type something like “spotlight for newbery winners blog post 2015.”
-
Number of Titles: Default is 25, which is generally a good number. You can make this smaller if you like.
-
Uncheck the next three boxes. We do not want to show the title, author, or ratings for titles.
-
Style When Displaying List Widget: Choose Single Title.
-
Cover Size to Use: Choose Medium.
-
Custom CSS File: Use https://assets.library.nashville.org/css/aspen-widgets.css
-
Cover Size to Use: Medium
-
For the next two boxes: Uncheck “show list widget title bar.” But DO check “show the view more link.”
-
Display Mode for Search Results: Choose Covers.
-
-
Click Save Changes and Return.
-
Scroll down until you can see the “Collection Spotlight with Resizing” code. Copy ONLY the iFrame URL -- this is the URL in the blue box above the iFrame code. You do NOT need the entire iFrame code snippet. You only need the URL, like the example highlighted below.
Add a Catalog Spotlight (Widget) Grid to the Website#
-
Add the Catalog Widget Grid component to your page.
-
Fill out the form:
- Title and iFrame Title: The type title for your widget that will display to the user.
- iFrame URL: Paste the iFrame URL from the widget code in catalog.
- iFrame Title: Use the same title in both the Title and iFrame Title fields.
-
Repeat the steps above until you have 4 catalog widgets. You must have 4 widgets in a row.
-
To add another row of 4 single-cover catalog widgets, repeat steps 1-3 above until you have 4, 8, 12, etc., widgets in your grid.