Value Added Labels

Basic Labels

Once you have made your articles machine-readable by adding hNews you can let your users know by adding a Value Added label next to each article.

Just pick the style of label you want...

...then cut & paste the resulting HTML snippet into your page:

<a href="http://valueaddednews.org"><img alt="Value Added label" src="http://valueaddednews.org/images/vab/vab_100x20.jpg" /></a>

'Smart' Label

This is a javascript-based widget which provides a Value Added label with a popup box. When the mouse moves over the label, a box pops up showing the embedded information in a user-friendly format - a little like movie credits at the end of a film or food ingredients on the side of a food packet (see example below).

Just paste this HTML snippet into your page:

<span class="vab-container"> <img src="http://valueaddednews.org/images/vab/vab_100x20.jpg" width="100" height="20" /> <span class="vab-popup"></span> </span> <script src="http://valueaddednews.org/js/vab.js" type="text/javascript"></script>

Multiple articles per page

The widget will support multiple articles on the same page. Just repeat the vab-container part once near each article you'd like a popup for, and include the <script> part once only.

Development

All our development is open source. You can see the development history - and contribute improvements - via our version control system (hosted on github.com).

The widget consists of two files:

• vab.js (the javascript)
• vab.css (the stylesheet)

These files are licensed under the MIT license.

Custom versions

You are, of course, welcome to take the widget and create a custom version which takes advantages of whatever special features your site may have, or just one which matches the visual style of your site.