SEO
‹ BackDefaults
You can se the default global settings in the /layouts/_seo.html.erb
partial.
variable | description |
---|---|
cache_version | A simple cache-buster |
koi_settings | A boolean flag to use the global koi setting fallbacks from Koi's Site Settings section |
disable_facebook | A boolean flag to stop the output of the opengraph facebook meta tags |
disable_twitter | A boolean flag to stop the output of the twitter card meta tags |
disable_pwa_settings | A boolean flag to stop the output of the PWA tags, app icons etc. |
disable_structured_data | A boolean flag to stop the output of the structured data tags |
meta_title | The default title of all pages. |
meta_title_postfix | An automatically appeneded post-fix for page titles. It is recommended to use the website name. Will result in something like Page Title - Website Name , by default it's the same as meta_title |
meta_title_postfix_seperator | The seperator between the postfix and the page title |
meta_keywords | Default meta keywords |
meta_description | Default meta description |
meta_image | Default seo image |
meta_theme_colour | Default PWA theme colour |
facebook_app_id | Facebook App ID for analytics |
twitter_site | Global twitter:site meta tag, should represent a username on twitter |
twitter_creator | Global twitter:creator meta tag |
Meta tags and the meta helper
The meta
rails helper can be used to populate the SEO partial in your view:
meta({ title: "Page title", description: "Custom page description", image: "Custom meta share image" })
You can specify custom options for twitter and facebook by using a nested structure like so:
meta({ title: "Page title", description: "Custom page description", image: "Custom meta share image", facebook: { title: "Custom facebook title", image: "Custom facebook image" } })
The full list of options:
meta({ title: "Page/Tab/Window title", description: "meta description, facebook description, twitter description", keywords: "meta keywords", image: "meta image, facebook image, twitter image", theme_colour: "PWA theme colour", facebook: { title: "Facebook title", description: "Facebook description", image: "Facebook image", url: "Facebook URL override", author: "Facebook author", publish_time: "Facebook publish time", }, twitter: { title: "Twitter title", description: "Twitter description", image: "Twitter image", image_alt: "Twitter image description for visually impaired", url: "Twitter URL override", site: "Twitter site override (if seperate from global setting)", creator: "Twitter creator override (if seperate from global setting)", card: "Twitter card tag, defaults to summary, or summary_large_image if there's an image" } })
Formatters
Images
Images get passed through to the share_image
helper.
This helper checks to see if it's a string (eg. URL), if it is, it then checks to see if it's an absolute URL and if it isn't will turn it in to one. If it is an absolute URL it will pass the string as-is back to the meta tag like nothing happened.
If it ISN'T a string, it's likely an image object, something like resource.image
.
It will attempt to crop the image based on the scenario, eg. Default/Facebook will crop to 1200x630, twitter will crop to 800x418.
Page titles
Note that Ornament uses a title
yield for page titles. This will automatically pull from the meta({ title })
option, but can be overridden with content_for :title, "Custom view title"
to make the visible title on the page different from the window title.
Structured data
Structured data is some JSON you can add to your view to help Google represent your page in search results.
You can read more about that over at the Google Developer Guides.
To use it in Ornament, you simply need to define some content for the structured_data
yield:
<% content_for :structured_data do %> "@type": "Recipe", "name": "Awesome recipe", "author": "Katalyst", "description": "Just a cool thing to make", <% end %>
Note that the structured data yield will automatically add the @context
key/value and drop you in to the main object, so the initial wrapping {}
aren't needed.
If you don't define any content for it and the use_structured_data
flag is enabled, some very basic structured data will be put on your page.
Koi SEO
When the seo
module is enabled in Koi it will automatically feed in to the title, keyword and description.