Metadata at it's basic level is descriptive information about a piece of data. A card in a card catalog at a library is descriptive information about a particular book: the author, the title, the subject matter, and where it can be found in the library. The book is the data. The card is the metadata. 

The content that you create for this website—articles, pages, images, events, etc.—has a certain amount of default metadata associated with it. You can refine that metadata to make your site more relevant to your users, and more useful on social media like Facebook and Twitter.

Creating Content with Metadata

The very first thing to do to maximize your social media posts in regards to metadata is to make sure that all of your content has a Title, a Summary, and a Main Image.

You'll notice that the example text in the Summary field is different from the example text in the Body field. This is how the page looks when published.

Notice that the Title, Main Image and Body fields are visible, but the Summary field is not.

The Summary field is used on the MyLO website when listing recent posts, returning search results, and similar functions. In the image below you can see the Demo Article listing on the Demo League's Homepage. It makes use of Title, Summary and Main Image.

This section is called "Creating Content with Metadata." The secret of metadata is that the contents of Title, Main Image and Summary fields ARE the metadata that is used when making posts to social media.

Metadata on Social Media

When the URL to a published MyLO page is copied and pasted into Facebook's "What's on your mind?" box, this is what you see.

You can see that Facebook has used the Title, Main Image, and example text from the Summary field for this share. The Body field is not used.

A very important note about Main Image: make sure it is at least 800px wide. If it is not, Facebook will ignore it and attempt to pull the first image that is at least 800px wide from the page. You will probably be very unhappy with what it chooses.

What metadata is used?

As mentioned before, Title, Main Image and Summary are your three key fields for sharing with Social Media. But not all sites use the same information.

Facebook, Twitter, and Google+ make use of all 3 fields: Title, Main Image and Summary.

LinkedIn, and Pinterest only make use of Title and Main Image.

Modifying Metadata Only for Social Media

If you want to modify the metadata used by Facebook and other social media websites so that it is different from what is used locally on the MyLO site, you can do that in the "Meta tags" tab at the bottom of the page, just above the Save button.

Meta tags has 6 subsections under it:

• Basic tags
• Advanced tags
• Open Graph
• Facebook
• Twitter card
• Google+

By default Basic tags is open. There are far too many options in Meta Tags to cover them all here. And in most cases, you might only need to tweak three settings under Open Graph.

Title

Open Graph -> Content Title

Original text: [node:title]

Changing the text in this field will create a separate Title that is only used for social media posts like Facebook, Twitter, and Google+.

Summary

Open Graph -> Content Description

Original text: [node:summary]

Changing the text in this field will create a separate Summary that is only used for social media posts such as on Facebook, Twitter and Google+.

Main Image

Open Graph -> Image

Original text: [node:field_image]

You can paste a URL to an image here which will be used as the Main Image for social media posts like Facebook, Twitter and Google+. You can read about how to copy an image URL below.

In the examples above, I've changed the Title, Summary, and Main Image for social media only. When I copy and paste the URL into Facebook's "What's on your mind?" I see my new share.

Copy an Image URL

Navigate to a page on MyLO with the image for which you want the URL.

If you are using Google Chrome or Safari, right-click on the image and select "Copy Image Address" from the pop-up window. Other browsers will have a similar option under their pop-up window.

Testing and Troubleshooting

Any pages, articles, events, etc. created on MyLO prior to July 1, 2018 might not show Summaries in Twitter and Google+ correctly.

1. Go to the Meta Tags tab as described above.
2. Under Open Graph, find the "Content Description" field mentioned above.
3. Make sure the text reads "[node:summary]" without quotes.
4. Save and publish the change.

Social media posts on Twitter and Google+ will now correctly include the Summary.

Why is my social media share showing old text or an old picture?

When an article is shared with Facebook and other social media sites, whether posted or not, the metadata for the page is cached for faster access. This means that if you are testing out your social media share and making changes to your MyLO page, you might not see your changes in the share.

These are the steps to update Facebook's cache of your page.

1. Go to this website: https://developers.facebook.com/tools/debug/
2. Paste your page URL in the Sharing Debugger box and click Debug.
3. Click the Scrape Again button in the "Time Scraped" row.
4. Verify that your changes are now showing up.

Twitter does similar caching to Facebook. You can force a refresh of the cache.

1. Go to this website: https://cards-dev.twitter.com/validator
2. Paste your page URL in the Card URL box and click "Preview card."
3. Verify that your changes are now showing up.

LinkedIn caches your shares for 7 days and has a very limited refresh available. It will only work a couple times. I would suggest doing your share testing with Facebook and/or Twitter to get it perfected before sharing with LinkedIn. This is how you can force a refresh on LinkedIn.

Paste your MyLO page URL into LinkedIn but add "?latest" without quotes to the end of the URL. So for example, if this is your URL:

https://my.lwv.org/colorado/demo-local/article/demo-article

Use this URL instead to force a refresh:

https://my.lwv.org/colorado/demo-local/article/demo-article?latest

Google+ also caches shares but offers no method for refreshing the cache. I would strongly recommend doing all testing with Facebook and Twitter. Make sure all of your metadata is showing up the way you like before sharing to Google+.