Adding and editing metatags

As a content editor, I would like to be able to modify my source meta tags in HTML for use with:

  • Open Graph (OG) 
  • Social Media Networks
    • Twitter
    • Facebook
    • Google+
  • Google News
  • Other advanced tags

Metatags for Schema.org

schema_organization value
@type EducationalOrganization
additionalType CollegeOrUniversity
@id [current-page:url:absolute]
name The University of Arizona
address
@type PostalAddress
addressLocality Tucson
addressRegion AZ
postalCode 85721
addressCountry USA
url [site:url]
image
@type ImageObject
url [node:field_uaqs_photo]

Metatags and Social Media Posts

The content editor on arizona.edu added a custom image and description in the summary tab fields and that populated metatags in the format that twitter can interpret.

Configuration

UA Quickstart is shipped with the Drupal Metatag module and some editable sensible defaults to get you started.
You can find the global settings for the metatag module in the configuration section of your administration area `admin/config/search/metatags` as long as you have the `uaqs_seo` module enabled.

If not trying to set defaults for content types, you can also manually set tags on a page by page basis within the page/node edit form.
 

metatag-per-page-override.png

Screenshot of metatag node edit section
You can edit each page within the metatag tab in the node edit form.

 

Overrides

Quickstart uses fields within each page to set various tags, if you look in the metatag section you should be able to discern which fields populate which tags.

Metatag Default
<meta name="description"> [node:field_uaqs_summary]
<meta name="robots"> follow, index
<link rel="image_src"> [node:field_uaqs_photo]
<meta name="generator"> UA Quickstart 7 (https://quickstart.arizona.edu)
<link rel="canonical"> [current-page:url:absolute]
<meta name="rights"> © [current-date:custom:Y] The Arizona Board of Regents on behalf of <a href="https://www.arizona.edu" target="_blank">The University of Arizona</a>.
<link rel="shortlink"> [current-page:url:unaliased]
<meta property="og:type"> website
<meta property="og:site_name"> [site:name]
<meta property="og:url"> [current-page:url:absolute]
<meta property="og:title"> [node:title]
<meta property="og:description"> [node:field_uaqs_summary]
<meta property="og:image"> [node:field_uaqs_photo]
<meta property="og:image:url"> [node:field_uaqs_photo]
<meta property="og:image:secure_url" [node:field_uaqs_photo]
<meta property="og:image:type"> auto
<meta name="twitter:card"> Summary
<meta name="twitter:url"> [current-page:url:absolute]
<meta name="twitter:title"> [node:title]

Tokens

Within the default settings you may notice tokens instead of actual text.  Tokens are special text like strings that the CMS knows to replace with context specific or dynamic content.
Tokens look like this [node:title] and in this case would be replaced with what is in the current page's title field. 

Useful tools for troubleshooting metatags 

Test your site/page for common metatags 
Test how your site/page will look in twitter