Jump to content



Photo
- - - - -

Microformatting the Product Listing

product_listing.php microformat schema.org google rich snippets

This topic has been archived. This means that you cannot reply to this topic.
10 replies to this topic

#1   Web-Source 5

Web-Source 5

    ¤

  • Members
  • 18 posts

Posted 20 June 2012 - 18:31

For those that may not be aware, schema.org has releaesed a new standard in microformat mark up. This standard is being used by Bing, Yahoo, and Google. While it has been in use for the past year or so, how much use have you made of it?

You can view all the scematic mark up by visiting http://schema.org

What good does it do?

Well, rather than have a web page full of text and the standard title and meta info to give search engines, you can have a page full of specific markup that will tell search engines, and machine readers alike, exactly what that text is about. Look at the product listing on any given osCommerce category page. What do you see? Products of course. But what does the S.E. see? Unless it is microformatted, they see not much more than title tags and some simple text.

Once you equip a page with microformats, you can test the markup using the Google Rich Snippets Testing Tool, http://www.google.co...ls/richsnippets

Here is a preview of what the testing tool shows us for the default osCommerce categry, DVD Movies > Comedy :

Extracted rich snippet data from the page
Item
Type: http://schema.org/webpage
breadcrumb = Top → Catalog → DVD Movies → Comedy
Item
Type: http://schema.org/product
image = http://XXXXX/images/dvd/theres_something_about_mary.gif
url = http://XXXXX/product_info.php?products_id=19
name = There's Something About Mary
offers = Item( 1 )
model = DVD-TSAB
manufacturer = Fox
aggregaterating = Item( 2 )
Item 1
Type: http://schema.org/offer
price = $49.99
pricecurrency = USD
availability = http://schema.org/InStock
Item 2
Type: http://schema.org/aggregaterating
ratingvalue = 5
bestrating = 5
reviewcount = 1
Item
Type: http://schema.org/product
image = http://XXXXX/images/dvd/youve_got_mail.gif
url = http:/XXXXX/product_info.php?products_id=7
name = You've Got Mail
offers = Item( 3 )
model = DVD-YGEM
manufacturer = Warner
Item 3
Type: http://schema.org/offer
price = $34.99
pricecurrency = USD
availability = http://schema.org/InStock

As you can see, the category page is now listed as a webpage, located in the category specified by the breadcrumb, that holds multiple products, with the name of the product, links to the product image, and page, the model, manufacturer, price, currency, stock value, and when a review is available, the average value and review count is also displayed.

And there is more, this is only the surface, microformatting can also add more to the search results and even be used for building your sites own custom search engine.

#2   bee80

bee80
  • Members
  • 3 posts

Posted 27 January 2013 - 19:30

Please could you tell me how to implement this? Ive looked everywhere for a solution but cant find one.
This is critical for me if im to choose oscommerce as my ecommerce platform

#3   MrPhil

MrPhil
  • Members
  • 5,323 posts

Posted 27 January 2013 - 21:22

A very interesting concept. Is it actually gaining wide use? The only major problem I see with osC would be that you have to combine your product information, reviews, and anything else all on one page, rather than being able to keep them on separate pages. Perhaps we could even get around that by making the reviews invisible on a product page, but still in the markup? I presume that any elaborate formatting (e.g., sale price in blinking red large text) could still be done -- just the number itself is wrapped in a <div> or <span> for the special markup.

As far as implementing this in osC, some of the new markup would have to be hard coded into the product description HTML. Some would have to be in the product page wraparound, and some would be added to specific fields such as the price. Various add-ons (e.g., "was" price or sale price) would have to be modified to conform. Things like any product review or ranking would have to be added to the product information page, and marked up for the new system, but actual display would be suppressed (I'm guessing).

Are there any osC shops that have already implemented this, so we could see what it looks like on the outside and in the HTML? Do other shopping carts support this already?

#4   bruyndoncx

bruyndoncx

    osCommerce Teenager

  • Members
  • 3,241 posts

Posted 27 January 2013 - 21:44

in my original thread about this, web-source5 posted the product info code
http://forums.oscomm...e/#entry1617784
Don't just sit there - contribute to the responsive bootstrap community effort !
http://forums.oscomm...iew__getnewpost


Hava a nice day !
Carine Bruyndoncx


Seen anything good relevant on the net about responsive design for ecommerce ?
You might as well post it in my responsive liive shop review thread .

#5   burt

burt

    Vanquisher of Demons

  • Community Team
  • 9,990 posts

Posted 28 January 2013 - 11:05

A start has been made on 2.3.3.x (product_info.php), ready for 2.3.4 I suppose.

https://github.com/h...15e2d6f20bd1dee
https://github.com/h...e1c0981977f8dc3
https://github.com/h...0ca6bb062b27164
IF YOU MAKE A POST REQUESTING HELP...please state the exact version of osCommerce that you are using. THANKS
 
Big Bang Templates for 2.3 osCommerce - 2.3.1 > 2.3.4 - Buy One, Get One Free
 
--
Making your osCommerce better, one module at a time - get in touch.

#6   bee80

bee80
  • Members
  • 3 posts

Posted 28 January 2013 - 19:00

A start has been made on 2.3.3.x (product_info.php), ready for 2.3.4 I suppose.

https://github.com/h...15e2d6f20bd1dee
https://github.com/h...e1c0981977f8dc3
https://github.com/h...0ca6bb062b27164


Can i use this now?
if so how?
i just delete the red highlighted code in the above files and replace with green HL'ed code?

Glad i resurrected this post /smile.png' class='bbc_emoticon' alt=':)' />

