Skip to content

Instantly share code, notes, and snippets.

@engram-design

engram-design/_layout.html

Last active February 23, 2018 05:34
Show Gist options
  • Save engram-design/0dfa1fc300a2b36bdf04cda02b8ebddc to your computer and use it in GitHub Desktop.
Save engram-design/0dfa1fc300a2b36bdf04cda02b8ebddc to your computer and use it in GitHub Desktop.
Download ZIP
SEOMatic Setup
Raw
_layout.html
<!doctype html>
<html lang="en">
<head>
<!-- Responsive-ness -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- SE-Oh -->
{% include '_includes/seo_meta' %}
</head>
Raw
index.html
{# ------------------------ #}
{# Custom SEO (optional) #}
{# ------------------------ #}
{% set seoTitle = 'My awesome title' %}
{% extends '_layout' %}
{% block content %}
{% endblock %}
Raw
seo_meta.html
{% spaceless %}
{# ------------------------ #}
{# Custom SEOMatic configuration, an easy include to automate a bunch of SEO variables, providing #}
{# customisation through elements, element fields, template variables and SEOMatic globals #}
{# The below describes the level of precedence between how content is set #}
{# SEO Title #}
{# 1. Element custom field `seoTitle` #}
{# 2. Twig variable `seoTitle` #}
{# 3. Element title #}
{# 4. SEOMatic Site SEO Title #}
{# SEO Description #}
{# 1. Element custom field `seoDescription` #}
{# 2. Twig variable `seoDescription` #}
{# 3. Element Matrix field `pageBody`, its first block `contextBlock` with a field `text` #}
{# 4. SEOMatic Site SEO Description #}
{# SEO Image #}
{# 1. Twig variable `seoImage` #}
{# 2. Element custom field `featuredImage` #}
{# 3. SEOMatic Site SEO Image #}
{# ------------------------ #}
{# ------------------------ #}
{# Available Variables - use these in your templates #}
{# ------------------------ #}
{# seoTitle, seoDescription, seoImage #}
{# ogTitle, ogDescription, ogImage #}
{# twitterTitle, twitterDescription, twitterImage #}
{# ------------------------ #}
{# ------------------------ #}
{# Configuration options #}
{# ------------------------ #}
{# Transforms for images #}
{% set transform = { mode: 'crop', width: '800', height: '455' } %}
{% set ogTransform = { mode: 'crop', width: '800', height: '455' } %}
{% set twitterTransform = { mode: 'crop', width: '400', height: '400' } %}
{# ------------------------ #}
{# Options set via templates #}
{# ------------------------ #}
{# Set the Title/Description/Image to one manually set in templates #}
{% set seoTitle = seoTitle ?? null %}
{% set seoDescription = seoDescription ?? null %}
{% set seoImg = seoImage.url(transform) ?? null %}
{# ------------------------ #}
{# Options set via Entry, Category or Product #}
{# ------------------------ #}
{% set element = entry ?? category ?? product ?? null %}
{% if element is defined and element %}
{# Default to deal with truthiness - otherwise these will succeed when used in the null coalescing operator below #}
{% set customTitleField = element.seoTitle | default(null) %}
{% set customDescriptionField = element.seoDescription | default(null) %}
{# Use the `seoTitle` custom field, then a template variable, then the element title #}
{% set seoTitle = customTitleField ?? seoTitle ?? element.title %}
{# Note the use of the array syntax - dot syntax will throw an error if the field doesn't exist #}
{% set seoImg = element['featuredImage'].first.url(transform) ?? seoImg %}
{# Use the first `contentBlock` from our `pageBody` Matrix field (if there is one) #}
{# Note the use of the array syntax - dot syntax will throw an error if the field doesn't exist #}
{% if element['pageBody'] is defined %}
{% if element.pageBody.type('contentBlock').first %}
{% set seoDescription = element.pageBody.type('contentBlock').first.text | striptags | escape | slice(0, 160) %}
{% endif %}
{% endif %}
{# Use the `seoDescription` custom field, then a template variable #}
{% set seoDescription = customDescriptionField ?? seoDescription %}
{% endif %}
{# ------------------------ #}
{# Fall back on global defaults #}
{# ------------------------ #}
{# Site-wide SEO defaults, as defined in the CP #}
{% set seoTitle = seoTitle ?? seomaticSiteMeta.siteSeoTitle %}
{% set seoDescription = seoDescription ?? seomaticSiteMeta.siteSeoDescription %}
{% set seoImg = seoImg ?? seomaticSiteMeta.siteSeoImage %}
{# ------------------------ #}
{# Setup OpenGraph and Twitter, in case they have specifics #}
{# ------------------------ #}
{% set openGraph = seomaticMeta.og ?? {} %}
{% set openGraphTitle = ogTitle ?? seoTitle %}
{% set openGraphDescription = ogDescription ?? seoDescription %}
{% set openGraphImage = ogImage.url(ogTransform) ?? seomaticSiteMeta.siteOpenGraphImage ?? seoImage.url(ogTransform) ?? seoImg %}
{% set twitterCard = seomaticMeta.twitter ?? {} %}
{% set twitterCardTitle = twitterTitle ?? seoTitle %}
{% set twitterCardDescription = twitterDescription ?? seoDescription %}
{% set twitterCardImage = twitterImage.url(twitterTransform) ?? seomaticSiteMeta.siteTwitterImage ?? seoImage.url(twitterTransform) ?? seoImg %}
{# Little fix here for ampersands getting escaped. Need to investigate #}
{% set seoTitle = seoTitle | replace({'\&': 'and'}) %}
{% set openGraphTitle = openGraphTitle | replace({'\&': 'and'}) %}
{% set twitterCardTitle = twitterCardTitle | replace({'\&': 'and'}) %}
{% set openGraph = openGraph | merge({
title: openGraphTitle,
description: openGraphDescription,
image: openGraphImage,
}) %}
{% set twitterCard = twitterCard | merge({
title: twitterCardTitle,
description: twitterCardDescription,
image: twitterCardImage,
}) %}
{# ------------------------ #}
{# We're all done, now get SEOMatic to render #}
{# ------------------------ #}
{% set seomaticMeta = seomaticMeta | merge({
seoTitle: seoTitle,
seoDescription: seoDescription,
seoImage: seoImg,
og: openGraph,
twitter: twitterCard,
}) %}
{% set seoMaticVariables = {
seomaticMeta: seomaticMeta,
seomaticSiteMeta: seomaticSiteMeta,
seomaticIdentity: seomaticIdentity,
seomaticSocial: seomaticSocial,
seomaticCreator: seomaticCreator,
} %}
{% endspaceless %}
{# We've taken a few things out - commented in include #}
{# Or, if you're feeling vanilla, use `{% hook 'seomaticRender' %}` #}
{{ craft.seomatic.render('_includes/seomatic', seoMaticVariables) | raw }}
Raw
seomatic.html
{% spaceless %}
{# Cloned from seomatic/templates/seo_meta.twig #}
{# Removed `[devMode]` from title #}
{# Removed start/end html comments for SEOmatic plugin #}
{# Removed Google Analytics output #}
{# Removed Meta Generator tag #}
{# Properly indented and cleaned up comment headers #}
{# Make title more reuseable #}
{% set title %}
{% if seomaticSiteMeta.siteSeoTitlePlacement == "before" %}{{ seomaticSiteMeta.siteSeoName |raw }}{% if seomaticMeta.seoTitle %} {{ seomaticSiteMeta.siteSeoTitleSeparator }} {% endif %}{% endif %}{{ seomaticMeta.seoTitle |raw }}{% if seomaticSiteMeta.siteSeoTitlePlacement == "after" %}{% if seomaticMeta.seoTitle %} {{ seomaticSiteMeta.siteSeoTitleSeparator }} {% endif %}{{ seomaticSiteMeta.siteSeoName |raw }}{% endif %}
{% endset %}
{% endspaceless %}
<title>{{ title | trim }}</title>
<!-- Standard SEO -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="referrer" content="no-referrer-when-downgrade" />
{% if seomaticMeta.robots is defined and seomaticMeta.robots %}
<meta name="robots" content="{{ seomaticMeta.robots |raw }}" />
{% endif %}
{% if seomaticMeta.seoKeywords is defined and seomaticMeta.seoKeywords %}
<meta name="keywords" content="{{ seomaticMeta.seoKeywords |raw }}" />
{% endif %}
{% if seomaticMeta.seoDescription is defined and seomaticMeta.seoDescription %}
<meta name="description" content="{{ seomaticMeta.seoDescription |raw }}" />
{% endif %}
<link rel="canonical" href="{{ seomaticMeta.canonicalUrl }}" />
{% set localizedUrls = getLocalizedUrls() %}
{% if localizedUrls |length > 1 %}
{% for key, value in localizedUrls %}
<link rel="alternate" hreflang="{{ key |lower |replace ('_', '-') }}" href="{{ value }}" />
{% endfor %}
{% endif %}
{% if seomaticIdentity.address.addressRegion is defined and seomaticIdentity.address.addressRegion %}
<meta name="geo.region" content="{{ seomaticIdentity.address.addressRegion |raw }}" />
{% endif %}
{% if seomaticIdentity.location.geo.latitude is defined and seomaticIdentity.location.geo.latitude and seomaticIdentity.location.geo.latitude is defined and seomaticIdentity.location.geo.latitude %}
<meta name="geo.position" content="{{ seomaticIdentity.location.geo.latitude |raw }},{{ seomaticIdentity.location.geo.longitude |raw }}" />
<meta name="ICBM" content="{{ seomaticIdentity.location.geo.latitude |raw }},{{ seomaticIdentity.location.geo.longitude |raw }}" />
{% endif %}
{% if seomaticIdentity.location.name is defined and seomaticIdentity.location.name %}
<meta name="geo.placename" content="{{ seomaticIdentity.location.name |raw }}" />
{% endif %}
<!-- Dublin Core basic info -->
<meta name="dcterms.Identifier" content="{{ seomaticMeta.canonicalUrl }}" />
<meta name="dcterms.Format" content="text/html" />
<meta name="dcterms.Relation" content="{{ seomaticSiteMeta.siteSeoName |raw }}" />
<meta name="dcterms.Language" content="{{ craft.locale | slice (0,2) }}" />
<meta name="dcterms.Publisher" content="{{ seomaticSiteMeta.siteSeoName |raw }}" />
<meta name="dcterms.Type" content="text/html" />
<meta name="dcterms.Coverage" content="{{ siteUrl }}" />
<meta name="dcterms.Rights" content="{{ seomaticHelper.ownerCopyrightNotice |raw }}" />
<meta name="dcterms.Title" content="{{ seomaticMeta.seoTitle |raw }}" />
{% if seomaticCreator.name is defined and seomaticCreator.name %}
<meta name="dcterms.Creator" content="{{ seomaticCreator.name |raw }}" />
{% endif %}
<meta name="dcterms.Subject" content="{{ seomaticMeta.seoKeywords |raw }}" />
<meta name="dcterms.Contributor" content="{{ seomaticSiteMeta.siteSeoName |raw }}" />
<meta name="dcterms.Date" content="{{ now | date('Y-m-d') }}" />
<meta name="dcterms.Description" content="{{ seomaticMeta.seoDescription |raw }}" />
{% if seomaticMeta.og is defined and seomaticMeta.og %}
<!-- Facebook OpenGraph -->
{% if seomaticSocial.facebookProfileId %}
<meta property="fb:profile_id" content="{{ seomaticSocial.facebookProfileId |raw }}" />
{% endif %}
{% if seomaticSocial.facebookAppId %}
<meta property="fb:app_id" content="{{ seomaticSocial.facebookAppId |raw }}" />
{% endif %}
{% for key, value in seomaticMeta.og %}
{% if value %}
{% if value is iterable %}
{% for subvalue in value %}
<meta property="og:{{ key }}" content="{{ subvalue |raw }}" />
{% endfor %}
{% else %}
<meta property="og:{{ key }}" content="{{ value |raw }}" />
{% endif %}
{% endif %}
{% endfor %}
{% if seomaticMeta.article is defined and seomaticMeta.article %}
{% for key, value in seomaticMeta.article %}
{% if value %}
{% if value is iterable %}
{% for subvalue in value %}
<meta property="article:{{ key }}" content="{{ subvalue |raw }}" />
{% endfor %}
{% else %}
<meta property="article:{{ key }}" content="{{ value |raw }}" />
{% endif %}
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% if seomaticMeta.twitter is defined and seomaticMeta.twitter %}
<!-- Twitter Card -->
{% for key, value in seomaticMeta.twitter %}
{% if value %}
<meta property="twitter:{{ key }}" content="{{ value }}" />
{% endif %}
{% endfor %}
{% endif %}
{% if seomaticSocial.googlePlusHandle %}
<!-- Google Publisher -->
<link rel="publisher" href="{{ seomaticHelper.googlePlusUrl }}" />
{% endif %}
<!-- Domain verification -->
{% if seomaticHelper.ownerGoogleSiteVerification %}
<meta name="google-site-verification" content="{{ seomaticHelper.ownerGoogleSiteVerification |raw }}" />
{% endif %}
{% if seomaticHelper.ownerBingSiteVerification %}
<meta name="msvalidate.01" content="{{ seomaticHelper.ownerBingSiteVerification |raw }}" />
{% endif %}
<!-- Identity -->
{{ craft.seomatic.renderIdentity() |raw }}
<!-- WebSite -->
{{ craft.seomatic.renderWebsite() |raw }}
<!-- Place -->
{{ craft.seomatic.renderPlace() |raw }}
<!-- Main Entity of Page -->
{{ craft.seomatic.renderMainEntityOfPage() |raw }}
<!-- Breadcrumbs -->
{{ craft.seomatic.renderBreadcrumbs() |raw }}
@engram-design
Copy link
Author

screen shot 2017-03-08 at 10 32 31 pm

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment