Open Graph type og:product

Discussion in 'Customization & add-ons' started by baker, Dec 14, 2019.

  1. baker

    baker aMember Pro Customer

    Joined:
    Aug 29, 2006
    Messages:
    19
    Is there a way to get the information from products into the <head> for Open Graph content.

    HTML:
    <!DOCTYPE html>
    <html>
    <head prefix="og: http://ogp.me/ns#
    fb: http://ogp.me/ns/fb#
    product: http://ogp.me/ns/product#">
    
        <meta property="og:type" content="og:product"/>
        <meta property="og:title" content="Friend Smash Coin"/>
        <meta property="og:image" content="http://www.friendsmash.com/images/coin_600.png"/>
        <meta property="og:description" content="Friend Smash Coins to purchase upgrades and items!"/>
        <meta property="og:url" content="http://www.friendsmash.com/og/coins.html"/>
        <meta property="product:plural_title" content="Friend Smash Coins"/>
        <meta property="product:price:amount" content="0.30"/>
        <meta property="product:price:currency" content="USD"/>
        <meta property="product:price:amount" content="0.20"/>
        <meta property="product:price:currency" content="GBP"/>
    
    </head>
    </html>
    As shown here: https://developers.facebook.com/docs/payments/product/

    It would nice to be able to use these types of tags as well as those for Twitter, Instagram and some others.
  2. baker

    baker aMember Pro Customer

    Joined:
    Aug 29, 2006
    Messages:
    19
    BTW - There seems to be an issue with the html editor.
    I've added a space between these two characters in the above post:
    : p
    because if there isn't a space it converts to
    :p
    I tried a couple ways around this but wasn't able to get it to work so I added spaces.
  3. caesar

    caesar aMember Pro Developer Staff Member

    Joined:
    Oct 16, 2009
    Messages:
    2,164
    Hello,

    I removed space and used "code" button on top panel of response area to format code in your initial message (I hope you do not mind).

    Regarding your actual question: Do you want to add it on signup page or shopping cart product page?

    Best Regards.
  4. baker

    baker aMember Pro Customer

    Joined:
    Aug 29, 2006
    Messages:
    19
    Thanks, I should have realized that about the code. I haven't really used it in the past.

    I wouldn't mind it on the signup pages, However what I really want is it on the individual product pages.
  5. caesar

    caesar aMember Pro Developer Staff Member

    Joined:
    Oct 16, 2009
    Messages:
    2,164
    You can use the following code in site.php to add all these meta tags to page:
    http://www.amember.com/docs/Site.php_file

    PHP:
    Am_Di::getInstance()->blocks->add('cart/product/title', new Am_Block_Base(null'ogp-me'null, function(Am_View $v) {

        if (
    $v->displayProductDetails) {
            
    /** @var Product $product */
            
    $product $v->product;

            
    $product_url $product->path ?
                
    $v->surl('product/' urlencode($product->path), false) :
                
    $v->surl("cart/index/product/id/{$product->pk()}"false);


            
    $meta = [
                
    'og:type' => 'og:product',
                
    'og:title' => $product->title,
                
    'og:image' => $v->surl("data/public/{$product->img_path}"false),
                
    'og:description' => $product->getDescription(false),
                
    'og:url' => $product_url,
                
    'product:price:amount' => $product->getBillingPlan()->first_price,
                
    'product:price:currency' => $product->getBillingPlan()->currency,
            ];

            
    $out '';
            foreach (
    $meta as $property => $content) {
                
    $out .= sprintf(
                    
    '<meta property="%s" content="%s" />%s',
                    
    Am_Html::escape($property),
                    
    Am_Html::escape($content),
                    
    "\n"
                
    );
            }

            
    $v->placeholder("head-start")->append($out);
        }
    }));
  6. baker

    baker aMember Pro Customer

    Joined:
    Aug 29, 2006
    Messages:
    19
    I was able to get this to work.

    However, it appears to me that the product pages (/amember/product/title) use the same templates as the cart (amember/cart) page. If I add the tags to my product page I need to remove them from my cart template. But this takes them out of the cart page

    This page doesn't need the product info of course but it should have tags. Can you tell me how to do this and get some static meta tags on the cart page?
  7. caesar

    caesar aMember Pro Developer Staff Member

    Joined:
    Oct 16, 2009
    Messages:
    2,164
    This code should display these meta only on product page. Do you have different behavior?

Share This Page