Below are some new features we have implemented recently:

• We have added a new option to the yes/no criteria, now there’s a third one that allows to be more gradual:
  
  These three states have visually 3 default icons. When you embed a table on your blog or website, you can choose between 3 different designs (more or less large):
  
  
  
• We have added a new page to see recent activities of SocialCompare’s members (the latest additions, modifications, votes, notes…).
• The table design have been slightly improved, especially for editing and error and warning handling.
  
• We added direct web links on the items in the header tables, which allow you to see the aggregation of all the votes, ratings, comments associated with this sheet item (product, software, service…):
  
• We have improved the ergonomy when adding a new comparison criterion by moving the choice of criteria type (text, yes/no, image … etc.) to the right of the input field instead of underneath this data input field. So it is always visible, even when the criteria suggestions appear (which are important in order to reuse existing content and to continually improve the SocialCompare database):
  
• In the pro version, we added a button criterion that allows you to easily create an action button pointing to a web link. There is also a new geolocation criterion (not really visible yet).
  
  
• UK web site URLs that end with co.uk are now better handled showing the relevant part of the URL (since before it was truncated in the wrong place).
• And finally for votes or ratings, you can change the value that was initially chosen … it enables you to change your mind or correct the value if you made a mistake. This will change the previous value and change the comment associated with the comparison table or item sheet.

For the moment the plugin is quite simple, there is not a lot of customization to do, but in the future we could integrate more custom fields. Meanwhile you can read the previous blog post explaining in details how to customize easily the appareance of your table.

One simple reason to use the plugin for example is that you can define once the design options of your table adapted to your blog design at one place (on the plugin page), and then embbeded different tables on you website without redefining this each time.

The different possible syntax to embed a table with this plugin are:

[socialcompare]http://socialcompare.com/en/comparison/apples-and-oranges[/socialcompare]

[sc height="960"]http://socialcompare.com/en/w/apples-and-oranges[/sc]

http://socialcompare.com/en/comparison/apples-and-oranges (URL only on a single line)

[sc width="90%" height="960"]http://socialcompare.com/en/w/apples-and-oranges#nofull;noflags[/sc]

Here is a screenshot of the current version of the plugin:

Download the WordPress Table Plugin.

Indeed we prefer that users publish their comparison table in a total public mode with the edition rights set opened to everyone, so everyone can improve the original table…. On the other side, we understand that some bloggers, webmasters for example, including a table on their website, prefer sometimes to keep their content version (to be sure to publish the table they want on their website).
There is already a system that keep history to see all the changes that occured on a table, eventually we will probably do a feature to “restore a previous content” if an user changes something that should not be.

Therefore, we thought it would be nice to save static versions of the same table (a kind of backups). For example, you can save the first version of your table when it is published and decide to include it into your blog post. So it will be a static version of the table (backup at a given time) on your website… but you could leave the table editable by everyone, and thus the comparison can be improved freely on the SocialCompare’s platform.
All backups are available on the same page.

Here’s how to proceed to manage backups, static versions of your table:

1. Click “More details” below the title of the comparison.




2. Click “Manage snapshots, backups” on the bottom right of the details area:
   
   




3. Choose a title for the backup and click on “Create a snapshot”
   
   




4. Click on “embed” button beside the name of your backup, if you want to include this static version in your website.

Now you do not need to create a comparison table to be able to compare everything: compare easily sizes of objects, animals, persons… visually.

For example you could compare products such as iPad vs Galaxy Tab vs Iphone4, or Nokia N8 vs iPhone 4 :

or Galaxy Tab 10.1 vs iPad vs Galaxy Tab vs iPhone4:

or countries such as USA vs France :

or persons such as Obama vs Sarkozy :

or animals/persons such as Diplodocus vs Woman :

or Triceratops vs Obama :

Either comparisons use predefined shapes (rectangles..) or vectorial images (SVG) in advanced mode or normal images (PNG..).
You need to know that vectorial images are not supported in some cases (i.e: Internet Explorer without SVG plugin).

Here is a quick video introducing the tool:

Of course these visual comparisons can be saved to be shared on social networks or embed directly on blog post or website.

If you like this new innovative tool, please spread the word on twitter, facebook…

We use it in SocialCompare to automatically convert all US units into standard units, and then display both units, as explained in this previous post.

Now, this unit converter tool is also available as an independant tool (if you want to convert units for other purposes) in our new page dedicated to tools, plugins and gadgets.

If you see any issue or have some feedbacks to provide, please do not hesitate!

Indeed, regularly you have dimensions (width, height, depth) criteria in comparison tables because it is usually interesting to compare sizes between objects. So we have developed a visual tool that automatically generates the differents objects (in rectangles shapes) using different colors and with the adequate sizes proportions. Then you can drag and drop the visual rectangle to compare the dimensions of each object (animal, person…).

For example, it could be useful to compare latest smartphones, ereaders or also compare tablets. But it is not necessary for high-tech products only… just try with all the objects you want to compare sizes.

A new “Graph icon” appears on the top left corner of each table containing width,height,depth criteria :

You just need to click on the “graph icon” , to visualize the different sizes :

You just need to click on the “table icon” on the top left corner to go back to the table data.

If you have any feedback to send us, please do not hesitate!

Now both units systems can be available into tables, you just need to set your favorite one into the “Preferences” window.

Then a comparison table, not using your favorite units sytem, will be automatically converted and will display both units (original units used by the creator of the table and the conversion for you as a reader).

