Image changes should be removed

This commit is contained in:
Kyle Niewiada 2017-04-03 13:36:29 -04:00
parent e8e54a924c
commit 48ba285251
3 changed files with 29 additions and 198 deletions

View File

@ -78,6 +78,8 @@ The SEO tag will respect any of the following if included in your site's `_confi
* `social` - For [specifying social profiles](https://developers.google.com/structured-data/customize/social-profiles). The following properties are available:
* `name` - If the user or organization name differs from the site's name
* `links` - An array of links to social media profiles.
* `date_modified` - (YYYY-MM-DD hh:mm) A manual override for the `dateModified` field in the JSON-LD output. This field will take **first priority** for the `dateModified` output. This is useful when the file timestamp does not match the true time that the content was modified.
* A user may also install [Last Modified At](https://github.com/gjtorikian/jekyll-last-modified-at) which will offer an alternative way of providing for the `dateModified` field.
```yml
social:
@ -185,8 +187,6 @@ The following options can be set for any particular page. While the default opti
* `name` - If the name of the thing that the page represents is different from the page title. (i.e.: "Frank's Café" vs "Welcome to Frank's Café")
* `type` - The type of things that the page represents. This must be a [Schema.org type](http://schema.org/docs/schemas.html), and will probably usually be something like [`BlogPosting`](http://schema.org/BlogPosting), [`NewsArticle`](http://schema.org/NewsArticle), [`Person`](http://schema.org/Person), [`Organization`](http://schema.org/Organization), etc.
* `links` - An array of other URLs that represent the same thing that this page represents. For instance, Jane's bio page might include links to Jane's GitHub and Twitter profiles.
* `date_modified` - (YYYY-MM-DD hh:mm) A manual override for the `dateModified` field in the JSON-LD output. This field will take **first priority** for the `dateModified` output. This is useful when the file timestamp does not match the true time that the content was modified.
* A user may also install [Last Modified At](https://github.com/gjtorikian/jekyll-last-modified-at) which will offer an alternative way of providing for the `dateModified` field.
### Customizing image output
@ -195,41 +195,17 @@ For most users, setting `image: [path-to-image]` on a per-page basis should be e
* `path` - The relative path to the image. Same as `image: [path-to-image]`
* `twitter` - The relative path to a Twitter-specific image.
* `facebook` - The relative path to a Facebook-specific image.
* `height` - The height of the image in pixels.
* `width` - The width of image in pixels.
* `height` - The height of the Facebook (`og:image`) image
* `width` - The width of the Facebook (`og:image`) image
You can use any of the above, optional properties, like so:
```yml
image: /img/banner.png
```
Or if you have Facebook or Twitter specific images simply use:
```yml
image:
default:
path: /img/banner.png
height: 100
width: 100
facebook:
path: /img/facebook.png
height: 90
width: 90
twitter: /img/twitter.png
```
Using the image dimensions are optional, but the [Google Structured Data Testing Tool](https://search.google.com/structured-data/testing-tool/u/0/) will consider the JSON-LD to have errors with certain types (i.e. BlogPosting) when an image does not have specified dimensions.
#### Deprecated image output
The older method for setting facebook image dimensions (shown below) is **no longer recommended**. It will continue work as intended, but is no longer the suggested procedure due to the lack of clarity in where these dimensions are assigned.
```yml
image:
facebook: /img/bad_facebook_example.png
height: 100
width: 100
facebook: /img/facebook.png
height: 100
width: 100
```
### Setting a default image

View File

@ -94,27 +94,11 @@
{% endif %}
{% if page.image %}
{% assign seo_page_image_default = page.image.default.path | default: page.image.default | default: page.image.path | default: page.image %}
{% unless seo_page_image_default contains "://" %}
{% assign seo_page_image_default = seo_page_image_default | absolute_url %}
{% assign seo_page_image = page.image.path | default: page.image.facebook | default: page.image %}
{% unless seo_page_image contains "://" %}
{% assign seo_page_image = seo_page_image | absolute_url %}
{% endunless %}
{% assign seo_page_image_default = seo_page_image_default | escape %}
{% assign seo_page_image_default_width = page.image.default.width %}
{% assign seo_page_image_default_height = page.image.default.height %}
{% assign seo_page_image_facebook = page.image.facebook.path | default: page.image.facebook %}
{% unless seo_page_image_facebook contains "://" %}
{% assign seo_page_image_facebook = seo_page_image_facebook | absolute_url %}
{% endunless %}
{% assign seo_page_image_facebook = seo_page_image_facebook | escape %}
{% assign seo_page_image_facebook_width = page.image.facebook.width | default: page.image.width %}
{% assign seo_page_image_facebook_height = page.image.facebook.height | default: page.image.height %}
{% assign seo_page_image_twitter = page.image.twitter.path | default: page.image.twitter %}
{% unless seo_page_image_twitter contains "://" %}
{% assign seo_page_image_twitter = seo_page_image_twitter | absolute_url %}
{% endunless %}
{% assign seo_page_image_twitter = seo_page_image_twitter | escape %}
{% assign seo_page_image = seo_page_image | escape %}
{% endif %}
{% if seo_tag.title and seo_title %}
@ -143,27 +127,18 @@
<meta property="og:site_name" content="{{ seo_site_title }}" />
{% endif %}
{% if page.image %}
{% if page.image.facebook %}
{% assign local_seo_page_image = seo_page_image_facebook %}
{% assign local_seo_page_image_height = seo_page_image_facebook_height %}
{% assign local_seo_page_image_width = seo_page_image_facebook_width %}
{% else %}
{% assign local_seo_page_image = seo_page_image_default %}
{% assign local_seo_page_image_height = seo_page_image_default_height %}
{% assign local_seo_page_image_width = seo_page_image_default_width %}
{% if seo_page_image %}
<meta property="og:image" content="{{ seo_page_image }}" />
{% if page.image.height %}
<meta property="og:image:height" content="{{ page.image.height }}" />
{% endif %}
<meta property="og:image" content="{{ local_seo_page_image }}" />
{% if local_seo_page_image_height %}
<meta property="og:image:height" content="{{ local_seo_page_image_height }}" />
{% endif %}
{% if local_seo_page_image_width %}
<meta property="og:image:width" content="{{ local_seo_page_image_width }}" />
{% if page.image.width %}
<meta property="og:image:width" content="{{ page.image.width }}" />
{% endif %}
{% endif %}
{% if page.image.twitter %}
<meta name="twitter:image" content="{{ seo_page_image_twitter }}" />
<meta name="twitter:image" content="{{ page.image.twitter | absolute_url }}" />
{% endif %}
{% if page.date %}
@ -179,7 +154,7 @@
{% endif %}
{% if site.twitter %}
{% if page.image or page.image.twitter %}
{% if seo_page_image or page.image.twitter %}
<meta name="twitter:card" content="summary_large_image" />
{% else %}
<meta name="twitter:card" content="summary" />
@ -242,22 +217,13 @@
{% if seo_author %}
"author": {
"@type": "Person",
"name": {{ seo_author | jsonify }}
"@type": "Person",
"name": {{ seo_author | jsonify }}
},
{% endif %}
{% if seo_page_image_default %}
{% if seo_page_image_default_height && seo_page_image_default_width %}
"image": {
"@type": "ImageObject",
"url": {{ seo_page_image_default | jsonify }},
"height": {{ seo_page_image_default_height | jsonify }},
"width": {{ seo_page_image_default_width | jsonify }}
},
{% else %}
"image": {{ seo_page_image_default | jsonify }},
{% endif %}
{% if seo_page_image %}
"image": {{ seo_page_image | jsonify }},
{% endif %}
{% if page.date %}
@ -287,8 +253,8 @@
{% if seo_type == "BlogPosting" or seo_type == "CreativeWork"%}
"mainEntityOfPage": {
"@type": "WebPage",
"@id": {{ page.url | replace:'/index.html','/' | absolute_url | jsonify }}
"@type": "WebPage",
"@id": {{ page.url | replace:'/index.html','/' | absolute_url | jsonify }}
},
{% endif %}

View File

@ -188,7 +188,7 @@ describe Jekyll::SeoTag do
end
context "with page.image as an object" do
context "when given 'image' with a path" do
context "when given a path" do
let(:page) { make_page("image" => { "path" => "/img/foo.png" }) }
it "outputs the image" do
@ -197,47 +197,6 @@ describe Jekyll::SeoTag do
end
end
context "when given a default image" do
let(:page) { make_page("image" => { "default" => "/img/default.png" }) }
it "outputs the image" do
expected = %r!<meta property="og:image" content="http://example.invalid/img/default.png" />!
expect(output).to match(expected)
end
it "outputs the default image JSON item" do
expect(json_data["image"]).to eql("http://example.invalid/img/default.png")
end
end
context "when given a default image as a path" do
let(:page) { make_page("image" => { "default" => { "path" => "/img/default.png" } }) }
it "outputs the image" do
expected = %r!<meta property="og:image" content="http://example.invalid/img/default.png" />!
expect(output).to match(expected)
end
it "outputs the default image JSON item" do
expect(json_data["image"]).to eql("http://example.invalid/img/default.png")
end
end
context "when given a default image with dimensions" do
let(:page) { make_page("image" => { "default" => { "path" => "/img/default.png", "height" => 1, "width" => 2 } }) }
it "outputs the image" do
expected = %r!<meta property="og:image" content="http://example.invalid/img/default.png" />!
expect(output).to match(expected)
end
it "outputs the default image JSON object with dimensions" do
expect(json_data["image"]["url"]).to eql("http://example.invalid/img/default.png")
expect(json_data["image"]["height"]).to eql(1)
expect(json_data["image"]["width"]).to eql(2)
end
end
context "when given a facebook image" do
let(:page) { make_page("image" => { "facebook" => "/img/facebook.png" }) }
@ -247,67 +206,6 @@ describe Jekyll::SeoTag do
end
end
context "when given a facebook image as a path" do
let(:page) { make_page("image" => { "facebook" => { "path" => "/img/facebook.png" } }) }
it "outputs the image" do
expected = %r!<meta property="og:image" content="http://example.invalid/img/facebook.png" />!
expect(output).to match(expected)
end
end
# Ensuring the facebook image takes priority for OG tags, and Default for JSON
context "when given a facebook image (with dimensions) and a default image (with different dimensions)" do
let(:meta) do
{
"image" => {
"facebook" => { "path" => "/img/facebook.png", "height" => 1, "width" => 2 },
"default" => { "path" => "/img/default.png", "height" => 3, "width" => 4 },
},
}
end
let(:page) { make_page(meta) }
it "outputs the facebook image with its dimensions" do
expected = %r!<meta property="og:image:height" content="1" />!
expect(output).to match(expected)
expected = %r!<meta property="og:image:width" content="2" />!
expect(output).to match(expected)
end
it "outputs the default image JSON object with dimensions" do
expect(json_data["image"]["url"]).to eql("http://example.invalid/img/default.png")
expect(json_data["image"]["height"]).to eql(3)
expect(json_data["image"]["width"]).to eql(4)
end
end
# Making sure the facebook image does not inherit the default image dimensions
context "when given a facebook image without dimensions and a default image with dimensions" do
let(:meta) do
{
"image" => {
"facebook" => { "path" => "/img/facebook.png" },
"default" => { "path" => "/img/default.png", "height" => 3, "width" => 4 },
},
}
end
let(:page) { make_page(meta) }
it "outputs the facebook image without dimensions" do
expected = %r!<meta property="og:image:height" content="3" />!
expect(output).not_to match(expected)
expected = %r!<meta property="og:image:width" content="4" />!
expect(output).not_to match(expected)
end
it "outputs the default image JSON object with dimensions" do
expect(json_data["image"]["url"]).to eql("http://example.invalid/img/default.png")
expect(json_data["image"]["height"]).to eql(3)
expect(json_data["image"]["width"]).to eql(4)
end
end
context "when given a twitter image" do
let(:page) { make_page("image" => { "twitter" => "/img/twitter.png" }) }
@ -317,18 +215,9 @@ describe Jekyll::SeoTag do
end
end
context "when given a twitter image as a path" do
let(:page) { make_page("image" => { "twitter" => { "path" => "/img/twitter.png" } }) }
it "outputs the image" do
expected = %r!<meta name="twitter:image" content="http://example.invalid/img/twitter.png" />!
expect(output).to match(expected)
end
end
# A legacy test for an old implementation of facebook height and width
context "when given the image height and width (legacy)" do
let(:page) { make_page("image" => { "facebook" => "/img/foo.png", "height" => 1, "width" => 2 }) }
context "when given the image height and width" do
let(:image) { { "facebook" => "/img/foo.png", "height" => 1, "width" => 2 } }
let(:page) { make_page("image" => image) }
it "outputs the image" do
expected = %r!<meta property="og:image:height" content="1" />!