Rich Snippets in Magento product page
2 likes50,714 views
The document provides code snippets for adding structured data markup to an e-commerce website using schema.org. It demonstrates how to add schema to product pages by marking up elements like the product name, description, image, URL, offers, price, availability and more. It also shows how to add schema for reviews, breadcrumbs and other pages on the site. The examples are intended to help provide rich snippets and semantic metadata to pages to help with search engine optimization and understanding of content.
![hans2103 30 May 2013
still open
template/page/html/breadcrumb.phtml
find
change by
save&close
<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>
<a href="<?php echo $_crumbInfo['link'] ?>"
title="<?php echo $this-
>htmlEscape($_crumbInfo['title']) ?>"
itemprop="url"><?php echo $this-
>htmlEscape($_crumbInfo['label']) ?></a>](https://image.slidesharecdn.com/rich-snippets-in-magento-product-page-130530070235-phpapp01/85/Rich-Snippets-in-Magento-product-page-64-320.jpg)
Rich Snippets in Magento product page
- 1. hans2103 30 May 201330 May 2013hans2103
- 2. hans2103 30 May 2013
- 3. hans2103 30 May 2013
- 4. hans2103 30 May 2013
- 5. hans2103 30 May 2013
- 6. hans2103 30 May 2013
- 7. hans2103 30 May 2013
- 8. hans2103 30 May 2013
- 9. hans2103 30 May 2013
- 10. hans2103 30 May 2013
- 11. hans2103 30 May 2013
- 12. hans2103 30 May 2013
- 13. hans2103 30 May 2013
- 14. 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-theatrical- trailer.html">Trailer</a> </div>
- 15. 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-theatrical- trailer.html">Trailer</a> </div>
- 16. hans2103 30 May 2013 <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-theatrical- trailer.html">Trailer</a> </div> itemtype
- 17. 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-theatrical- trailer.html" itemprop="trailer">Trailer</a> </div>
- 18. 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-theatrical- trailer.html" itemprop="trailer">Trailer</a>
- 19. hans2103 30 May 2013 hopsakee... aan de slag!
- 20. hans2103 30 May 2013
- 21. hans2103 30 May 2013
- 22. hans2103 30 May 2013
- 23. hans2103 30 May 2013
- 24. hans2103 30 May 2013 add ?ath=1 to url
- 25. hans2103 30 May 2013
- 26. hans2103 30 May 2013 file to edit
- 27. hans2103 30 May 2013 • itemtype = http://schema.org/Product • itemscope add scope Product
- 28. hans2103 30 May 2013
- 29. hans2103 30 May 2013 open template/catalog/product/view.phtml find change by save&close <div class="product-view" itemscope itemtype="http://schema.org/Product"> <div class="product-view">
- 30. hans2103 30 May 2013 • itemprop = name • is part of itemtype = Product name
- 31. hans2103 30 May 2013 <div class="product-name"> <h1><?php echo $_helper- >productAttribute($_product, $_product- >getName(), 'name') ?></h1> </div> open template/catalog/product/view.phtml find change by save&close <div class="product-name"> <h1 itemprop="name"><?php echo $_helper- >productAttribute($_product, $_product- >getName(), 'name') ?></h1> </div>
- 32. hans2103 30 May 2013 • itemprop = description • is part of itemtype = Product description
- 33. hans2103 30 May 2013 <div class="std"><?php echo $_helper- >productAttribute($_product, nl2br($_product- >getShortDescription()), 'short_description') ?></div> open template/catalog/product/view.phtml find change by save&close <div class="std" itemprop="description"><?php echo $_helper->productAttribute($_product, nl2br($_product->getShortDescription()), 'short_description') ?></div>
- 34. hans2103 30 May 2013 • itemprop = image • is part of itemtype = Product image
- 35. hans2103 30 May 2013 repeat <?php $_img = '<img id="image" itemprop="image" src="'.$this->helper('catalog/image')- >init($_product, 'image') <?php $_img = '<img id="image" src="'.$this- >helper('catalog/image')->init($_product, 'image') open template/catalog/product/view/media.phtml find change by save&close
- 36. hans2103 30 May 2013 • itemprop = url • is part of itemtype = Product url
- 37. hans2103 30 May 2013 open template/catalog/product/view.phtml find change by save&close <div class="product-view" itemscope itemtype="http://schema.org/Product"> <div class="product-view" itemscope itemtype="http://schema.org/Product"> <meta itemprop="url" content="<?php echo $_product->getProductUrl() ?>"/>
- 38. hans2103 30 May 2013 • itemtype = http://schema.org/Offer • itemscope add scope Offer
- 39. hans2103 30 May 2013
- 40. hans2103 30 May 2013 <div itemprop="offers" itemscope itemtype="http://schema.org/Offer"> <?php echo $this- >getChildHtml('product_type_data') ?> <?php echo $this->getTierPriceHtml() ?> </div> open template/catalog/product/view.phtml find change by save&close <?php echo $this- >getChildHtml('product_type_data') ?> <?php echo $this->getTierPriceHtml() ?>
- 41. hans2103 30 May 2013 • itemprop = priceCurrency • is part of itemtype = Offer • priceCurrency <meta itemprop="priceCurrency" content="<?php echo $currency_code = Mage::app()->getStore()- >getCurrentCurrencyCode(); ?>"/>
- 42. hans2103 30 May 2013
- 43. hans2103 30 May 2013 <?php echo $this- >getChildHtml('alert_urls') ?> <div itemprop="offers" itemscope itemtype="http://schema.org/Offer"> open template/catalog/product/view.phtml find <meta itemprop="priceCurrency" content="<?php echo $currency_code = Mage::app()- >getStore()->getCurrentCurrencyCode(); ?>"/> add after save&close
- 44. hans2103 30 May 2013 • itemprop = availability • is part of itemtype = Offer itemAvailability
- 45. hans2103 30 May 2013
- 46. hans2103 30 May 2013 <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> <p class="availability in-stock"><?php echo $this->__('Availability:') ?> <span><?php echo $this->__('In stock') ?></span></p> open template/catalog/product/view/type/default.phtml find change by save&close
- 47. hans2103 30 May 2013 <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> <p class="availability out-of-stock"><?php echo $this->__('Availability:') ?> <span><? php echo $this->__('Out of stock') ?></ span></p> template/catalog/product/view/type/default.phtml open find change by save&close
- 48. hans2103 30 May 2013 • itemprop = ItemCondition • is part of itemtype = Offer • create new attribute first • itemCondition <link itemprop="itemCondition" href="http://schema.org/ <echo_attribute>Condition" />
- 49. hans2103 30 May 2013
- 50. hans2103 30 May 2013
- 51. hans2103 30 May 2013
- 52. hans2103 30 May 2013 <?php echo $this- >getChildHtml('alert_urls') ?> <div itemprop="offers" itemscope itemtype="http://schema.org/Offer"> open template/catalog/product/view.phtml find <link itemprop="itemCondition" href="http://schema.org/<?php echo $_product- >getResource()- >getAttribute('offeritemcondition')- >getFrontend()->getValue($_product) ? >Condition" /> add after save&close
- 53. hans2103 30 May 2013 • itemprop = price • is part of itemtype = Offer • download https://gist.github.com/ hans2103/5635901 • Adding a itemprop to price in upsell is not wanted. price
- 54. hans2103 30 May 2013 open template/catalog/product/view/type/default.phtml find add after save&close <?php echo $this->getPriceHtml($_product, false, '-aggregate') ?> <?php echo $this->getPriceHtml($_product) ?>
- 55. hans2103 30 May 2013 • itemtype = http://schema.org/ AggregateRating • itemscope • rating from Upsell is not wanted • install https://github.com/hans2103/ Hans2103_ReviewSummaryTemplates add scope AggregateRating
- 56. 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
- 57. hans2103 30 May 2013
- 58. hans2103 30 May 2013 <?php echo $this- >getReviewsSummaryHtml($_product, false, true)?> open template/catalog/product/view.phtml find change by save&close <?php echo $this- >getReviewsSummaryHtml($_product, 'aggregate', true)?>
- 59. hans2103 30 augustus 2013 <div class="ratings" itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"> <?php if ($this->getRatingSummary()):?> <div class="ratings"> <?php if ($this->getRatingSummary()):?> open template/review/helper/summary_aggregate.phtml find replace with save&leave_open
- 60. hans2103 30 augustus 2013 <meta itemprop="ratingValue" content="<?php echo $this->getRatingSummary(); ?>"> <meta itemprop="reviewCount" content="<?php echo $this->getReviewsCount(); ?>"> <meta itemprop="bestRating" content="100"> <meta itemprop="worstRating" content="0"> <?php if ($this->getRatingSummary()):?> open template/review/helper/summary_aggregate.phtml find add after save&close
- 61. hans2103 30 May 2013 • 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. add Breadcrumbs
- 62. hans2103 30 May 2013
- 63. hans2103 30 May 2013 open template/page/html/breadcrumb.phtml find change by save&leave_open <li class="<?php echo $_crumbName ?>"> <li class="<?php echo $_crumbName ?>" itemscope itemtype="http://data- vocabulary.org/Breadcrumb">
- 64. hans2103 30 May 2013 still open template/page/html/breadcrumb.phtml find change by save&close <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> <a href="<?php echo $_crumbInfo['link'] ?>" title="<?php echo $this- >htmlEscape($_crumbInfo['title']) ?>" itemprop="url"><?php echo $this- >htmlEscape($_crumbInfo['label']) ?></a>
- 65. hans2103 30 May 2013 hopsakee... testen!
- 66. hans2103 30 May 2013
- 67. hans2103 30 May 2013 nu jij! have fun
- 68. http://www.flickr.com/photos/trasimac/1217071176 thank your for your time http://slideshare.net/hans2103 hans2103 http://about.me/hans2103