Amazon aStore with WordPress

spacer Adding an Amazon aStore to WordPress is as simple as pasting a line of code for the embedded br (inline frame). To see an example, click the Real Tea button in the top menu. The “gotcha” is that the default full-width aStore is 796 pixels wide. Add a vertical scrollbar for long pages, and it needs 813 pixels. Does your blog have that much available space in the content area for the sprawling aStore? Most do not.

Nevertheless, many folks insist on cramming ten pounds of ‘taters in a five-pound bag when they add an aStore to their WordPress site. Then they complain that it’s cut off on the right, blaming the store instead of their site or blog layout. My objective in this post is to help you mend your evil ways and understand what you must do to make your store fit your blog or vice versa.

The aStore is a really big WIDGET. It has limitations. You can change its appearance by adding your own styles, or “overriding” CSS, in the Color & Design step of the aStore wizard. That’s it. The aStore is on Amazon’s server, not yours, so there’s no direct access to the code. If you want a completely custom store, and you are a programmer, sign up for the Amazon Advertising Product API, or use one of the many third party applications based on the API.

There are several approaches to fitting an aStore into a site or blog:

  1. Choose a WordPress theme that is wide enough to accomodate an aStore.
    This is not as hard as it sounds. While very few themes have a main content area that’s 800px wide, most newer themes are at least 860px or 960px wide and will allow you to turn off sidebar(s) on specific pages or choose a single-column template. If they do not, you can create your own custom WP Page layout for the aStore.

    You don’t have to buy a premium theme to find one that will work with a store. The free default WP theme, TwentyTen, has great layout choices. The highly-customizable Atahualpa theme includes options for hiding sidebars on specific pages or types of pages and posts without requiring any coding on your part.

  2. Edit your aStore and select a shared theme that makes the store narrower.
    There is a link to Shared Themes in Step 2 – Color & Design, of the aStore editor. You can create your own narrower theme, but it requires attention to every CSS tab in aStore editor, so that the theme displays alright no matter which option a visitor selects. There’s no easy way to seach the shared themes list, unfortunately.

    I have several 680px shared themes in the list. Just look for Narrow Earth, Narrow Blue Centered, or Narrow Red Centered. Once you apply one of these shared themes, you can safely change the color scheme and fonts without affecting styles that change the layout, so it doesn’t matter which one you choose.spacer

  3. If you have a narrow theme and don’t want to change, remove the aStore’s own sidebar widgets.
    Be aware that the Category Navigation widget is in the aStore sidebar, and will show up even if you have not selected any sidebar widgets on the widgets screen. Category navigation may be turned off on the aStore Settings screen. This strategy works best with single-category stores or simple stores with few categories.

    Without the sidebar, an aStore can fit into a column with 547px of horizontal space, 530px for the main products table plus 17px for a vertical scrollbar. If you need a simple category navigation menu, make your own and place it above the aStore. To make this work, give the br an ID and use it as the target for your category links.

  4. If all you need is a few more pixels on the right, remove the store’s 24px body margin.
    To do that select Edit CSS in Step 2 of the aStore editor and type a style for the body margin in the big empty box on the left of the screen: body {margin:0;}

    Setting the margin to zero shaves 48px off the width of the store, pushing it up 24px and left 24px.

Get the details

I don’t want to repeat information from other articles I’ve posted on how to make the aStore narrower. So, for detailed instructions on how to work with the aStore layout, please visit my aStore posts at Greene Teapot.

spacer
May 17th, 2011 | Tags: Amazon Associates, aStore, br | Category: Amazon | 9 comments

Amazon Auto Parts Widget

Update: The Auto Parts widget is back! It disappeared in October 2010, because of changes in the Product Advertising API, but has recently returned to the Amazon Associates' widget list. It's really one of the nicer widgets and works great, if you have an appropriate website for it.

The widget's Go button is disabled and grayed out until the visitor selects an option from each dropdown. This feature ensures that your visitor will get relevant results for year, make, and model and is less likely to order the wrong part.

There is also an "Automotive" section on Amazon that Associates may link to, and it has a similar parts finder search, but it looks a bit different, as shown below:

spacer

