iFrame and Help for changing add to cart button

Also, would you help me a bit on creating a template with a buy now button of my choice,that takes the visitor to the product page, rather than the cart.

Sorry for the double posts, but please help me with adding a “frame” to the images generated by the “image-localised link”, and also a clickable title to it. Many thanks!

Hi,

In answer to your questions:

1. Iframe ad

The ‘iframe image’ template content simply loads an iframe/javascript from the Amazon servers. I have not updated it in a while but it appears to work fine for my iframes.

I assume you are in the US and the iframes are sourced from Amazon.com?

You could try ‘reset’ing the iframe image template in case it has got corrupted (on the Amazon Link -> Templates admin page).

Try going to Amazon Associates product link page, e.g. https://affiliate-program.amazon.com/gp/associates/network/build-links/individual/get-html.html?ie=UTF8&asin=B00DR0PDNE&marketplace=amazon and see if the ‘Live Preview’ displays okay.

2. Add to Cart button

For the default icon, I just found one that was available from Amazon in all locales. You could substitute your own by changing the text '%BUY_BUTTON%' to the URL of your own icon.

3. Buy Now Button

To create a link to the product page simply surround the item with the keywords %LINK_OPEN% and %LINK_CLOSE%, e.g.

%LINK_OPEN%
<img src="https://www.mysite.com/icons/buy_now_button.gif">
%LINK_CLOSE%

4. Frame / Title

I’m not very good with HTML / CSS so you will have to explore this on your own but a starter for ten would be something like:

<div style="margin:2px;border:1px solid;padding:2px">
%LINK_OPEN%
<img alt="%TITLE%" title="%TITLE%" src="%IMAGE%" class="%IMAGE_CLASS%">
%LINK_CLOSE%
</div>
<div>
%LINK_OPEN%
%TITLE%
%LINK_CLOSE%
</div>

Hope that helps!

Paul

1.I am from India, maybe that’s what caused the iframe error.
2.Thanks,now I have it figured out.
3.The code you mentioned should be added as a new template right?
4.On a second thought,I think the images are good without the frame ?? .

Thanks a lot for your fast and extremely helpful response! This plugin deserves much more than simply five stars!!

Hi,

1. Hmmm, looks like Amazon India does not support the old syntax, try this in a new Template (or overwrite the existing one):

<iframe
src="https://%RCM%/widgets/q?lt1=_blank&t=%TAG%&o=%MPLACE_ID%&p=8&l=as1&asins=%ASIN%&ref=tf_til&fc1=000000&IS2=1&&m=amazon&lc1=0000FF&bc1=000000&bg1=FFFFFF&f=ifr&MarketPlace=%MPLACE%&ServiceVersion=20070822&WS=1&ID=8042_ProductLink&Operation=GetProductLink" style="width:120px;height:240px;"
scrolling="no" marginwidth="0" marginheight="0" frameborder="0"></iframe>

3. Yes add the code to a new template or update an existing one.

Cool, glad to help,

Paul

The iframe ad looks like this:
https://s29.postimg.org/eb9j9i4qf/iframe.png

The banner ad looks like this:
https://s22.postimg.org/rh1jm067l/banner.png

And the newly created button template (Saved as template Type “Product”) is working perfectly, except that for some locales, it takes the visitor to Amazon home page (maybe that product isn’t available in that locale).

Sorry if the images are not very clear, as I have done a bad job of cropping!

Note: The product ASIN used in above examples and images is B00ELQUO3C.

Also Paul, (maybe I am asking too much)is it possible to create a whole grid of products with this plugin on a single page? Better still, can each grid feature a “buy now” button that take the visitor to the respective product in the grid.

For example,grid that is similar to any of these:

1.https://s9.postimg.org/3zl2ungi7/grid_5.png

2. https://s16.postimg.org/kumxdf69h/grid_1.jpg

3. https://s29.postimg.org/73zmcfpfb/grid_2.jpg (replace “add to cart” button with “buy now”, and removing that “select to compate” box)

4. https://s29.postimg.org/gh07gjt6f/grid_3.jpg

5. https://s30.postimg.org/5v7k8wcjl/grid_4.png

I hope I am making sense here, and once again, thanks a TON for your wonderful support Paul!

Again sorry for the double post, the current image template is

<div class="al_found%FOUND%">
 %LINK_OPEN%<img alt="%TITLE%" title="%TITLE%" src="%IMAGE%" class="%IMAGE_CLASS%">%LINK_CLOSE%
<img src="https://www.assoc-amazon.%TLD%/e/ir?t=%TAG%&l=as2&o=%MPLACE_ID%&a=%ASIN%" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
</div>

How would I add centre alignment to it by default? (as I have found that it is not possible to align these images by using wordpress editor centre alignment)

Hi,

I’m at work so behind a firewall that blocks most of this stuff, so can’t test the iframe image template.

As for the grid, again you should be able to do this sort of thing with the appropriate CSS styling, but I’m no expert!

The plugin does support this sort of thing in that you can enter as many ASINs as you want in the shortcode, e.g.

[amazon asin=0123456789,2345678901,4567890123,6789012345&template=grid_item]

The following article talks about one method of displaying products in a grid: https://blog.teamtreehouse.com/using-inline-block-to-display-a-product-grid-view

Create the template from the example code and replace hardcoded data with KEYWORDS, e.g.:

<li>
 <img src="%IMAGE%">
 <h4>%TITLE%</h4>
 <p>%PRICE%</p>
 <p>%LINK_OPEN%<img src="buy_now_image">%LINK_CLOSE%</p>
</li>

You would need to update your stylesheet to include the styles mentioned in the article, and then in your post have something like:

<ul class="product">
[amazon asin=0123456789,2345678901,4567890123,6789012345&template=grid_item]
</ul>

Obviously with valid ASIN values.

Paul

Hi,

In answer to your second question, centre alignment only works for fixed width items, as far as I can see.

So in your image template update the first ‘div’ to be:

<div class="al_found%FOUND% aligncenter" style="width:350px">

Adjust the width to be close to your typical image size.

But again this is probably not the best way to do it!

Paul

Thanks for the help with creating grid.
The alignment seemed not to work on my side. Also, I spotted that some products (example : B003L3ARXI) show a smaller image when using the image template (image size kept at a default value of 800).

Also, when I viewed some of my product links from India (for example,using the button template you mentioned in post 4), it took the visitor to the amazon.in homepage, so is it possible that visitors be taken to the amazon.com website whenever that particular product is not available in their region/locale?

Hi,

Unfortunately Amazon does not always have large images for all products, so it will provide the largest available if the size you want is too big.

You could force the width to 800 using CSS, but the image would be grainy/poor quality.

I’ll look into the redirecting to Amazon.com for unavailable items.

Paul

Thanks Paul!

Hi,

One alternative is to turn on Create Search Links, this will take them to amazon.in search results for the product you are linking to, that are not available in the localised domain.

You may also have to enable Prefetch Data as well for this to work fully.

Paul

Going back to the iframe widget, seems Amazon.in only supports the iframe syntax: https://ws-in.amazon-adsystem.com/widgets/q, and all other locales only support https://rcm-eu.amazon-adsystem.com/e/cm?.

I’ll look into changing the %RCM% keyword to include the full URL not just the domain.

Paul

Thanks Paul for all the help!!!