Add Pinterest Rich Pin OpenGraph Data for WooCommerce Products

Posted: February 02, 2015

Update: this has been generalized into a WordPress plugin

I recently built a WooCommerce project for a client through Iron to Iron and the client requested integration of Pinterest Rich Pin snippets. Pinterest has proven to be a really valuable marketing vector for many online shops so I thought there must be something out there to help with it.

There are some plugins out there to add Pinterest Rich Pin functionality for WooCommerce products, but this particular project is already using Yoast’s SEO plugin, which outputs a lot of lovely OpenGraph data that the client is already using. I didn’t want to double that up by using both Yoast SEO and a Pinterest Rich Pin plugin so I built my own using a Yoast hook and a WordPress core hook:

<?php
/**
* Piggyback Yoast SEO OpenGraph output to add Pinterest
* Rich Pin OpenGraph data for WooCommerce products
*/
add_filter( 'wpseo_opengraph_type', function( $og_type ) {
if ( 'product' == get_post_type() ) {
$og_type = 'product';
}
return $og_type;
} );
add_action( 'wp_head', function() {
global $post;
// make sure it's a WooCommerce product on display
if ( 'product' !== get_post_type() || ! class_exists( 'WC_Product' ) ) {
return;
}
$product = new WC_Product( $post );
$product_cost = number_format( floatval( $product->get_price() ), 2 ); ?>
<meta property="og:price:amount" content="<?php echo esc_attr( $product_cost ); ?>" />
<meta property="og:price:currency" content="<?php echo esc_attr( get_woocommerce_currency() ); ?>" /><?php
} );
view raw gistfile1.php hosted with ❤ by GitHub

Please note that the first snippet filters Yoast’s default ‘article’ og:type value, and the second snippet inserts the price of the product being viewed automatically in addition to the currency code required by Pinterest.

That should do it!

Get my newsletter

Receive periodic updates right in the mail!
  • This field is for validation purposes and should be left unchanged.