Open Chart and Whiteboard Labels

Label Appearance An example of where different Open Graph tags appear when a product is shared on Facebook. This blog post will give you some background on how Open Graph tags work and how you can optimize them for your clients when creating custom themes. You may also be interested in: How social media can help you grow your freelance or agency business. What are Open Graph tags? Open Graph tags were introduced by Facebook in 2010 to allow third-party websites to be “readable” by Facebook. This happens by assigning rich “graphic” objects to websites with information, which is then sent to Facebook when a page is shared or liked. Many other social media platforms, such as LinkedIn and Google+, also recognize these same Open Graph tags.

Twitter has its own specific meta tags for sharing, but will default to Open Graph tags if its own meta tags are not detected on a website. You can learn more about the background of Open Graph tags on the official Open Graph protocol website. Open Graph tags: Open Graph protocol Facebook chooses. What type of content appears in your news feed when you share a web page.  Based on how Open Graph tags are calibrated on a website. These tags Taiwan B2B List can have a big effect on conversions and click-through rates. Because if they’re set incorrectly, inaccurate content will appear.  When pages are shared on social media. These tags can have a big effect on conversions and click-through rates. Because if they’re set incorrectly.  Inaccurate content will appear when pages are shared on social media.

Limitations of Open Graph Shopify

It’s crucial that correct descriptions and appropriate images appear when marketers share their content, as unexpected content can erode customer trust in seconds. If unrelated text or incorrect images are displayed when a merchant shares a product page, customers will be less likely to click through to read more. Learning how Open Graph tagging works will help you avoid these pitfalls. How Shopify works with Open Graph tags Like other meta tags, Open Graph tags are added to the meta <head>of a website. Shopify has a specific way of formatting Open Graph tags: by wrapping them in Liquid tags. An example of what this would look like would be With Shopify, many themes compile these tags into a separate snippet, which is then included in the header of the theme.

Taiwan-B2B-List-1021x1024

There are a number of different variables that we will look at. This tag allows you to define the title of the content you are sharing. Most Shopify themes will be set to og_titleautomatically display the product name or item title.  This tag is where you would set the canonical (or “preferred”) URL for the shared page. Type – The type tag will “tell” Facebook what type of content is being shared. This could be a video, website, blog, product, etc. The full list of types can be found on the official Open Graph website. If you’re sharing a product page, this type is likely to be set to product description – This tag will allow you to describe the object being shared, similar to a meta description tag you would add for SEO purposes. When a page is shared, this description will appear below the page title on Facebook.

Open the Graph Labels to Win!

With most Shopify themes, the content that appears here depends on the type of page being shared. For example, if you’re sharing a blog post, Facebook will pull information from the article excerpt. If there is no extract, the description will be extracted from the main content. When we look social-meta-tags.liquidat , we’ll see other examples of conditional og_description rules. og_image – As expected, the image tag will pull an image from your site to display when you share a page. As we saw with other Open Graph tags, many Shopify themes will automatically pull images based on how the tags are configured. The above variables are examples of metadata. Metadata is information that can be recognized by browsers that refers to specific properties. In this case, properties are referred to as “title” and “images”.

Leave a comment

Your email address will not be published.