[SOLVED] OpenGraph and Custom Fields

Random stuff about serendipity. Discussion, Questions, Paraphernalia.
Post Reply
SlidingHorn
Regular
Posts: 18
Joined: Wed Jul 28, 2010 6:14 pm

[SOLVED] OpenGraph and Custom Fields

Post by SlidingHorn »

I want to make it so that when articles from my blog are linked on social media (essentially just Twitter and Facebook), the previews are "prettier". The way to do this seems to be through using OpenGraph Markup-based META tags in the HEAD of the page.

I'll explain how I imagine this working, and then I'd like some input on what I'm doing right or wrong:

The Plan
Have most of the <meta> tags already written into my index.tpl file -

Code: Select all

<meta property="og:url" content="{$entry.link}" />
<meta property="og:type" content="article" />
<meta property="og:title" content="{$entry.title}" />
<meta property="og:description" content="{$entry.body}" />
<meta property="og:image" content="{$entry.properties.ep_PreviewImg}" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@(twitter handle)" />
The {$entry.properties.ep_PreviewImg} would be a custom field named PreviewImg, obviously. A few questions I about the above:

1. Do I have the right variable for the url?

2. Same question about the "preview" (og:description) - I would want it to be whatever text is shown before the "Read More" button that takes someone to the extended entry

3. Would putting this all in the index.tpl file be the wrong way about doing this? Can I put these tags (with the variables) in an HTML head nugget?

4. Am I calling the Custom Field properly in the above example?

Thanks ahead of time for any input you all might have!
Last edited by SlidingHorn on Sun Mar 25, 2018 12:50 am, edited 1 time in total.
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: OpenGraph and Custom Fields

Post by yellowled »

SlidingHorn wrote:Have most of the <meta> tags already written into my index.tpl file
I don't want to discourage your manual efforts, but we have a plugin for that. :)

http://spartacus.s9y.org/index.php?mode ... ent_social
SlidingHorn wrote:1. Do I have the right variable for the url?
Yes.
SlidingHorn wrote:2. Same question about the "preview" (og:description) - I would want it to be whatever text is shown before the "Read More" button that takes someone to the extended entry
The og:description is supposed to be shorter than 160 characters, so body will likely be too long. Also, it will include HTML, and that's not allowed within the description meta element. So you'll need to truncate the body to 160 chars and strip special chars – at this point, I would suggest looking into the plugin's code to see how it works there. (Or, you know, just use the plugin.)
SlidingHorn wrote:3. Would putting this all in the index.tpl file be the wrong way about doing this? Can I put these tags (with the variables) in an HTML head nugget?
You can put this in the index.tpl or in a head nugget. (Or, you know, just use the plugin.)
SlidingHorn wrote:4. Am I calling the Custom Field properly in the above example?
I think that should work. But I would still recommend to just use the plugin. :)

YL
SlidingHorn
Regular
Posts: 18
Joined: Wed Jul 28, 2010 6:14 pm

Re: OpenGraph and Custom Fields

Post by SlidingHorn »

I do have the plugin installed, and it's apparently been doing it's job as designed. I guess I'd just have to change the line

Code: Select all

echo 'meta name="twitter:card" content="summary" /> . "\n";
to be the "summary_large_image" option...

One further question, though: Is there a way to have the og:description to exclude image captions?

EDIT Nevermind - I found that the plugin looks for serendipity_event_metadesc before pulling/generating this information. I'll just install that plugin and use that.

Thanks, as always, for being so helpful!
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: OpenGraph and Custom Fields

Post by yellowled »

SlidingHorn wrote:Thanks, as always, for being so helpful!
You're welcome. :)

YL
Post Reply