vinopedia mash-up

If you have a blog on wine or a wine related site, your visitors may be interested in what a wine costs. Vinopedia offers several very simple methods of listing live wine prices on your page as an extra service to your visitors.

Price quotes as a tool-tip

Suppose this is a tasting note you put on your web site:

Yquem 2001

Honey/golden colour. Impressive nose of apricot, papaya and nectarine. Silky flavours of dried pineapple, candied apricot, mango and papaya, finish of several minutes.


If you move your mouse pointer over the wine name, you will see the pricing details of this wine. Always up-to-date, coming straight from our search engine, and without influencing the layout of your page. Adding tool-tip prices is a matter of putting a couple of lines of Javascript at the end of your web page:


The header of the tasting note looks like this: <h4 class='item fn'>Yquem 2001</h4>. The script looks for HTML elements with a class name of 'item fn' and interprets everything within that element as the wine name and vintage. You can change the variable FWStagname to whatever you use as a class name for the wine name (the class name 'item fn' is a standard in Wineformats, which we recommend to use if you are publishing tasting notes). You can also change the variable FWScolor to match the color in the rest of your web page. You only need to include the javascript line once, and it will find all wines on that page.

Important: You must put the Javascript code at the end of your page, otherwise it will not pick up all wines!

In-line price quotes

You can get the lowest and average price for a 0.75 l. bottle of a specific wine as an in-line quote. All you have to do is add a line like this:

Replace Yquem 2001 with any wine name with or without a year. Your visitors will see: .

Miniature Search window

You can offer your visitors a miniature version of vinopedia straight onto your web site. All you have to do is to include a line of code into your web site. When users do a search, they do not navigate away from your page: the results are shown as part of your own web page.

You can choose between two different sizes: normal and compact. Examples are shown below, try them out!
To include the searches in your web page, enter these lines of code into the source HTML file:
Normal:
Compact: