Open Graph (OG) Metatags


(Mark Sealey) #1

Anyone implemented OG tags in a RW project, please?

Since its syntax is different from ‘standard’ metatags, what’s the best way to place OG strings - both site-wide and page by page?

Specifically, how do I split the elements, <meta property="og:title" content="MySite Title“ />

Thanks!


#2

I used it on my site using the SEO stack with Foundation but I only added it to the home and about page. I found this page provided a lot of useful information about how to do it right https://blog.kissmetrics.com/open-graph-meta-tags/


(Mark Sealey) #3

Thanks, Ashley!

I think I’ve got what I want to use correct. It’s knowing where and how to put the OG tags in RW that’s puzzling me… the actual syntax and where in the project file.


#4

I was surprised by all the little details such as optimal image sizes and all the rest so that article made it all a lot clearer and then it just worked. The stack I use just puts it all in place but looking at the page source of my site I think it just goes in the Edit Meta Tags section of RW. You can always test it at http://opengraphcheck.com/ to see where you might be going wrong.


(Mark Sealey) #5

Thanks. ‘Conventional’ keywords have a different syntax from OG ones, though. Can I safely put <meta property…> etc into the sitewide Code dialog under settings?


#6

I am not sure but I doubt it would be deemed good SEO to use the same OG data on every page of your site.


(Mark Sealey) #7

No. You’re right. But what I want to know is the syntax of the OG tags for RW - and where to put them within RW… do I use the stewed Code dialogue in Settings? Or the Metatags boxes?

But in both cases the syntax of OG differs from ‘standard’ meting keywords. That is what I’m trying to find out how to do.

How and where do I form a string that’s:

<meta property=
+
"og:title"
+
content=
+
"My site title">

as opposed to:

<meta name=
+
"title"
+
content=
+
"My site title">


(Brad Halstead) #8

@MarkSealey

For the site wide tags, put them in the site wide project Settings -< Code -> Head

If you have specific for each page, use the Inspector - HTML Tab -> Head content area

This will not rename them to meta name= blah blah content=blah blah

Does that help?
Brad


(Mark Sealey) #9

Thanks, Brad. Yes - I think so. To keep the <meta Property…> syntax use the Inspector - HTML Tab -> Head content area?


(Brad Halstead) #10

Correct @MarkSealey, that should work fine for you as it is not a stylized area, but just incase, if you are copy and pasting, make sure to paste without formatting into that area.

Brad


(Mark Sealey) #11

Thank you very much, Brad!


(Brad Halstead) #13

Correctly done, there are others as well that should be paid attention to for Facebook, did you add those meta tags to the head as well in the site settings, code/head area (This makes the info site wide)?

And yes, I believe you can use the Facebook dev tools to force a refresh, but I have not done it, it can take up to 2 months for image to be shown on Facebook properly…

Brad


(Brad Halstead) #15

Cool, the image MUST be a certain size (1200px x 630px minimum @ 72dpi) that you reference in the open graph and must be on the server at the location specified.

Brad