0

I am created OG tag for the Homepage and products,

For Homepage :

1)app/design/frontend/Zero/my_theme/Magento_theme/layout/default_head_blocks.xml

<meta name="og:title" content="Welcome to our store"/>
<meta name="og:description" content="Buy Online - Best price/>

For Products :

2)app\design\frontend\Zero\my_theme\Magento_Catalog\templates\product\view\opengraph\general.phtml

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

/** @var $block \Magento\Catalog\Block\Product\View */
?>

<meta property="og:type" content="product" />
<meta property="og:title"
      content="<?= /* @noEscape */ $block->stripTags($block->getProduct()->getName()) ?>" />
<meta property="og:image"
      content="<?= $block->escapeUrl($block->getImage($block->getProduct(), 'product_base_image')->getImageUrl()) ?>" />
<meta property="og:description"
      content="<?= /* @noEscape */ $block->stripTags($block->getProduct()->getShortDescription()) ?>" />
<meta property="og:url" content="<?= $block->escapeUrl($block->getProduct()->getProductUrl()) ?>" />
<?php if ($priceAmount = $block->getProduct()->getPriceInfo()->getPrice(\Magento\Catalog\Pricing\Price\FinalPrice::PRICE_CODE)->getAmount()) :?>
    <meta property="product:price:amount" content="<?= $block->escapeHtmlAttr($priceAmount) ?>"/>
    <?= $block->getChildHtml('meta.currency') ?>
<?php endif;?>

and added general.phtml into

3) app\design\frontend\Zero\my_theme\Magento_Catalog\layout\catalog_product_opengraph.xml

<?xml version="1.0"?>
<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <attribute name="prefix" value="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# product: http://ogp.me/ns/product#" />
    </head>
    <body>
        <referenceBlock name="head.additional">
            <block class="Magento\Catalog\Block\Product\View" name="opengraph.general" template="Magento_Catalog::product/view/opengraph/general.phtml">
                <block class="Magento\Directory\Block\Currency" name="opengraph.currency" as="meta.currency" template="Magento_Catalog::product/view/opengraph/currency.phtml"/>
            </block>
        </referenceBlock>
    </body>
</page>

4)How to do it for all categories?

1

Create the following layout file

app\design\frontend\my_theme\Magento_Catalog/layout/catalog_category_view.xml


<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="2columns-left" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="head.additional">
            <block class="Magento\Catalog\Block\Category\View" name="opengraph.category" template="Magento_Catalog::catalog/view/opengraph/category.phtml"></block>
        </referenceBlock>
    </body>
</page>

in catalog/view/opengraph/category.phtml add the og headers you want for your category pages i.e.

<meta property="og:type" content="website" />
<meta property="og:title"
      content="<?= /* @noEscape */ $block->stripTags($block->getCurrentCategory()->getMetaTitle()) ?>" />
<meta property="og:url" content="<?= $block->escapeUrl($block->getCurrentCategory()->getUrl()) ?>" />
1
  • May i know my path right : app\design\frontend\Zero\my_theme\Magento_Catalog\templates\product\view\opengraph\category.phtml – zus Feb 12 at 3:54

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.