Here is historical information from the API announcement from 2010, when the widget disappeared:

API Changes

Due to low usage, the Product Advertising API operations and response groups listed below will not be supported after October 15, 2010:

  1. Operations: CustomerContentLookup, CustomerContentSearch, Help, ListLookup, ListSearch, TagLookup, TransactionLookup, VehiclePartLookup, VehiclePartSearch, VehicleSearch.
  2. Response Group: ListmaniaLists, MerchantItemAttributes, PromotionDetails, Subjects, Tags, TagsSummary, VariationMinimum

Source: https://affiliate-program.amazon.com/gp/advertising/api/detail/main.html

spacer
January 31st, 2011 | Tags: Amazon Associates, widget | Category: Amazon | Leave a comment

Install WordPress on your home computer

I like to try new things with WordPress, but it's time consuming, and occasionally risky, to upload every incremental change or tweak to a remote web host for testing. Wouldn't it be great to have a local test environment with MySql, PHP, and WordPress?

After doing a little research, I discovered XAMPP, with Apache, MySQL, [...]

June 3rd, 2010 | Tags: Apache, WordPress, XAMPP | Category: Web Building, WordPress | Leave a comment

br in a post

As a test, I edited this post in the Visual editor, switched to HTML to add the br, and published. Never go back to the Visual editor after adding an br tag to a post because the TinyMCE editor will strip it out.

It’s advisable to install the tiny RawHTML plugin, if you use [...]

March 23rd, 2010 | Tags: create links, br, WordPress | Category: WordPress | Leave a comment

Link to product details in an aStore br

It’s easy to link to product detail pages in a standalone Amazon store, or to use the target attribute with a custom navigation menu on the same web page as an aStore br. But what if you have several product reviews on various pages of your site, and want to link to their product [...]

March 2nd, 2010 | Tags: Amazon Associates, aStore, create links, jQuery, PHP, product details, script, widget, WordPress | Category: Amazon, Web Building, WordPress | 13 comments

BCPL tips and tutorials

As a volunteer with Friends of the Blount County Library, I'm happy to provide a little extra technical support for fellow users of TEL (Tennessee Electronic Library) databases and a growing collection of eBooks and audio books.

There is a link to BCPL Tips and Tutorials in the top menubar:

If your question is not answered here, [...]

February 13th, 2010 | Tags: audiobooks, Blount County Public Library, eBooks, TEL | Category: Blount County Public Library | Leave a comment

Trying out jing

I have coveted Camtasia ever since I downloaded it as a 30-day trial several years ago, but couldn’t justify the cost. Last week, I discovered Jing. My goal was to find screencasting software for demos on how to access databases from a portal site. First I tried using my trusty copy of SnagIt, which gave [...]

February 10th, 2010 | Tags: jing, screencasts | Category: Web Building | 2 comments

Precise font-size and line-height

I love the flexibility of the Atahualpa WordPress Theme Options list, but I confess to making one change to a core file outside of the Options interface. I added a line to css.php to set the font-size of the root element to 62.5% so that the body font expressed in ems could be calculated as [...]

January 4th, 2010 | Tags: fonts, line-height, WordPress | Category: Web Building, WordPress | Leave a comment

Amazon Video on Demand Widget

Amazon has had a Flash widget for previewing shows offered by its Video On Demand service. Amazon Associates may add the widget to web pages or blog posts. The first step in creating the widget is to select popular types of shows from a menu or choose items from keyword search results. The widget wizard [...]

January 3rd, 2010 | Tags: Amazon Associates, video, widget | Category: Amazon, Web Building | Leave a comment

Create an Amazon Image link

There are several ways to create Amazon image links in WordPress. This post describes how to download a product image from Amazon (or construct a direct URL to a product image), and then use the WordPress Upload/Insert Media wizard to upload the image (or specify the image URL), and create the image link.

Experienced web developers [...]

October 18th, 2009 | Tags: Amazon Associates, create links, image-links, images, widget | Category: Amazon, Web Building | 5 comments
 
  Older Entries »
gipoco.com is neither affiliated with the authors of this page nor responsible for its contents. This is a safe-cache copy of the original web site.