Opened 3 years ago

Last modified 3 months ago

#146 new change

Add meta data to blog

Reported by: greiner Assignee:
Priority: P2 Milestone:
Module: Websites Keywords: textpattern
Cc: trev, saroyanm, christiane, pfrey Blocked By:
Blocking: #118 Platform: Unknown
Ready: yes Confidential: no
Tester: Unknown Verified working: no
Review URL(s):

Description (last modified by saroyanm)

Background

After #4293 fix our Blog is using default meta information from the adblockplus.org.
We need to be able to specify meta data according to the blog post and it's custom fields for SEO and SMO.

What to change

Use the post title to populate the title meta tag:

<meta name="title" content="">
<meta property="og:title" content="">

Use a custom field to populate the description meta tag:

<meta name="description" content="">
<meta property="og:description" content="">

Use custom field to populate the following meta tag or use current image as a fallback:

<meta property="og:image" content="">

Use blog post URL to populate current meta tag:

<meta property="og:url" content="">

Use current meta tag for blog posts:

<meta property="og:type" content="article">

Attachments (5)

ABP_logo_250x250px.png (19.5 KB) - added by saroyanm 23 months ago.
Adblock Plus logo 250x250px
ABP_Logo_Facebook_1200x630-02.png (9.2 KB) - added by christiane 7 months ago.
ABO Logo 1200x630
ABP_Logo_Twitter_375x435.png (15.3 KB) - added by christiane 7 months ago.
ABP_Logo_Twitter_375x280.png (14.3 KB) - added by christiane 7 months ago.
ABP_Logo_Twitter_560x750.png (10.3 KB) - added by christiane 7 months ago.

Download all attachments as: .zip

Change History (26)

comment:1 Changed 3 years ago by greiner

  • Blocking 118 added

comment:2 Changed 3 years ago by fhd

Why would this be blocking #118?

comment:3 Changed 3 years ago by greiner

Because otherwise the snippet that is shown to people the page is shared to might appear incomplete. However, since this is not a strict blocker but more a dependency, feel free to change it.

comment:4 Changed 2 years ago by saroyanm

  • Component changed from Infrastructure to Websites
  • Platform set to Unknown
  • Ready unset

comment:5 Changed 2 years ago by trev

  • Cc trev added

comment:6 Changed 2 years ago by saroyanm

  • Description modified (diff)

comment:7 Changed 2 years ago by saroyanm

  • Cc saroyanm added
  • Description modified (diff)

comment:8 Changed 2 years ago by greiner

Also see #2107.

Changed 23 months ago by saroyanm

Adblock Plus logo 250x250px

comment:9 Changed 23 months ago by saroyanm

  • Description modified (diff)
  • Ready set

comment:10 Changed 23 months ago by saroyanm

  • Description modified (diff)

comment:11 Changed 8 months ago by juliandoucette

  • Cc christiane added
  • Tester set to Unknown

Can we have a better rendering of the ABP logo then the one attached to this issue @Christiane?

Last edited 8 months ago by juliandoucette (previous) (diff)

comment:12 Changed 8 months ago by juliandoucette

  • Ready unset

comment:13 follow-up: Changed 7 months ago by juliandoucette

From: https://developers.facebook.com/docs/sharing/best-practices

"Use images that are at least 1200 x 630 pixels for the best display on high resolution devices. At the minimum, you should use images that are 600 x 315 pixels to display link page posts with larger images. Images can be up to 8MB in size."

From: https://dev.twitter.com/cards/types/photo

"Twitter will resize images, maintaining original aspect ratio to fit the following sizes:

Web: maximum height of 375px, maximum width of 435px
Mobile (non-retina displays): maximum height of 375px, maximum width of 280px
Mobile (retina displays): maximum height of 750px, maximum width of 560px
Twitter will not create a photo card unless the twitter:image is of a minimum size of 280px wide by 150px tall. Images will not be cropped unless they have an exceptional aspect ratio. Images must be less than 1MB in size. Images will be fetched and proxied by Twitter to ensure a high quality of service and SSL security for users."

Changed 7 months ago by christiane

ABO Logo 1200x630

Changed 7 months ago by christiane

Changed 7 months ago by christiane

Changed 7 months ago by christiane

comment:14 in reply to: ↑ 13 Changed 7 months ago by saroyanm

Replying to juliandoucette:

From: https://developers.facebook.com/docs/sharing/best-practices

"Use images that are at least 1200 x 630 pixels for the best display on high resolution devices. At the minimum, you should use images that are 600 x 315 pixels to display link page posts with larger images. Images can be up to 8MB in size."

There are difference how the image will be displayed depending of the size, I'm not sure if having big ABP logo as the "Large image" will provide much value IMO and also bandwidth will be bigger, I think that was the reason why the image that was provided is relatively small.
If your image is smaller than 600 x 315 px, it will still display in the link page post, but the size will be much smaller.
If providing Image for High resolution screens is crucial we can provide several images, but preferable smaller version first, but I think we should be fine with small image left from the post IMO.

comment:15 Changed 7 months ago by saroyanm

@Julian, as we had a discussion regarding the "meta description" and whether it's enough to use excerpt there, I've aligned with @Ben, regarding that and he will prefer to have a separate field/area where he can add description separately for the social media, but we should use excerpt I think for the cases where the separate description is not provided.

comment:16 Changed 5 months ago by juliandoucette

  • Priority changed from P3 to P2

comment:17 Changed 4 months ago by juliandoucette

  • Ready set

comment:18 Changed 4 months ago by juliandoucette

Looks like we can use a custom field here. I recommend implementing this before we move blogging platforms.

comment:19 Changed 3 months ago by juliandoucette

  • Description modified (diff)

comment:20 Changed 3 months ago by juliandoucette

  • Description modified (diff)

comment:21 Changed 3 months ago by saroyanm

  • Cc pfrey added
  • Description modified (diff)

Updated the description.

Note: the blog posts in Facebook are using currently the default promo image instead of picking the one from the content, as it was done before (when we didn't used meta tags at all).

Note: See TracTickets for help on using tickets.