{"id":12393,"date":"2023-03-20T17:24:55","date_gmt":"2023-03-20T11:54:55","guid":{"rendered":"https:\/\/magecomp.com\/support\/?post_type=manual_documentation&#038;p=12393"},"modified":"2024-05-21T14:46:02","modified_gmt":"2024-05-21T09:16:02","slug":"open-graph-tags-categories","status":"publish","type":"manual_documentation","link":"https:\/\/magecomp.com\/support\/docs\/open-graph-tags-magento-2\/open-graph-tags-categories\/","title":{"rendered":"Open Graph Tags for Categories"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">You can add category-specific open graph tags using this extension.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">For that, go to <\/span><b>Catalog &gt; Categories <\/b><span style=\"font-weight: 400;\">and select your desired category from the list in the left panel. Now move to the<\/span><b> Open Graph Metadata<\/b><span style=\"font-weight: 400;\"> tab and enlarge it.<\/span><\/p>\n<p><img fetchpriority=\"high\" decoding=\"async\" class=\"alignnone wp-image-12394 size-full\" title=\"open graph tags for categories\" src=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/open-graph-tags-for-categories.png\" alt=\"open graph tags for categories\" width=\"1248\" height=\"603\" srcset=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/open-graph-tags-for-categories.png 1248w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/open-graph-tags-for-categories-300x145.png 300w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/open-graph-tags-for-categories-1024x495.png 1024w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/open-graph-tags-for-categories-768x371.png 768w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/open-graph-tags-for-categories-600x290.png 600w\" sizes=\"(max-width: 1248px) 100vw, 1248px\" \/><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>OG Title:<\/b><span style=\"font-weight: 400;\"> Add an open graph title for this category.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>OG Description:<\/b><span style=\"font-weight: 400;\"> Add an open graph description for this category.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><b>OG Image:<\/b><span style=\"font-weight: 400;\"> Upload an open graph image for this category.<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">Now, in the storefront, open this category page. Right-click and select <\/span><b>View Page Source<\/b><span style=\"font-weight: 400;\"> or press <\/span><b>Ctrl+U<\/b><span style=\"font-weight: 400;\">. You can find that the Open Graph Tags have been successfully added in the &lt;head&gt; section of the page as per your configuration settings.<\/span><\/p>\n<p><img decoding=\"async\" class=\"alignnone wp-image-12395 size-full\" title=\"frontend open graph tags for category\" src=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/frontend-open-graph-tags-for-category.png\" alt=\"frontend open graph tags for category\" width=\"1347\" height=\"594\" srcset=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/frontend-open-graph-tags-for-category.png 1347w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/frontend-open-graph-tags-for-category-300x132.png 300w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/frontend-open-graph-tags-for-category-1024x452.png 1024w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/frontend-open-graph-tags-for-category-768x339.png 768w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/frontend-open-graph-tags-for-category-600x265.png 600w\" sizes=\"(max-width: 1347px) 100vw, 1347px\" \/><\/p>\n<p>If you have added a description to the content section of categories, it will automatically add it to the OG Description.<\/p>\n<p>For that, go to\u00a0<b>Catalog &gt; Categories <\/b>and <span style=\"font-weight: 400;\">select your desired category from the list in the left panel. Now move to the<\/span><b> Content<\/b><span style=\"font-weight: 400;\"> tab and enlarge it.<\/span>\u00a0 Add a <strong>Description<\/strong> of the category.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-13729\" title=\"SS\" src=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-5.png\" alt=\"category content\" width=\"1233\" height=\"649\" srcset=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-5.png 1233w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-5-300x158.png 300w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-5-1024x539.png 1024w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-5-768x404.png 768w\" sizes=\"(max-width: 1233px) 100vw, 1233px\" \/><\/p>\n<p>Now move to the\u00a0<strong>Open Graph Metadata<\/strong> tab and enlarge it. You will find that the description content is automatically added to the\u00a0<strong>OG Description<\/strong>\u00a0field.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13730\" title=\"SS\" src=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-6.png\" alt=\"OG Description for category from content\" width=\"1239\" height=\"647\" srcset=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-6.png 1239w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-6-300x157.png 300w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-6-1024x535.png 1024w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-6-768x401.png 768w\" sizes=\"(max-width: 1239px) 100vw, 1239px\" \/><\/p>\n<p>Likewise, it will automatically take the category name as OG Title for the particular category.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13731\" title=\"SS\" src=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-7.png\" alt=\"category name as OG title\" width=\"1201\" height=\"607\" srcset=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-7.png 1201w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-7-300x152.png 300w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-7-1024x518.png 1024w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2023\/03\/SS-7-768x388.png 768w\" sizes=\"(max-width: 1201px) 100vw, 1201px\" \/><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":12380,"menu_order":3,"template":"","manualdocumentationcategory":[4034],"manual_doc_tag":[],"class_list":["post-12393","manual_documentation","type-manual_documentation","status-publish","hentry","manualdocumentationcategory-m2-open-graph-tags"],"_links":{"self":[{"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation\/12393","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation"}],"about":[{"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/types\/manual_documentation"}],"author":[{"embeddable":true,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":1,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation\/12393\/revisions"}],"predecessor-version":[{"id":13732,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation\/12393\/revisions\/13732"}],"up":[{"embeddable":true,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation\/12380"}],"wp:attachment":[{"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/media?parent=12393"}],"wp:term":[{"taxonomy":"manualdocumentationcategory","embeddable":true,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manualdocumentationcategory?post=12393"},{"taxonomy":"manual_doc_tag","embeddable":true,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_doc_tag?post=12393"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}