Your SlideShare is downloading. ×
Rich Snippets in Magento product page - #MUG020
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Rich Snippets in Magento product page - #MUG020

11,913
views

Published on

Embed Rich Snippets in your Magento product page. Slides of my presentation during Magento User Group 29-08-2013 in Amsterdam

Embed Rich Snippets in your Magento product page. Slides of my presentation during Magento User Group 29-08-2013 in Amsterdam


0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
11,913
On Slideshare
0
From Embeds
0
Number of Embeds
10
Actions
Shares
0
Downloads
11
Comments
0
Likes
4
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. hans2103 30 augustus 2013hans2103 30 augustus 2013
  • 2. hans2103 30 augustus 2013
  • 3. hans2103 30 augustus 2013
  • 4. hans2103 30 augustus 2013
  • 5. hans2103 30 augustus 2013
  • 6. hans2103 30 augustus 2013
  • 7. hans2103 30 augustus 2013
  • 8. hans2103 30 augustus 2013
  • 9. hans2103 30 augustus 2013
  • 10. hans2103 30 augustus 2013
  • 11. hans2103 30 augustus 2013
  • 12. hans2103 30 augustus 2013
  • 13. hans2103 30 augustus 2013
  • 14. hans2103 30 augustus 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 augustus 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 augustus 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 augustus 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 augustus 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 augustus 2013 hopsakee... aan de slag!
  • 20. hans2103 30 augustus 2013
  • 21. hans2103 30 augustus 2013
  • 22. hans2103 30 augustus 2013
  • 23. hans2103 30 augustus 2013
  • 24. hans2103 30 augustus 2013 add ?ath=1 to url
  • 25. hans2103 30 augustus 2013
  • 26. hans2103 30 augustus 2013 file to edit
  • 27. hans2103 30 augustus 2013 • itemtype = http://schema.org/Product • itemscope add scope Product
  • 28. hans2103 30 augustus 2013
  • 29. hans2103 30 augustus 2013 open template/catalog/product/view.phtml find replace with save&close <div class="product-view" itemscope itemtype="http://schema.org/Product"> <div class="product-view">
  • 30. hans2103 30 augustus 2013 • itemprop = name • is part of itemtype = Product name
  • 31. hans2103 30 augustus 2013 <div class="product-name"> <h1><?php echo $_helper- >productAttribute($_product, $_product- >getName(), 'name') ?></h1> </div> open template/catalog/product/view.phtml find replace with save&close <div class="product-name"> <h1 itemprop="name"><?php echo $_helper- >productAttribute($_product, $_product- >getName(), 'name') ?></h1> </div>
  • 32. hans2103 30 augustus 2013 • itemprop = description • is part of itemtype = Product description
  • 33. hans2103 30 augustus 2013 <div class="std"><?php echo $_helper- >productAttribute($_product, nl2br($_product- >getShortDescription()), 'short_description') ?></div> open template/catalog/product/view.phtml find replace with save&close <div class="std" itemprop="description"><?php echo $_helper->productAttribute($_product, nl2br($_product->getShortDescription()), 'short_description') ?></div>
  • 34. hans2103 30 augustus 2013 • itemprop = image • is part of itemtype = Product image
  • 35. hans2103 30 augustus 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 replace with save&close
  • 36. hans2103 30 augustus 2013 • itemprop = url • is part of itemtype = Product url
  • 37. hans2103 30 augustus 2013 open template/catalog/product/view.phtml find replace with 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 augustus 2013 • itemtype = http://schema.org/Offer • itemscope add scope Offer
  • 39. hans2103 30 augustus 2013
  • 40. hans2103 30 augustus 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 replace with save&close <?php echo $this- >getChildHtml('product_type_data') ?> <?php echo $this->getTierPriceHtml() ?>
  • 41. hans2103 30 augustus 2013 • itemprop = priceCurrency • is part of itemtype = Offer • priceCurrency <meta itemprop="priceCurrency" content="<?php echo $currency_code = Mage::app()->getStore()- >getCurrentCurrencyCode(); ?>"/>
  • 42. hans2103 30 augustus 2013
  • 43. hans2103 30 augustus 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 augustus 2013 • itemprop = availability • is part of itemtype = Offer itemAvailability
  • 45. hans2103 30 augustus 2013
  • 46. hans2103 30 augustus 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 replace with save&close
  • 47. hans2103 30 augustus 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 replace with save&close
  • 48. hans2103 30 augustus 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 augustus 2013
  • 50. hans2103 30 augustus 2013
  • 51. hans2103 30 augustus 2013
  • 52. hans2103 30 augustus 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 augustus 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 augustus 2013 open template/catalog/product/view/type/default.phtml find replace with save&close <?php echo $this->getPriceHtml($_product, false, '-aggregate') ?> <?php echo $this->getPriceHtml($_product) ?>
  • 55. hans2103 30 augustus 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 augustus 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 augustus 2013
  • 58. hans2103 30 augustus 2013 <?php echo $this- >getReviewsSummaryHtml($_product, false, true)?> open template/catalog/product/view.phtml find replace with 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 augustus 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 augustus 2013
  • 63. hans2103 30 augustus 2013 open template/page/html/breadcrumb.phtml find replace with save&leave_open <li class="<?php echo $_crumbName ?>"> <li class="<?php echo $_crumbName ?>" itemscope itemtype="http://data- vocabulary.org/Breadcrumb">
  • 64. hans2103 30 augustus 2013 still open template/page/html/breadcrumb.phtml find replace with save&leave_open <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']) ?>"><?php echo $this- >htmlEscape($_crumbInfo['label']) ?></a>
  • 65. hans2103 30 augustus 2013 hopsakee... testen!
  • 66. hans2103 30 augustus 2013
  • 67. hans2103 30 augustus 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

×