If you have a
responsive website
,
you should integrate responsive widgets instead of fixed size widgets. The responsive widget code automatically adapts the widget size to your page layout. The served widget size matches the size of the parent container.
For example, if the parent container has height and width of 600 pixels by 728 pixels, we will serve responsive widget of size 600x728. Currently, only Amazon search widget offers responsive support.
Amazon Search Widget
Amazon search widget lets you include Amazon search functionality on your website. You can choose to either let visitors view Amazon search results on your webpage or redirect visitors to Amazon search results page. The new Amazon Search Widget is responsive and hence single integration of widget works optimally on desktop, smartphone and tablet devices.
Here are other key benefits of the new search widget:
- Touch friendly design: Improves user experience on mobile and tablets in addition to helping you earn more by increasing CTR on mobile devices
- New look and feel: New visually appealing design with Amazon Prime information
- Simpler Integration: Use one auto-mode JavaScript for widget of all sizes
- Compact Design: Promote 10 Amazon products in a 320x250 size ad unit
- Relevant Results: Promote contextually relevant products by configuring default search category and query
If you are using older version of search widget, we recommend moving to new search widget to take advantage of new responsive and touch friendly design.
How to integrate?
- Navigate to the Search Widget configuration page .
- Configure the widget parameters. Please see the recommendations listed below for this step.
- Click on “Highlight Ad Code” and copy the JavaScript ad code.
- Paste the copied code within the div on your website where you want the widget to appear.
What to consider while integrating Amazon Search Widget?
Please consider the following recommendations for a better end-user experience:
- Use “auto” height and width settings. Search Widget is responsive and aligns its dimensions as per the available space. It is recommended to not specify size of the div enclosing the widget.
- If not using “auto” dimensions, we recommend using 300X250 as optimal dimensions for mobile specific websites.
- Keep “Show Search Results in Widget” setting enabled. Search widget displaying the search results within allows your customers to look for Amazon products without ever leaving your page.
- Configure relevant Default Category and Default Search Term in accordance with the content of your page. You should also configure Widget Theme to align with the background color of your website.
To learn more about search widget, please visit:
https://affiliate-program.amazon.com/promotion/mec/widgets/search/faq
What is a responsive website?
A responsive website employs Responsive Web Design (RWD) which aims at providing an optimal reading and navigation experience for the user across different sized devices.
How do I figure out if my website is responsive?
Most blogs templates are responsive and most likely your blog is also responsive. You can confirm if your website or blog template is responsive using following methods:
- Manual Method: Access your website on different devices i.e. Desktop monitors, Notebooks, Tablets, Smartphones and see if the layout adapts to the different viewing environments providing optimally sized components that provide a good experience everywhere. Example of a responsive website: http://www.bostonglobe.com
- Use online tools: There are multiple tools available online that let you check if your website is responsive. Example of such tools are: http://ami.responsivedesign.is , http://www.studiopress.com/responsive , http://responsivedesignchecker.com
- Use Firefox's in-built Responsive Design View feature which makes it easy to see how your website or web app will look on different screen sizes. It can be invoked as follows: Firefox Menu → Developer → Responsive Design View
- On Chrome, you may use plugins like, ResponsiveInspector or Responsive View