How to add google rich snippets to mosets

[Lenfitz]

What is google rich snippets?

Google allows your star rating system to be seen in google using their rich snippet schema.

This is what a listing will look like in google.



Mosets tree 3 comes rich snippets ready. You just have to add 2 lines of simple code and ALL your listings that are rated with stars will appear in google as above. The modification is really simple and very quick to perform.

File to modify.
sub_listingDetailsStyleX.tpl.php

X = whatever style you are using. This will work for ALL styles.

Important to modify the correct style template option your site is using

To be sure check which style you have set in the mosets admin backend section under templates Kinabalu in the styles option. Options 1 to 8.

You can find all your styles here,

components/com_mtree/templates/kinabalu/

For the purpose of explanation I will use style 3. sub_listingDetailsStyle3.tpl.php

BEFORE YOU START BACKUP YOUR FILE! In case a mistake is made.

Open up your sub_listingDetailsStyleX.tpl.php in an editor.

You will add 2 lines to your existing tpl.php file.

echo "<div itemscope itemtype='http://schema.org/Article'>";

and

echo '</div>';

So it will look like this at around line 61. The added code is in bold. The rest is mosets normal code.

if( $this->config->get('show_favourite') == 1 || $this->config->get('show_rating') == 1 )
{



// Added echo "<div itemscope itemtype='http://schema.org/Article'>"; for rich snippets
// Len Fitzgerald 	
	echo "<div itemscope itemtype='http://schema.org/Article'>";	
	echo '<div class="rating-fav">';
	if($this->config->get('show_rating')) {
		echo '<div class="rating">';
		$this->plugin( 'ratableRating', $this->link, $this->link->link_rating, $this->link->link_votes); 
		echo '<div id="total-votes">';
		if( $this->link->link_votes <= 1 ) {
			echo $this->link->link_votes . " " . strtolower(JText::_( 'COM_MTREE_VOTE' ));
		} elseif ($this->link->link_votes > 1 ) {
			echo $this->link->link_votes . " " . strtolower(JText::_( 'COM_MTREE_VOTES' ));
		}
		echo '</div>';
		echo '</div>';
		echo '</div>';
	}

// End rich snippets code modification section.




	if($this->config->get('show_favourite')) {

Now we have modified our site it's time to test using googles rich snippets testing tool found here.

http://www.google.com/webmasters/too...4%3C%2Fspan%3E

Go to any of your listings that have star ratings (listings with no star ratings votes will not work). View source of the page. Then copy and paste this section of your viewed page source into the google rich snippets testing box and click preview.

Make sure to start with <div itemscope and first ending </div> after your stars.

EG: Like this section.

<div itemscope itemtype='http://schema.org/Article'><div class="rating-fav"><div class="rating"><div id="rating-msg">Rating</div><div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating" class="hidden"> <span itemprop="bestRating">5</span><span itemprop="ratingValue">5</span><span itemprop="ratingCount">3</span></div><img src="http://www.aussiesrus.com.au/media/com_mtree/images/star_10.png" width="16" height="16" hspace="1" vspace="3" alt="★" /><img src="http://www.aussiesrus.com.au/media/com_mtree/images/star_10.png" width="16" height="16" hspace="1" vspace="3" alt="★" /><img src="http://www.aussiesrus.com.au/media/com_mtree/images/star_10.png" width="16" height="16" hspace="1" vspace="3" alt="★" /><img src="http://www.aussiesrus.com.au/media/com_mtree/images/star_10.png" width="16" height="16" hspace="1" vspace="3" alt="★" /><img src="http://www.aussiesrus.com.au/media/com_mtree/images/star_10.png" width="16" height="16" hspace="1" vspace="3" alt="★" /><div id="total-votes">3 votes</div>

You should see your listing test appear with stars according to rating. Paste it in wrong and it will fail the test.

That is all you need to do to modify and test your mosets tree 3 google rich snippets modification.

Do not expect to see changes you have made instantly appearing in google. It takes time for google to pickup the changes. Days sometimes weeks.

But if you have modified correctly the testing tool will verify the modified page source code.

If your listing has no star vote rating then it will not appear as a google rich snippet url.

NOTE: This is a custom modification and will need to be redone everytime you update mosets tree as mosets will overwrite the file.

This modification has been tested and verified on my own site using mosets tree 3 and has not been tested with mosets 2.x versions.

Best wishes
Leonard Fitzgerald
Aussiesrus Australia

[amiman]

I did this and the source code on my page has

<a href="javascript:rateListing(4,3);"> </a> several times. see

http://www.addinghamweb.co.uk/adding...addingham.html

in it would not pass until I removed it.

Also the code to change was around line 31 on my install using style3

Thanks for this
amiman

[jayneill]

Nice work @Lenfitz

Thank you for this.
I am surprised that Mosets has implemented this as a core addition to Tree.

Regardless.. this worked like a charm!

[mohammedpeer]

I am currently using a custom multi rating system which does not work with the default rating system. can you please advise if this will still work.