Edited by bee80, 28 January 2013 - 19:00.


#7   Web-Source 5

Web-Source 5

    &curren;

  • Members
  • 18 posts

Posted 29 January 2013 - 17:02

If you go here, http://justthemboyz.com/store-c-4.html you can view the page source to see how the product listing module has been marked up. Make sure to go to schema.org and look at the examples - everything you need to know is there. Just add the needed declarations around your existing product_listing module. If there is information that you want to show in only micro markup and not where it can be physically seen, then you usually place it inside the <meta> element.

I'll dig around and see if I have a standard product_listing module that has been marked up, but I'm afraid I only have ones that are way different that I bothered to markup.

#8   bee80

bee80
  • Members
  • 3 posts

Posted 30 January 2013 - 19:37

If you go here, http://justthemboyz.com/store-c-4.html you can view the page source to see how the product listing module has been marked up. Make sure to go to schema.org and look at the examples - everything you need to know is there. Just add the needed declarations around your existing product_listing module. If there is information that you want to show in only micro markup and not where it can be physically seen, then you usually place it inside the <meta> element.

I'll dig around and see if I have a standard product_listing module that has been marked up, but I'm afraid I only have ones that are way different that I bothered to markup.


product listing module??

I know html and a little php, is this the product_info.php file?

#9   ErikMM

ErikMM
  • Members
  • 314 posts

Posted 15 February 2013 - 04:35

A start has been made on 2.3.3.x (product_info.php), ready for 2.3.4 I suppose.

https://github.com/h...15e2d6f20bd1dee
https://github.com/h...e1c0981977f8dc3
https://github.com/h...0ca6bb062b27164

awesomesauce...I love the o of oSc! I'm patient, I can wait for 2.3.4.

Edited by ErikMM, 15 February 2013 - 04:35.


#10   RMD27

RMD27
  • Members
  • 406 posts

Posted 11 October 2013 - 17:35

For those that may not be aware, schema.org has releaesed a new standard in microformat mark up. This standard is being used by Bing, Yahoo, and Google. While it has been in use for the past year or so, how much use have you made of it?

You can view all the scematic mark up by visiting http://schema.org

What good does it do?

Well, rather than have a web page full of text and the standard title and meta info to give search engines, you can have a page full of specific markup that will tell search engines, and machine readers alike, exactly what that text is about. Look at the product listing on any given osCommerce category page. What do you see? Products of course. But what does the S.E. see? Unless it is microformatted, they see not much more than title tags and some simple text.

Once you equip a page with microformats, you can test the markup using the Google Rich Snippets Testing Tool, http://www.google.co...ls/richsnippets

Here is a preview of what the testing tool shows us for the default osCommerce categry, DVD Movies > Comedy :

Extracted rich snippet data from the page
Item
Type: http://schema.org/webpage
breadcrumb = Top → Catalog → DVD Movies → Comedy
Item
Type: http://schema.org/product
image = http://XXXXX/images/dvd/theres_something_about_mary.gif
url = http://XXXXX/product_info.php?products_id=19
name = There's Something About Mary
offers = Item( 1 )
model = DVD-TSAB
manufacturer = Fox
aggregaterating = Item( 2 )
Item 1
Type: http://schema.org/offer
price = $49.99
pricecurrency = USD
availability = http://schema.org/InStock
Item 2
Type: http://schema.org/aggregaterating
ratingvalue = 5
bestrating = 5
reviewcount = 1
Item
Type: http://schema.org/product
image = http://XXXXX/images/dvd/youve_got_mail.gif
url = http:/XXXXX/product_info.php?products_id=7
name = You've Got Mail
offers = Item( 3 )
model = DVD-YGEM
manufacturer = Warner
Item 3
Type: http://schema.org/offer
price = $34.99
pricecurrency = USD
availability = http://schema.org/InStock

As you can see, the category page is now listed as a webpage, located in the category specified by the breadcrumb, that holds multiple products, with the name of the product, links to the product image, and page, the model, manufacturer, price, currency, stock value, and when a review is available, the average value and review count is also displayed.

And there is more, this is only the surface, microformatting can also add more to the search results and even be used for building your sites own custom search engine.


Walker, how do you pull the breadcrumb information without the html code.
I want to use the breadcrumb as a meta tag on the category pages but I do not know how to strip out the html code like ahref etc etc.

Im using 2.2 rc2

#11   RMD27

RMD27
  • Members
  • 406 posts

Posted 11 October 2013 - 17:51

I wish another search engine was as good as Google http://forums.oscomm..._20#entry824481

This does the job easily.

Edited by RMD27, 11 October 2013 - 17:51.