How do I put a 3D spinning carousel of my books on my WordPress site or blog?
As usual, when I find an answer, I do my best to share, and there are several options for adding a bookshelf, a slider, or a spinning carousel of your books on your WordPress site or blog.
Shelfari has a widget for both Blogger and WordPress. Actually, it’s really cute. A friend of mine uses it on a blog she uses to review Children’s books (for a school project). It actually looks like a wooden bookshelf with all your books facing out.
Of course, there are dozens of plugins and widgets for sliders. These are the “rolling” or “scrolling” banners that progress through a list of specified images. They usually have forward and back arrows, too.
Me? I wanted to visually display the books I have on Amazon on a “spinning” carousel that I could include on my WordPress site. I’ve seen it done before, and the effect stuck with me. I just can’t remember where I saw it. So, I started digging.
Note that many of these fancy-schmancy visuals function on Flash, so they may not work properly on certain mobile devices.
I found a few options, but the one that stood out for my purposes was a free plugin called WordPress-Amazon-Associate. Among other options, it includes an Amazon Carousel Widget that spins specified Amazon books (or ebooks) in a 3D circular motion. The book covers are clickable (in any position…not just centered) and the links use your specified Amazon Affiliate code. Whoo-hoo! Looked good. Sounded good. …took a bit to figure it out.
Actually, it’s not that difficult to set up and configure, but I didn’t find any documentation until after I’d searched around the support forum and the developer’s web site. I didn’t actually open the documentation. I know. …shocking for a tech writer, right? I actually found the answers I was looking for on the developer’s web site before I actually saw the plugin documentation mentioned on the support forum. Hey, this post was specifically on the Amazon Carousel Widget, and it gave me the answers I needed.
Now, let me save you some digging and show you, step-by-step, how it’s done.
Installing and Configuring the Amazon Carousel Widget in the WordPress-Amazon-Associate Plugin
1. Find, install, and activate the WordPress-Amazon-Associate plugin.
There are a couple of ways to install plugins on a WordPress site, but the most common is to use the WordPress Dashboard, go to the Plugins Menu and select Add New.
Search for “WordPress-Amazon-Associate” and click Install Now for the plugin by MDBitz – Matthew John Denton.
Activate the plugin.
2. Once installed and activated, scroll down the menu options on your WordPress Dashboard to the WP-Amazon menu and select Settings.
Use the checkboxes to activate/deactivate the appropriate Amazon Locale(s); then, enter the appropriate Associate Tag (Amazon Associate Tracking ID) for each. (Enabling Geo Localization and such required additional steps, so I just stuck with the United States option.)
Scroll down a bit to the Amazon Web Services Settings. This is a bit of a pain. If you don’t already have an Amazon Web Services account, you’ll need to sign-up to proceed. (No big deal. It’s a free account…just another hoop to jump through.) If you DO already have an Amazon Web Services account, this is still a pain. I couldn’t remember where the Access Key and Secret Key were. Once you find them, it’s easy enough to enter the codes. (After logging in, I found them under the My Account / Console dropdown menu > Security Credentials.)
Don’t forget to click one of the Update Settings buttons to retain all the entered info.
3. With all the settings configured, add the widget or code where you want your spinning carousel.
If you want to use a widget version on multiple pages and/or posts, you can use the WordPress Dashboard > Appearance menu. Select the Widgets option, then drag and drop the Amazon Carousel Widget to a sidebar, header, etc. as allowed in your theme.
Configure the titles, categories, ASINs, etc., then click Save on the Widget to apply.
If you just want to add the carousel to individual posts or pages, you’ll want to create the carousel settings with short codes, then paste it into the html view of the pages or posts.
Sounds nasty, right? Not really.
Here’s the visual way… Open the page or post, then click the Amazon Products/Widget dropdown and select Carousel Widget.
Enter the details you’d like displayed. For this example, I did a Search and Add Widget Type looking in the Kindle Store for Sherry Snider as the keyword. Once you enter your own preferences, click Preview to check it out, then click the Insert button to paste the applicable short code text into your page or post.
Here’s the code I used for my spinning carousel:
(Sorry. I know that's an image of the code rather than actual text, but if I paste the text, it just inserts another spinning carousel. :-) )
This one uses specific ASINs rather than searching by a keyword. Just replace those ASINs with the ASINs of your own books…unless you want to display my books, too. 🙂 Just copy the ASIN from your book’s Amazon listing and paste it into the code in place of mine. Separate each ASIN with a comma.
You can, of course, change the short code settings for the carousel if you’d like. The parameters are defined on the developer’s web site. Too, if you really need to make adjustments, the developer’s pretty good about responding to the blog post’s comments and on the support forum.
That’s it! Give it a spin!
Specifically, I wanted a spinning carousel to display the books and ebooks I authored and offer through Amazon. Technically, though, this plugin would work well displaying other people’s books and Amazon items, too. Hey, it’s linked to your Amazon Associates account, so any sales made from your link could put money in your pocket.
Whether you’re an author, a writer, a blogger, or an internet entrepreneur, WordPress-Amazon-Associate could serve you and your readers well.
A Note About Amazon Associates’s Carousel Widget
Friends have asked why I chose to use the WordPress-Amazon-Associate plugin rather than just using the Carousel Widget available through Amazon Associates’s tools.
First, I’d honestly forgotten about it. Though I’m a fan of the Amazon Associates program, I’ve never been totally comfortable with the online widgets and tools they provide.
Second, I did test Amazon Associates’s Carousel Widget. It flaked out on me in IE, but worked fine in Chrome. After looking at the widget code, however, I decided I liked the short code control of the WordPress-Amazon-Associate plugin better.
For those of you who’d like to try Amazon Associates’s Carousel Widget, here are the basic steps.
Once you’re logged in to your Amazon Associates account, use the Settings dropdown menu on the site stripe to select Options. On the Options page, select the Widgets tab, then click the Carousel Widget link. Use the options to add items to your carousel. (Since I wanted to add my own books, I used the Search and Add Products option and searched for my own name under the Kindle Store category.) Click the Add Product buttons to add 6-10 items to your carousel, then click the Next Step button. Select your preferred display options, then click the Save or Add to My Web Page button to copy the code needed to place the widget on your site.
As I noted, I still prefer the short code controls of the WordPress-Amazon-Associate plugin, but if you use a Blogger/Blogspot platform or other non-WordPress site, the Carousel Widget from Amazon Associates should work just as well. Even if you have a WordPress site, you may prefer the widget. My personal preference is the plugin with short codes, but now you have step-by-step instructions for both. 🙂