A New (Free) Way to Sell Books from your Sidebar

POSTED ON Nov 30, 2012

Joel Friedlander

Written by Joel Friedlander

Home > Blog > Author Blogging 101, Marketing > A New (Free) Way to Sell Books from your Sidebar

by Claire Ryan (@rayntweets)

I came across Claire Ryan’s The Raynfall Agency site because I’m always looking for new publishing models that can help authors trying to get their books onto the market. But that’s not what this post is about. Claire also has available on her site a WordPress plugin that she’s created to help you sell your books. (To see a live sample, check the right sidebar on this blog where it says “Click the Covers.”) And it’s free—isn’t that nice? I asked her to explain what it does and how you can do it. Here is her response.


Authors have a problem right now. Amazon, Kobo, Barnes & Noble, and many other websites are available through which they can sell their work, and that’s great. But how do you let readers know about them?

Up to this point, adding a listing to your site about your books has been a colossal pain in the ass, because you really have to know some HTML and maybe CSS in order to get them to display properly. You could also use advertising widgets, like the one provided by Amazon, and hope that your readers don’t use adblockers in their browser.

I set out to make a plugin for WordPress that would make it easy for any author to add their books to a WordPress site, whether self-hosted or on a free WordPress.com blog, and the result is Buy This Book (BTB)—a plugin that displays books in the sidebar with a little slideout menu of website links.

BTB is very straightforward to use. It’s also free (it will always be free) and available through the WordPress Plugin Directory. So here’s how you use it.

Let’s start with your cover image. The height and width of the image is very important, as the plugin won’t resize it to match your sidebar. So, get a copy of your cover that’s small enough to fit into your sidebar.

If you’re going to have two covers side by side, make sure they’re small enough to fit comfortably together. The plugin will automatically add a little space between them, so you’ll need to leave some wiggle room. If you see your covers are not displayed side by side, then they’re probably too big.

  1. Go to Media -> Add New, and upload your cover. WordPress will do its thing, and then show you the details screen for the image that’s now ready to use on the site.
  2. Look at the list of attributes for the image – you’re looking for the one called File URL. Copy this and paste it somewhere convenient. You’ll need this later.

For Self-Hosted WordPress Sites

  1. Go to Plugins -> Add New, and search for ‘buy this book’.
  2. Click Install Now, just below the plugin name, and then hit Okay.
  3. The plugin will install itself, and you just need to click Activate on the install screen for it to become available on your site.
  4. The widget is now ready to go. All you need is the links and images to go into it.

Now for the fun stuff.

  1. Go to the Appearance -> Widgets screen. You should see a new widget called Buy This Book. Click and drag it over to your chosen sidebar, and it’ll open up automatically.
  2. Fill in the header. This is the widget title, and it’ll display above your books.
  3. Paste the cover File URL link into the image box.
  4. Go to each site where your book is up for sale, and copy the link from your browser bar into each entry. The widget can take up to three books, but it ignores any empty boxes, so don’t worry if you only want to add one book with two or three links.
  5. Save the widget. You’re done! Check your site and click on the cover images to see the menu slide out from the bottom.

If you have more than three books, or you want to arrange them on different rows, then just drag another copy of the widget over to the sidebar. You can have as many as you like, and they all can have different entries.

For Free WordPress.com Blogs

Guys, I’m sorry to say it, but free WordPress blogs are out of luck on this. You can’t install plugins, and you can’t have the fun Javascript stuff that makes the menu slide out.

Fear not, however! You can get something close to it with a little more work. Here’s the code:

<div style=”float:left;”>

<img style=”float: left; margin-right: 5px;” src=”https://author.wordpress.com/wp-content/uploads/2012/10/awesomebookcover.jpg” />

<div style=”width: 105px;”>

<a href=”https://www.amazon.com/awesomebooklink.html” title=”Amazon” target=”_blank”>

<img src=”https://author.wordpress.com/wp-content/uploads/2012/10/Amazon.png” alt=”Amazon” width=”32″ height=”32″ />

</a>

<a href=”https://www.kobobooks.com/awesomebooklink.html” title=”Kobo” target=”_blank”>

<img src=”https://author.wordpress.com/wp-content/uploads/2012/10/Kobo.png” alt=”Kobo” width=”32″ height=”32″ />

</a>

<a href=”https://www.smashwords.com/awesomebooklink.html” title=”Smashwords” target=”_blank”>

<img src=”https://author.wordpress.com/wp-content/uploads/2012/10/Smashwords.png” alt=”Smashwords” width=”32″ height=”32″ />

</a>

</div>

</div>

Okay, this does look intimidating, but it’s really not that bad.

Look at the links in bold—those are the ones you want to replace. You need to upload an icon image for each of the services you want to use. (These are included in the plugin for self-hosted sites.)

It’s the same process as for your cover, and you can probably find ones you like on Google Image Search. Size doesn’t matter, as long as the icons are square.

Now, check out each section of the code. The first part is the cover itself. Replace the bold text with your cover link, making sure to leave the quotation marks in, they’re important.

The next three sections are for the icons and links. This is a little more tricky. Each section has two links—one for the actual link to your book, and one for the icon image. I have Amazon, Kobo and Smashwords here, but you can choose whichever sites you want – just make sure to delete any you’re not using.

Okay, got all those links added?

  1. Copy the whole block of code.
  2. Go to your Appearance -> Widgets screen, and drag a Text widget to your sidebar.
  3. Fill in the header.
  4. Paste the whole code block into the Text panel.
  5. Save the widget. You’re done! Check your site to see the cover image with the icons below it.

You can copy this code for any number of books—just change the links and add it to a new Text widget. This is the best you can get with a free blog, and it’ll work for other blogs as well in theory.

I want to add shortcode functionality, and options to change the image size and icon set, to the next version of the plugin. In the meantime, any other suggestions are welcome, and I hope it’s useful to authors everywhere.

Anyone who needs technical support can leave a comment here or contact me through my site.

Claire RyanClaire Ryan is an Irish author and web consultant, now living in Vancouver BC. After hearing the stories of authors scammed by print on demand companies with nothing to show for it, she started the Raynfall Agency in 2012 in the hope of developing a better way do publishing. Her first work, The Author’s Marketing Handbook, is part of her overall plan to get the basic knowledge of online marketing into the hands of as many authors as possible. You can contact her at www.raynfall.com.

Joel Friedlander

Written by
Joel Friedlander

Book Cover Design Checklist

Set your book up to SELL with our FREE Book Cover Design Checklist to boost the quality of your book to its very best!
Liked this post? Share it with friends!

More Helpful Articles