Rich Snippets in Magento product page

hans2103 30 May 2013 30 May 2013

hans2103 30 May 2013

markup <div> <h1>Avatar</h1> <span>Director: James Cameron (born August 16, 1954)</span> <span>Science fiction</span> <a href=”../movies/avatar-theatricaltrailer.html”>Trailer</a> </div> hans2103 30 May 2013

itemscope <div itemscope> <h1>Avatar</h1> <span>Director: James Cameron (born August 16, 1954) </span> <span>Science fiction</span> <a href=”../movies/avatar-theatricaltrailer.html”>Trailer</a> </div> hans2103 30 May 2013

itemtype <div itemscope itemtype=”http://schema.org/ Movie”> <h1>Avatar</h1> <span>Director: James Cameron (born August 16, 1954)</span> <span>Science fiction</span> <a href=”../movies/avatar-theatricaltrailer.html”>Trailer</a> </div> hans2103 30 May 2013

itemprop <div itemscope itemtype =”http://schema.org/ Movie”> <h1 itemprop=”name”>Avatar</h1> <span>Director: <span itemprop=”director”>James Cameron</span> (born August 16, 1954)</span> <span itemprop=”genre”>Science fiction</ span> <a href=”../movies/avatar-theatricaltrailer.html” itemprop=”trailer”>Trailer</a> </div> hans2103 30 May 2013

embedded items <div itemscope itemtype =”http://schema.org/ Movie”> <h1 itemprop=”name”>Avatar</h1> <div itemprop=”director” itemscope itemtype=”http://schema.org/Person”> Director: <span itemprop=”name”>James Cameron</span> (born <span itemprop=”birthDate”>August 16, 1954)</span> </div> <span itemprop=”genre”>Science fiction</ span> <a href=”../movies/avatar-theatricaltrailer.html” itemprop=”trailer”>Trailer</a> hans2103 30 May 2013

hopsakee… aan de slag! hans2103 30 May 2013

hans2103 30 May 2013

add ?ath=1 to url hans2103 30 May 2013

hans2103 30 May 2013

file to edit hans2103 30 May 2013

add scope Product • itemtype = http://schema.org/Product • itemscope hans2103 30 May 2013

hans2103 30 May 2013

open template/catalog/product/view.phtml find <div class=”product-view”> change by

<div class=”product-view” itemscope itemtype=”http://schema.org/Product”> save&close hans2103 30 May 2013

name • itemprop = name • is part of itemtype = Product hans2103 30 May 2013

open template/catalog/product/view.phtml find <div class=”product-name”> <h1><?php echo $_helper>productAttribute($_product, $_product>getName(), ‘name’) ?></h1> </div> change by

<div class=”product-name”> <h1 itemprop=”name”><?php echo $_helper>productAttribute($_product, $_product>getName(), ‘name’) ?></h1> </div> save&close hans2103 30 May 2013

description • itemprop = description • is part of itemtype = Product hans2103 30 May 2013

open template/catalog/product/view.phtml find <div class=”std”><?php echo $_helper>productAttribute($_product, nl2br($_product>getShortDescription()), ‘short_description’) ?></div> change by

<div class=”std” itemprop=”description”><?php echo $_helper->productAttribute($_product, nl2br($_product->getShortDescription()), ‘short_description’) ?></div> save&close hans2103 30 May 2013

image • itemprop = image • is part of itemtype = Product hans2103 30 May 2013

open template/catalog/product/view/media.phtml find <?php $_img = ‘<img id=”image” src=”’.$this>helper(‘catalog/image’)->init($_product, ‘image’) change by

<?php $_img = ‘<img id=”image” itemprop=”image” src=”’.$this->helper(‘catalog/image’)>init($_product, ‘image’) repeat save&close hans2103 30 May 2013

url • itemprop = url • is part of itemtype = Product hans2103 30 May 2013

open template/catalog/product/view.phtml find <div class=”product-view” itemscope itemtype=”http://schema.org/Product”> change by <div class=”product-view” itemscope itemtype=”http://schema.org/Product”> <meta itemprop=”url” content=”<?php echo $_product->getProductUrl() ?>”/> save&close hans2103 30 May 2013

add scope Offer • itemtype = http://schema.org/Offer • itemscope hans2103 30 May 2013

hans2103 30 May 2013

open template/catalog/product/view.phtml find <?php echo $this>getChildHtml(‘product_type_data’) ?> <?php echo $this->getTierPriceHtml() ?> change by

<div itemprop=”offers” itemscope itemtype=”http://schema.org/Offer”> <?php echo $this>getChildHtml(‘product_type_data’) ?> <?php echo $this->getTierPriceHtml() ?> </div> save&close hans2103 30 May 2013

priceCurrency • itemprop = priceCurrency • is part of itemtype = Offer itemprop=”priceCurrency” • <meta content=”<?php echo $currency_code = Mage::app()->getStore()>getCurrentCurrencyCode(); ?>”/> hans2103 30 May 2013