Here is an example :

This post requires some technical skills and is only intended for people that would like to embed a comparison on their website or blog.

To embed a comparison on a website you need to copy and paste following HTML code:
<iframe width="100%" height="270" src="http://socialcompare.com/en/w/playstation3-vs-xbox360-vs-wii#" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0"></iframe>

This is the default syntax which produces the following result:

If you want to customize it, you need to change the URL and specifically the part after “#”.

• The default style is just: #
• The compact syntax is: #nofoot;noround;noactions;noflags;header-font-size:12px;header-color:#555;header-border:none;header-padding:2px 5px;cell-font-size:12px;cell-border:none;cell-padding:2px;image-max-width:120px;image-max-height:90px

Click the above links to test the different styles directly. You will notice that the second style better fits the blog space area for this comparison.

Let’s see what we can customize. Below is the list of table’s areas you can change:

• cell: table cells (use cellhover to customize when the cursor is above it, cellodd for cells on odd lines, celloddhover to combine both)
• header: table headers either criteria or items headers (headerodd for header on odd lines)
• item: table headers for items (itemodd for items on odd lines (only if your table is rotated since by default items are columns))
• section: headers/cells for criteria with type header (sectionhover when the cursor is above it)
• corner: the cell in the top left corner of the table (cornerhover: when the cursor is above it)
• link: links in the table (linkhover when the cursor is above it)
• image: the images appearing in the table (useful with max-width, max-height to limit images dimensions)

The syntax is similar to CSS.
On all the table areas given above, you can change the following attributes:
background, border, color, font, font-size, letter-spacing, line-height, max-width, max-height, min-width, min-height, padding, text-align, text-decoration, text-shadow, text-transform, vertical-align, word-spacing.

Append the table part with the attribute you would like to change separated by ‘-’.
For example if you would like to change the text color for items:
#item-color:green

If you would like to change the background color for odd lines: you would need to change odd cells and odd headers, and separate multiple modifications with ‘;’:
#cellodd-background:#bbbbff;headerodd-background:#bbbbff

You can check out a CSS manual to know the accepted values on each attribute.

Notes:
Following characters are not accepted: ,'"()%! so some values could not be specified (ie.: 100%, url(), !important)

There are some additional options you can add:

• noround: to have no rounded corners in the headers of the table.
• nofoot : to have no footer space at the end of the table.
• noactions : to have no action icons (rotate, restore table, sort, edit/suggest, drag and drop).
• noedit: to have only sort icons on the criteria.
• noflags: to hide the language flags at the bottom of the table.

To easily customize your table style, you can directly edit the URL in your browser (click the link below and edit the URL until you get the style you like):
http://socialcompare.com/en/w/playstation3-vs-xbox360-vs-wii#noedit;nofoot;item-color:#00aa33;header-padding:2px 18px 2px 2px;item-padding:5px;section-padding:10px 2px 2px 2px;section-color:#00aa33;cell-padding:2px;image-max-height:120px
Once you have found the combination you like, replace the URL in the initial HTML code.

Let us know in the comments below, if there are some missing attributes that you would like to customize, or if you have created some nice style you would like to share with others…

1 – Choose the embed comparison table style:

First, if you are a blogger or webmaster, and you want to embed a comparison table on your website, you can now customize exactly the table as you wish in terms of table design, fonts, colors… So it can match the webdesign of your own website. I will detail exactly the syntax of the embed code that enable you to customize all the details of the table in the next post.

By default, you can now choose between 4 designs in the embed window:

• First choice is the “default” design that you see on SocialCompare.com platform, with rounded corners and orange headers:

• Second choice is a “compact” design that takes less space on the screen :

• Third choice is a “simple” design that does not display the interactive icons such as rotate, drag and drop, hide columns/lines… :

• Finally, the last choice is a “blue” design to show you that you can choose colors exactly as you wish:

2 – RSS feed of the last updated comparisons:

There is also a new RSS feed available here to list all the last updated comparisons:

http://socialcompare.com/en/last-updated-comparisons.rss

You can use it for example to add it to your RSS reader (google reader for instance) or to your google homepage as a google gadget just by clicking on this button:

You can have a list of the last updated comparisons up to 9 elements, or a slideshow when you click on “edit settings” of the gadget :

The 2 main visible updates are the access to the Revision history of all comparisons or elements to be compared. First, it will enable you to see what happened on each content and who has modified what… Later it will enable us to add a “restore button”  (like Wikipedia does).

Meanwhile the implementation of this functionality (not in our priority actually), you can contact us if you notice any issue with a specific comparison table. We could restore data “manually” on request.

You just need to click on “last update” date below the comparison title (or in “last update” date field if present inside the comparison table) in order to show the revision history:

Then the second visible update we made is the “Add content window”  (add button is located on top-left of any table) :

We have noticed that few members have inverted “elements to compare” and “comparison criteria“. We believe that it could be linked to the fact that we were putting in parenthesis ”columns” and “lines” to precise if elements were currently in columns or lines… members did not realize that they could change that later easily… (with the rotate button option). So they added content depending if they needed in columns or lines…

Therefore we have decided to clarify this window adding a more explicit sentence with a rotate button to be able to immediately invert columns and lines, and we have renamed “elements” and “criteria” by more explicit terms: “elements to compare” and “comparison criteria”, hope it will help :

Here is the window before the changes:

And now here is the new window, a bit more explicit :