Rich snippets are all the rage at the moment because they make the way your website looks in the search results of Google, Yahoo and Bing well ﾅ a little more sexy!
If you’re not sure what Rich snippets are or how they might relate to your online shop have a read of our page on rich snippets and schema first
So how to you integrate them into your X-Cart store?
I’ll be taking you through adding rich snippets to your breadcrumbs here. There will be future posts on adding Rich Snippets to an individual product screen and a list of products.
What you’ll need:
- HTML knowledge (a little, not too much)
- FTP access
Steps to adding Rich Snippets
Locate the file bread_crumbs.tpl (usually in skin/common_files/customer/ although yours may be in the skin of a specific template so check both).
Open the file in your text editor and add the text you see in red below:
{foreach from=$location item=l name=location}
{if $l.1 and not $smarty.foreach.location.last}
<span itemscope itemtype=”http://data-vocabulary.org/Breadcrumb”>
<a itemprop=”url” href=”{$l.1|amp}” class=”bread-crumb{if $smarty.foreach.location.last} last-bread-crumb{/if}”><span itemprop=”title”>{if $webmaster_mode eq “editor”}{$l.0}{else}{$l.0|amp}{/if}</span></a>
</span>
{else}
<font class=”bread-crumb{if $smarty.foreach.location.last} last-bread-crumb{/if}”>
{if $webmaster_mode eq “editor”}{$l.0}{else}
<span itemscope itemtype=”http://data-vocabulary.org/Breadcrumb”>
<span itemprop=”title”>
{if $h1_title eq “”}
{$l.0|amp}
{else}
{$h1_title}
{/if}
</span></span>
{/if}</font>
{/if}
{if not $smarty.foreach.location.last && $config.Appearance.breadcrumbs_separator ne ”}
<span class=”seperator”>{$config.Appearance.breadcrumbs_separator|amp}</span>
{/if}
{/foreach}
</div>
Testing your Rich Snippets
You can test how your webpage will look in the search results using the Google Structured Data Testing Tool. Note you will need to try a page that is at least 3 deep.
So for example:
Store Home Page > Emergency Light Batteries
Will not show anything in the testing tool
Store Home Page > Emergency Light Batteries > Replacement elb06042 Battery
will show up something like this:
Note that your HTML and Smarty may look slightly different depending on your version of X-Cart but the general idea is the same. Each breadcrumb should be highlighted individually.
If you’re having issues or don’t know how to do this get in touch with me at Professional SEO Services.