hans2103 30 May 2013

open template/catalog/product/view.phtml find <?php echo $this>getChildHtml(‘alert_urls’) ?> <div itemprop=”offers” itemscope itemtype=”http://schema.org/Offer”> add after <meta itemprop=”priceCurrency” content=”<?php echo $currency_code = Mage::app()>getStore()->getCurrentCurrencyCode(); ?>”/> save&close hans2103 30 May 2013

itemAvailability • itemprop = availability • is part of itemtype = Offer hans2103 30 May 2013

hans2103 30 May 2013

open template/catalog/product/view/type/default.phtml find <p class=”availability in-stock”><?php echo $this->__(‘Availability:’) ?> <span><?php echo $this->__(‘In stock’) ?></span></p> change by <p class=”availability in-stock”><link itemprop=”availability” href=”http:// schema.org/InStock”><?php echo $this>__(‘Availability:’) ?> <span><?php echo $this->__(‘In stock’) ?></span></p> save&close hans2103 30 May 2013

open template/catalog/product/view/type/default.phtml find <p class=”availability out-of-stock”><?php echo $this->__(‘Availability:’) ?> <span><? php echo $this->__(‘Out of stock’) ?></ span></p> change by <p class=”availability out-of-stock”><link itemprop=”availability” href=”http:// schema.org/OutOfStock”><?php echo $this>__(‘Availability:’) ?> <span><?php echo $this->__(‘Out of stock’) ?></span></p> save&close hans2103 30 May 2013

itemCondition • itemprop = ItemCondition • is part of itemtype = Offer • create new attribute first itemprop=”itemCondition” • <link href=”http://schema.org/ <echo_attribute>Condition” /> hans2103 30 May 2013

hans2103 30 May 2013

open template/catalog/product/view.phtml find <?php echo $this>getChildHtml(‘alert_urls’) ?> <div itemprop=”offers” itemscope itemtype=”http://schema.org/Offer”> add after

price • itemprop = price • is part of itemtype = Offer • download https://gist.github.com/ hans2103/5635901 • Adding a itemprop to price in upsell is not wanted. hans2103 30 May 2013

open template/catalog/product/view/type/default.phtml find

<?php echo $this->getPriceHtml($_product) ?>

add after

<?php echo $this->getPriceHtml($_product, false, ‘-aggregate’) ?>

save&close hans2103 30 May 2013

add scope AggregateRating • itemtype = http://schema.org/ AggregateRating • itemscope • rating from Upsell is not wanted • install https://github.com/hans2103/ Hans2103_ReviewSummaryTemplates hans2103 30 May 2013

Hans2103_Review SummaryTemplates • Provides ability to add more review summary templates. • First written in blogpost by Fontis.com • Later converted in a module by Arjen Miedema • Now added to Github by Hans2103 hans2103 30 May 2013

hans2103 30 May 2013

open template/catalog/product/view.phtml find

<?php echo $this>getReviewsSummaryHtml($_product, false, true)?>

change by

<?php echo $this>getReviewsSummaryHtml($_product, ‘aggregate’, true)?>

save&close hans2103 30 May 2013

open template/review/helper/summary_aggregate.phtml find

<div class=”ratings”> <?php if ($this->getRatingSummary()):?> replace with <div class=”ratings” itemprop=”aggregateRating” itemscope itemtype=”http://schema.org/AggregateRating”> <?php if ($this->getRatingSummary()):?> save&leave_open hans2103 30 augustus 2013

open template/review/helper/summary_aggregate.phtml find <?php if ($this->getRatingSummary()):?> add after

add Breadcrumbs • using other method • http://data-vocabulary.org/Breadcrumb • Schema.org can be used too, but the result in Rich Snippets is not as good as this method. hans2103 30 May 2013

hans2103 30 May 2013

open template/page/html/breadcrumb.phtml find <li class=”<?php echo $_crumbName ?>”> change by <li class=”<?php echo $_crumbName ?>” itemscope itemtype=”http://datavocabulary.org/Breadcrumb”> save&leave_open hans2103 30 May 2013

still open template/page/html/breadcrumb.phtml find <a href=”<?php echo $_crumbInfo[‘link’] ?>” title=”<?php echo $this>htmlEscape($_crumbInfo[‘title’]) ?>” itemprop=”url”><?php echo $this>htmlEscape($_crumbInfo[‘label’]) ?></a> change by <a href=”<?php echo $_crumbInfo[‘link’] ?>” title=”<?php echo $this>htmlEscape($_crumbInfo[‘title’]) ?>” itemprop=”url”><span itemprop=”title”><?php echo $this->htmlEscape($_crumbInfo[‘label’]) ? ></span></a> save&close hans2103 30 May 2013

hopsakee… testen! hans2103 30 May 2013

hans2103 30 May 2013

nu jij! have fun hans2103 30 May 2013

thank your for your time http://about.me/hans2103 hans2103 http://slideshare.net/hans2103 http://www.flickr.com/photos/trasimac/1217071176