jekyll_picture_tag 1.9.0 → 1.12.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/.rubocop.yml +4 -0
- data/.travis.yml +4 -7
- data/Dockerfile +9 -0
- data/docs/Gemfile +4 -2
- data/docs/Gemfile.lock +186 -89
- data/docs/_config.yml +6 -10
- data/docs/devs/contributing/code.md +44 -0
- data/docs/devs/contributing/docs.md +13 -0
- data/docs/devs/contributing/index.md +15 -0
- data/docs/devs/contributing/setup.md +13 -0
- data/docs/devs/contributing/testing.md +41 -0
- data/docs/devs/index.md +7 -0
- data/docs/{releases.md → devs/releases.md} +35 -13
- data/docs/index.md +58 -36
- data/docs/users/configuration/cdn.md +35 -0
- data/docs/users/configuration/directories.md +34 -0
- data/docs/users/configuration/disable.md +24 -0
- data/docs/users/configuration/fast_build.md +28 -0
- data/docs/users/configuration/ignore_missing.md +23 -0
- data/docs/users/configuration/index.md +29 -0
- data/docs/users/configuration/kramdown_fix.md +20 -0
- data/docs/users/configuration/relative_urls.md +15 -0
- data/docs/users/configuration/suppress_warnings.md +16 -0
- data/docs/users/index.md +7 -0
- data/docs/users/installation.md +52 -0
- data/docs/users/liquid_tag/argument_reference/alternate_images.md +18 -0
- data/docs/users/liquid_tag/argument_reference/attributes.md +42 -0
- data/docs/users/liquid_tag/argument_reference/base_image.md +12 -0
- data/docs/users/liquid_tag/argument_reference/crop.md +48 -0
- data/docs/users/liquid_tag/argument_reference/link.md +16 -0
- data/docs/users/liquid_tag/argument_reference/preset.md +17 -0
- data/docs/users/liquid_tag/argument_reference/readme.md +9 -0
- data/docs/users/liquid_tag/examples.md +81 -0
- data/docs/users/liquid_tag/index.md +31 -0
- data/docs/users/notes/git_lfs.md +7 -0
- data/docs/users/notes/github_pages.md +5 -0
- data/docs/users/notes/html_attributes.md +5 -0
- data/docs/users/notes/index.md +6 -0
- data/docs/users/notes/input_checking.md +6 -0
- data/docs/users/notes/kramdown_bug.md +41 -0
- data/docs/users/notes/managing_images.md +21 -0
- data/docs/{migration.md → users/notes/migration.md} +0 -0
- data/docs/users/presets/cropping.md +61 -0
- data/docs/users/presets/default.md +23 -0
- data/docs/users/presets/examples.md +79 -0
- data/docs/users/presets/fallback_image.md +28 -0
- data/docs/users/presets/html_attributes.md +26 -0
- data/docs/users/presets/image_formats.md +21 -0
- data/docs/users/presets/image_quality.md +43 -0
- data/docs/users/presets/index.md +101 -0
- data/docs/users/presets/link_source.md +16 -0
- data/docs/users/presets/markup_formats/fragments.md +48 -0
- data/docs/users/presets/markup_formats/javascript_friendly.md +57 -0
- data/docs/users/presets/markup_formats/readme.md +43 -0
- data/docs/users/presets/markup_formats/standard_html.md +25 -0
- data/docs/users/presets/media_queries.md +36 -0
- data/docs/users/presets/nomarkdown_override.md +17 -0
- data/docs/users/presets/pixel_ratio_srcsets.md +32 -0
- data/docs/users/presets/width_height_attributes.md +34 -0
- data/docs/users/presets/width_srcsets.md +85 -0
- data/jekyll_picture_tag.gemspec +1 -1
- data/lib/jekyll_picture_tag.rb +1 -0
- data/lib/jekyll_picture_tag/cache.rb +3 -0
- data/lib/jekyll_picture_tag/cache/base.rb +59 -0
- data/lib/jekyll_picture_tag/cache/generated.rb +20 -0
- data/lib/jekyll_picture_tag/cache/source.rb +19 -0
- data/lib/jekyll_picture_tag/defaults/presets.yml +2 -0
- data/lib/jekyll_picture_tag/generated_image.rb +52 -41
- data/lib/jekyll_picture_tag/img_uri.rb +1 -0
- data/lib/jekyll_picture_tag/instructions.rb +1 -0
- data/lib/jekyll_picture_tag/instructions/arg_splitter.rb +69 -0
- data/lib/jekyll_picture_tag/instructions/configuration.rb +1 -1
- data/lib/jekyll_picture_tag/instructions/preset.rb +40 -15
- data/lib/jekyll_picture_tag/instructions/set.rb +23 -9
- data/lib/jekyll_picture_tag/instructions/tag_parser.rb +59 -69
- data/lib/jekyll_picture_tag/output_formats/basic.rb +34 -15
- data/lib/jekyll_picture_tag/output_formats/img.rb +11 -0
- data/lib/jekyll_picture_tag/output_formats/picture.rb +22 -0
- data/lib/jekyll_picture_tag/router.rb +9 -0
- data/lib/jekyll_picture_tag/source_image.rb +60 -44
- data/lib/jekyll_picture_tag/srcsets/basic.rb +29 -7
- data/lib/jekyll_picture_tag/utils.rb +18 -0
- data/lib/jekyll_picture_tag/version.rb +1 -1
- data/readme.md +40 -16
- metadata +67 -20
- data/docs/_layouts/directory.html +0 -32
- data/docs/assets/style.css +0 -31
- data/docs/contributing.md +0 -75
- data/docs/example_presets.md +0 -116
- data/docs/global_configuration.md +0 -173
- data/docs/installation.md +0 -30
- data/docs/notes.md +0 -91
- data/docs/output.md +0 -63
- data/docs/presets.md +0 -309
- data/docs/usage.md +0 -113
metadata
CHANGED
@@ -1,16 +1,16 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: jekyll_picture_tag
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.
|
4
|
+
version: 1.12.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Robert Wierzbowski
|
8
8
|
- Brendan Tobolaski
|
9
9
|
- Robert Buchberger
|
10
|
-
autorequire:
|
10
|
+
autorequire:
|
11
11
|
bindir: bin
|
12
12
|
cert_chain: []
|
13
|
-
date: 2020-
|
13
|
+
date: 2020-07-29 00:00:00.000000000 Z
|
14
14
|
dependencies:
|
15
15
|
- !ruby/object:Gem::Dependency
|
16
16
|
name: bundler
|
@@ -186,14 +186,14 @@ dependencies:
|
|
186
186
|
requirements:
|
187
187
|
- - "~>"
|
188
188
|
- !ruby/object:Gem::Version
|
189
|
-
version: 1.1.
|
189
|
+
version: 1.1.2
|
190
190
|
type: :runtime
|
191
191
|
prerelease: false
|
192
192
|
version_requirements: !ruby/object:Gem::Requirement
|
193
193
|
requirements:
|
194
194
|
- - "~>"
|
195
195
|
- !ruby/object:Gem::Version
|
196
|
-
version: 1.1.
|
196
|
+
version: 1.1.2
|
197
197
|
- !ruby/object:Gem::Dependency
|
198
198
|
name: jekyll
|
199
199
|
requirement: !ruby/object:Gem::Requirement
|
@@ -225,34 +225,81 @@ files:
|
|
225
225
|
- ".ruby-version"
|
226
226
|
- ".solargraph.yml"
|
227
227
|
- ".travis.yml"
|
228
|
+
- Dockerfile
|
228
229
|
- Gemfile
|
229
230
|
- LICENSE.txt
|
230
231
|
- Rakefile
|
231
232
|
- docs/Gemfile
|
232
233
|
- docs/Gemfile.lock
|
233
234
|
- docs/_config.yml
|
234
|
-
- docs/
|
235
|
-
- docs/
|
236
|
-
- docs/contributing.md
|
237
|
-
- docs/
|
238
|
-
- docs/
|
235
|
+
- docs/devs/contributing/code.md
|
236
|
+
- docs/devs/contributing/docs.md
|
237
|
+
- docs/devs/contributing/index.md
|
238
|
+
- docs/devs/contributing/setup.md
|
239
|
+
- docs/devs/contributing/testing.md
|
240
|
+
- docs/devs/index.md
|
241
|
+
- docs/devs/releases.md
|
239
242
|
- docs/index.md
|
240
|
-
- docs/
|
241
|
-
- docs/
|
242
|
-
- docs/
|
243
|
-
- docs/
|
244
|
-
- docs/
|
245
|
-
- docs/
|
246
|
-
- docs/
|
243
|
+
- docs/users/configuration/cdn.md
|
244
|
+
- docs/users/configuration/directories.md
|
245
|
+
- docs/users/configuration/disable.md
|
246
|
+
- docs/users/configuration/fast_build.md
|
247
|
+
- docs/users/configuration/ignore_missing.md
|
248
|
+
- docs/users/configuration/index.md
|
249
|
+
- docs/users/configuration/kramdown_fix.md
|
250
|
+
- docs/users/configuration/relative_urls.md
|
251
|
+
- docs/users/configuration/suppress_warnings.md
|
252
|
+
- docs/users/index.md
|
253
|
+
- docs/users/installation.md
|
254
|
+
- docs/users/liquid_tag/argument_reference/alternate_images.md
|
255
|
+
- docs/users/liquid_tag/argument_reference/attributes.md
|
256
|
+
- docs/users/liquid_tag/argument_reference/base_image.md
|
257
|
+
- docs/users/liquid_tag/argument_reference/crop.md
|
258
|
+
- docs/users/liquid_tag/argument_reference/link.md
|
259
|
+
- docs/users/liquid_tag/argument_reference/preset.md
|
260
|
+
- docs/users/liquid_tag/argument_reference/readme.md
|
261
|
+
- docs/users/liquid_tag/examples.md
|
262
|
+
- docs/users/liquid_tag/index.md
|
263
|
+
- docs/users/notes/git_lfs.md
|
264
|
+
- docs/users/notes/github_pages.md
|
265
|
+
- docs/users/notes/html_attributes.md
|
266
|
+
- docs/users/notes/index.md
|
267
|
+
- docs/users/notes/input_checking.md
|
268
|
+
- docs/users/notes/kramdown_bug.md
|
269
|
+
- docs/users/notes/managing_images.md
|
270
|
+
- docs/users/notes/migration.md
|
271
|
+
- docs/users/presets/cropping.md
|
272
|
+
- docs/users/presets/default.md
|
273
|
+
- docs/users/presets/examples.md
|
274
|
+
- docs/users/presets/fallback_image.md
|
275
|
+
- docs/users/presets/html_attributes.md
|
276
|
+
- docs/users/presets/image_formats.md
|
277
|
+
- docs/users/presets/image_quality.md
|
278
|
+
- docs/users/presets/index.md
|
279
|
+
- docs/users/presets/link_source.md
|
280
|
+
- docs/users/presets/markup_formats/fragments.md
|
281
|
+
- docs/users/presets/markup_formats/javascript_friendly.md
|
282
|
+
- docs/users/presets/markup_formats/readme.md
|
283
|
+
- docs/users/presets/markup_formats/standard_html.md
|
284
|
+
- docs/users/presets/media_queries.md
|
285
|
+
- docs/users/presets/nomarkdown_override.md
|
286
|
+
- docs/users/presets/pixel_ratio_srcsets.md
|
287
|
+
- docs/users/presets/width_height_attributes.md
|
288
|
+
- docs/users/presets/width_srcsets.md
|
247
289
|
- jekyll-picture-tag.gemspec
|
248
290
|
- jekyll_picture_tag.gemspec
|
249
291
|
- lib/jekyll-picture-tag.rb
|
250
292
|
- lib/jekyll_picture_tag.rb
|
293
|
+
- lib/jekyll_picture_tag/cache.rb
|
294
|
+
- lib/jekyll_picture_tag/cache/base.rb
|
295
|
+
- lib/jekyll_picture_tag/cache/generated.rb
|
296
|
+
- lib/jekyll_picture_tag/cache/source.rb
|
251
297
|
- lib/jekyll_picture_tag/defaults/global.yml
|
252
298
|
- lib/jekyll_picture_tag/defaults/presets.yml
|
253
299
|
- lib/jekyll_picture_tag/generated_image.rb
|
254
300
|
- lib/jekyll_picture_tag/img_uri.rb
|
255
301
|
- lib/jekyll_picture_tag/instructions.rb
|
302
|
+
- lib/jekyll_picture_tag/instructions/arg_splitter.rb
|
256
303
|
- lib/jekyll_picture_tag/instructions/configuration.rb
|
257
304
|
- lib/jekyll_picture_tag/instructions/html_attributes.rb
|
258
305
|
- lib/jekyll_picture_tag/instructions/preset.rb
|
@@ -283,7 +330,7 @@ homepage: https://github.com/rbuchberger/jekyll_picture_tag
|
|
283
330
|
licenses:
|
284
331
|
- BSD-3-Clause
|
285
332
|
metadata: {}
|
286
|
-
post_install_message:
|
333
|
+
post_install_message:
|
287
334
|
rdoc_options: []
|
288
335
|
require_paths:
|
289
336
|
- lib
|
@@ -301,8 +348,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
301
348
|
- !ruby/object:Gem::Version
|
302
349
|
version: '0'
|
303
350
|
requirements: []
|
304
|
-
rubygems_version: 3.
|
305
|
-
signing_key:
|
351
|
+
rubygems_version: 3.1.4
|
352
|
+
signing_key:
|
306
353
|
specification_version: 4
|
307
354
|
summary: Easy responsive images for Jekyll.
|
308
355
|
test_files: []
|
@@ -1,32 +0,0 @@
|
|
1
|
-
---
|
2
|
-
layout: default
|
3
|
-
---
|
4
|
-
|
5
|
-
<link href="{{ site.baseurl }}/assets/style.css" rel="stylesheet" type="text/css">
|
6
|
-
|
7
|
-
<ul class="directory">
|
8
|
-
<li><a href="{{ site.baseurl }}/">Quick Start</a></li>
|
9
|
-
<li><a href="{{ site.baseurl }}/installation">Installation</a></li>
|
10
|
-
<li><a href="{{ site.baseurl }}/usage">Usage</a></li>
|
11
|
-
<li><a href="{{ site.baseurl }}/global_configuration">Global Settings</a></li>
|
12
|
-
<li><a href="{{ site.baseurl }}/presets">Writing Presets</a></li>
|
13
|
-
<li><a href="{{ site.baseurl }}/example_presets">Example Presets</a></li>
|
14
|
-
<li><a href="{{ site.baseurl }}/output">Output Formats</a></li>
|
15
|
-
<li><a href="{{ site.baseurl }}/notes">Notes and FAQ</a></li>
|
16
|
-
<li><a href="{{ site.baseurl }}/contributing">Contributing</a></li>
|
17
|
-
<li><a href="{{ site.baseurl }}/releases">Release History</a></li>
|
18
|
-
</ul>
|
19
|
-
|
20
|
-
<hr />
|
21
|
-
|
22
|
-
{{ content }}
|
23
|
-
|
24
|
-
<script>
|
25
|
-
const navItems = Array.from(document.querySelectorAll('ul.directory li'))
|
26
|
-
const currentPath = window.location.toString()
|
27
|
-
const activeItem = navItems.find(function(item) {
|
28
|
-
return item.firstChild.href == currentPath
|
29
|
-
})
|
30
|
-
|
31
|
-
activeItem.classList.add('active')
|
32
|
-
</script>
|
data/docs/assets/style.css
DELETED
@@ -1,31 +0,0 @@
|
|
1
|
-
@media (max-width: 600px) {
|
2
|
-
ul.directory {
|
3
|
-
flex-direction: column;
|
4
|
-
align-items: center;
|
5
|
-
}
|
6
|
-
}
|
7
|
-
|
8
|
-
ul.directory {
|
9
|
-
display: flex;
|
10
|
-
flex-wrap: wrap;
|
11
|
-
justify-content: center;
|
12
|
-
list-style: none;
|
13
|
-
padding-left: 0;
|
14
|
-
flex-grow: 0;
|
15
|
-
}
|
16
|
-
|
17
|
-
ul.directory li {
|
18
|
-
margin: .3em;
|
19
|
-
}
|
20
|
-
|
21
|
-
ul.directory a {
|
22
|
-
line-height: 2;
|
23
|
-
padding: 8px 20px;
|
24
|
-
}
|
25
|
-
|
26
|
-
li.active a {
|
27
|
-
border-radius: 3px;
|
28
|
-
background-color: #007edf;
|
29
|
-
color: #fff;
|
30
|
-
box-shadow: 2px 2px 3px #999;
|
31
|
-
}
|
data/docs/contributing.md
DELETED
@@ -1,75 +0,0 @@
|
|
1
|
-
---
|
2
|
-
---
|
3
|
-
# Contributing
|
4
|
-
|
5
|
-
Bug reports, feature requests, and feedback are very welcome, either through github issues or via
|
6
|
-
email: robert@buchberger.cc
|
7
|
-
|
8
|
-
Pull requests are encouraged! I'm happy to answer questions and provide assistance along the way.
|
9
|
-
Don't let any of the recommendations/requests in this guide stop you from submitting one.
|
10
|
-
|
11
|
-
## Setup
|
12
|
-
|
13
|
-
Getting up and running is pretty standard-- `git clone`, `cd` into the directory and `bundle
|
14
|
-
install`.
|
15
|
-
|
16
|
-
## Testing
|
17
|
-
|
18
|
-
`rake test` runs the test suite (both unit tests and integration tests). Ignore the mini_magick
|
19
|
-
`method redefined` warnings (unless you know how to fix them?)
|
20
|
-
|
21
|
-
`rake unit` runs just the unit tests, while `rake integration` runs the integration tests. The unit
|
22
|
-
test coverage isn't stellar, but both unit and integration tests together hit 100%.
|
23
|
-
|
24
|
-
Speaking of coverage, simplecov is set up -- you'll get a measurement of coverage in the test output
|
25
|
-
and a nice report in the `coverage` directory. I'd like to move to mutation based coverage testing,
|
26
|
-
but that's a project for another day.
|
27
|
-
|
28
|
-
The tests do output a few images to the `/tmp/` directory, which I'm pretty sure means it won't work
|
29
|
-
on Windows. This is fixable if there is a need, so if that gets in your way just ask.
|
30
|
-
|
31
|
-
`rake rubocop` checks code formatting, `rake rubocop:auto_correct` will try to fix any rubocop
|
32
|
-
issues, if possible.
|
33
|
-
|
34
|
-
`rake` will run all tests and rubocop.
|
35
|
-
|
36
|
-
## Docs
|
37
|
-
|
38
|
-
The docs are set up for github pages, which is based on jekyll. You can preview them locally as you
|
39
|
-
edit:
|
40
|
-
|
41
|
-
1. `cd docs`
|
42
|
-
2. `bundle install`
|
43
|
-
3. `bundle exec jekyll serve`
|
44
|
-
|
45
|
-
## Guidelines
|
46
|
-
|
47
|
-
* Generally, go for straightforward and readable rather than terse and clever. I'm not actually a
|
48
|
-
very good programmer; I need simple code that's easy to understand.
|
49
|
-
|
50
|
-
* Internal refactoring is welcome, especially in the name of the previous point.
|
51
|
-
|
52
|
-
* I'm very reluctant to introduce breaking changes to configuration settings. This rule isn't
|
53
|
-
absolute, but I'm not going to do it without a good reason.
|
54
|
-
|
55
|
-
* The addition of new test cases whenever relevant is certainly appreciated. This project went for
|
56
|
-
awhile without any proper tests, but now that we're at 100% coverage it would be nice to keep it
|
57
|
-
that way.
|
58
|
-
|
59
|
-
* I've been using 80 characters for code and 100 characters for documentation.
|
60
|
-
|
61
|
-
## Hard rules
|
62
|
-
|
63
|
-
* Liquid tag syntax can only be extended; no breaking changes. I'm not willing to force
|
64
|
-
users to dig through their entire site and change every picture tag in order to update to the
|
65
|
-
latest version.
|
66
|
-
|
67
|
-
* Maintain "no configuration required" - a new user must be able to add jpt to their gemfile, bundle
|
68
|
-
install, and start writing picture tags in their site without touching a yml file.
|
69
|
-
|
70
|
-
* All tests pass, and all rubocop warnings are addressed.
|
71
|
-
|
72
|
-
### Thanks!
|
73
|
-
|
74
|
-
As I said, don't let any of the rules & guidelines scare you away. They're the rules for merging
|
75
|
-
into master, not submitting a pull request. I'm thrilled to receive any help at all.
|
data/docs/example_presets.md
DELETED
@@ -1,116 +0,0 @@
|
|
1
|
-
---
|
2
|
-
---
|
3
|
-
# /_data/picture.yml
|
4
|
-
|
5
|
-
These are example settings- I mostly made them up off the top of my head. You
|
6
|
-
probably don't want to just copy-paste them. The full documentation
|
7
|
-
for these can be found [here]({{ site.baseurl }}/presets).
|
8
|
-
|
9
|
-
```yml
|
10
|
-
|
11
|
-
# Media presets are just named css media queries, used in several places:
|
12
|
-
# - To specify alternate source images (for art direction)
|
13
|
-
# - To build the 'sizes' attribute
|
14
|
-
# - When given alternate source images, specify which sizes to generate.
|
15
|
-
media_presets:
|
16
|
-
wide_desktop: 'min-width: 1801px'
|
17
|
-
desktop: 'max-width: 1800px'
|
18
|
-
wide_tablet: 'max-width: 1200px'
|
19
|
-
tablet: 'max-width: 900px'
|
20
|
-
mobile: 'max-width: 600px'
|
21
|
-
|
22
|
-
# Markup presets allow you to group settings together, and select one of them by
|
23
|
-
# name in your jekyll tag. All settings are optional.
|
24
|
-
markup_presets:
|
25
|
-
|
26
|
-
default:
|
27
|
-
# What form the output markup should take:
|
28
|
-
markup: auto
|
29
|
-
|
30
|
-
# Must be an array, and order matters. Defaults to just 'original', which
|
31
|
-
# does what you'd expect.
|
32
|
-
formats: [webp, original]
|
33
|
-
|
34
|
-
# Must be an array: which image sizes (width in pixels) to generate (unless
|
35
|
-
# directed otherwise below). If not specified, will use sensible default
|
36
|
-
# values.
|
37
|
-
widths: [200, 400, 800, 1600]
|
38
|
-
|
39
|
-
# Alternate source images (for art direction) are associated with media
|
40
|
-
# query presets. Here, you can optionally specify a different set of sizes
|
41
|
-
# to generate for those alternate source images. This is how you avoid
|
42
|
-
# generating a 1600 pixel wide image that's only shown on narrow screens.
|
43
|
-
# Must be arrays.
|
44
|
-
media_widths:
|
45
|
-
mobile: [200, 400, 600]
|
46
|
-
tablet: [400, 600, 800]
|
47
|
-
|
48
|
-
# For building the 'sizes' attribute on img and source tags. specifies how
|
49
|
-
# wide the image will be when a given media query is true. Note that every
|
50
|
-
# source in a given <picture> tag will have the same associated sizes
|
51
|
-
# attribute.
|
52
|
-
sizes:
|
53
|
-
mobile: 100vw
|
54
|
-
tablet: 80vw
|
55
|
-
|
56
|
-
# Specifies an optional, unconditional size attribute. Can be given alone,
|
57
|
-
# or if specified in combination with 'sizes' below, will be given last
|
58
|
-
# (when no media queries apply).
|
59
|
-
size: 800px
|
60
|
-
|
61
|
-
# Specify the properties of the fallback image. If not specified, will
|
62
|
-
# return a 900 pixel wide image in the original format.
|
63
|
-
fallback_width: 800
|
64
|
-
fallback_format: original
|
65
|
-
|
66
|
-
# Add HTML attributes. 'parent' will go to the <picture> tag if it's there,
|
67
|
-
# otherwise the 'img' tag.
|
68
|
-
attributes:
|
69
|
-
parent: 'data-downloadable="true"'
|
70
|
-
picture: 'class="awesome" data-volume="11"'
|
71
|
-
img: 'class="some-other-class"'
|
72
|
-
a: 'class="image-link"'
|
73
|
-
|
74
|
-
# This will wrap images in a link to the original source image. Obviously
|
75
|
-
# your source images will need to be part of the deployed site for this to
|
76
|
-
# work. If you have issues such as mangled HTML or extra {::nomarkdown}
|
77
|
-
# tags floating around, see docs/notes.md
|
78
|
-
link-source: true
|
79
|
-
|
80
|
-
# This is an example of how you would create a 'multiplier' based srcset;
|
81
|
-
# useful when an image will always be the same size on all screens (icons,
|
82
|
-
# graphics, thumbnails, etc), but you'd like to supply higher resolution
|
83
|
-
# images to devices with higher pixel ratios.
|
84
|
-
icon:
|
85
|
-
base_width: 20 # How wide the 1x image should be
|
86
|
-
pixel_ratios: [1, 1.5, 2]
|
87
|
-
fallback_width: 20
|
88
|
-
attributes:
|
89
|
-
img: 'class="icon"'
|
90
|
-
|
91
|
-
# Here's an example of how you'd configure jekyll-picture-tag to work with
|
92
|
-
# something like lazyload:
|
93
|
-
# https://github.com/verlok/lazyload
|
94
|
-
lazy:
|
95
|
-
# data_auto gives you data-src, data-srcset, and data-sizes instead of src,
|
96
|
-
# srcset, and sizes:
|
97
|
-
markup: data_auto
|
98
|
-
formats: [webp, original]
|
99
|
-
widths: [200, 400, 600, 800]
|
100
|
-
noscript: true # add a fallback image inside a <noscript> tag.
|
101
|
-
attributes:
|
102
|
-
img: class="lazy"
|
103
|
-
|
104
|
-
# This is an example of how you'd get generated image and a URL, and nothing
|
105
|
-
# else.
|
106
|
-
direct:
|
107
|
-
markup: direct_url
|
108
|
-
fallback_format: webp # Default original
|
109
|
-
fallback_width: 600 # Default 800
|
110
|
-
|
111
|
-
# Here's a naked srcset. Doesn't even give you the surrounding quotes.
|
112
|
-
srcset:
|
113
|
-
markup: naked_srcset
|
114
|
-
formats: [webp] # must be an array, even if it only has one item
|
115
|
-
|
116
|
-
```
|
@@ -1,173 +0,0 @@
|
|
1
|
-
---
|
2
|
-
---
|
3
|
-
# Global Configuration
|
4
|
-
|
5
|
-
**All configuration is optional**. If you are happy with the defaults, you don't have to touch a
|
6
|
-
single yaml file.
|
7
|
-
|
8
|
-
Global settings are stored under the `picture:` key in `/_config.yml`.
|
9
|
-
|
10
|
-
**Example config:**
|
11
|
-
|
12
|
-
```yml
|
13
|
-
picture:
|
14
|
-
source: "assets/images/fullsize"
|
15
|
-
output: "assets/images/generated"
|
16
|
-
```
|
17
|
-
|
18
|
-
* **Source Image Directory**
|
19
|
-
|
20
|
-
*Format:* `source: (directory)`
|
21
|
-
|
22
|
-
*Example:* `source: images/`
|
23
|
-
|
24
|
-
*Default:* Jekyll site root.
|
25
|
-
|
26
|
-
To make writing tags easier you can specify a source directory for your assets. Base images in the
|
27
|
-
tag will be relative to the `source` directory, which is relative to the Jekyll site root.
|
28
|
-
|
29
|
-
{% raw %}
|
30
|
-
For example, if `source` is set to `assets/images/_fullsize`, the tag
|
31
|
-
`{% picture enishte/portrait.jpg --alt An unsual picture %}` will look for a file at
|
32
|
-
{% endraw %}
|
33
|
-
`assets/images/_fullsize/enishte/portrait.jpg`.
|
34
|
-
|
35
|
-
* **Destination Image Directory**
|
36
|
-
|
37
|
-
*Format:* `output: (directory)`
|
38
|
-
|
39
|
-
*Example:* `output: resized_images/`
|
40
|
-
|
41
|
-
*Default*: `generated/`
|
42
|
-
|
43
|
-
Jekyll Picture Tag saves resized, reformatted images to the `output` directory in your compiled
|
44
|
-
site. The organization of your `source` directory is maintained.
|
45
|
-
|
46
|
-
This setting is relative to your compiled site, which means `_site` unless you've changed it.
|
47
|
-
|
48
|
-
* **Suppress Warnings**
|
49
|
-
|
50
|
-
*Format:* `suppress_warnings: (true|false)`
|
51
|
-
|
52
|
-
*Example:* `suppress_warnings: true`
|
53
|
-
|
54
|
-
*Default*: `false`
|
55
|
-
|
56
|
-
Jekyll Picture Tag will warn you in a few different scenarios, such as when your base image is
|
57
|
-
smaller than one of the sizes in your preset. (Note that Jekyll Picture Tag will never resize an
|
58
|
-
image to be larger than its source). Set this value to `true`, and these warnings will not be shown.
|
59
|
-
|
60
|
-
* **Continue build with missing source images**
|
61
|
-
|
62
|
-
*Format:* `ignore_missing_images: (boolean|environment name|array of environments)`
|
63
|
-
|
64
|
-
*Example:* `ignore_missing_images: [development, testing]`
|
65
|
-
|
66
|
-
*Default:* `false`
|
67
|
-
|
68
|
-
Normally, JPT will raise an error if a source image is missing, causing the entire site build to
|
69
|
-
fail. This setting allows you to bypass this behavior and continue the build, either for certain
|
70
|
-
build environments or all the time. I highly encourage you to set this to `development`, and set
|
71
|
-
the jekyll build environment to `production` when you build for production so you don't shoot
|
72
|
-
yourself in the foot (publish a site with broken images). You can read more about Jekyll
|
73
|
-
environments [here](https://jekyllrb.com/docs/configuration/environments/).
|
74
|
-
|
75
|
-
* **Use Relative Urls**
|
76
|
-
|
77
|
-
*Format:* `relative_url: (true|false)`
|
78
|
-
|
79
|
-
*Example:* `relative_url: false`
|
80
|
-
|
81
|
-
*Default*: `true`
|
82
|
-
|
83
|
-
Whether to use relative (`/generated/test(...).jpg`) or absolute
|
84
|
-
(`https://example.com/generated/test(...).jpg`) urls in your src and srcset attributes.
|
85
|
-
|
86
|
-
* **Use a CDN Url**
|
87
|
-
|
88
|
-
*Format:* `cdn_url: (url)`
|
89
|
-
|
90
|
-
*Example:* `cdn_url: https://cdn.example.com`
|
91
|
-
|
92
|
-
*Default*: none
|
93
|
-
|
94
|
-
Use for images that are hosted at a different domain or subdomain than the Jekyll site root. Overrides
|
95
|
-
`relative_url`. Keep reading, the next option is important.
|
96
|
-
|
97
|
-
* **CDN build environments**
|
98
|
-
|
99
|
-
*Format:* `cdn_environments: (array of strings)`
|
100
|
-
|
101
|
-
*Example:* `cdn_environments: ['production', 'staging']`
|
102
|
-
|
103
|
-
*Default*: `['production']`
|
104
|
-
|
105
|
-
It's likely that if you're using a CDN, you may not want to use it in your local development environment. This
|
106
|
-
allows you to build a site with local images while in development, and still push to a CDN when you build for
|
107
|
-
production by specifying a different [environment](https://jekyllrb.com/docs/configuration/environments/).
|
108
|
-
|
109
|
-
**Note that the default jekyll environment is `development`**, meaning that if you only set `cdn_url` and run
|
110
|
-
`jekyll serve` or `jekyll build`, nothing will change. You'll either need to run `JEKYLL_ENV=production bundle exec
|
111
|
-
jekyll build`, or add `development` to this setting.
|
112
|
-
|
113
|
-
* **Kramdown nomarkdown fix**
|
114
|
-
|
115
|
-
*Format:* `nomarkdown: (true|false)`
|
116
|
-
|
117
|
-
*Example:* `nomarkdown: false`
|
118
|
-
|
119
|
-
*Default:* `true`
|
120
|
-
|
121
|
-
Whether or not to surround j-p-t's output with a `{::nomarkdown}..{:/nomarkdown}` block when called
|
122
|
-
from within a markdown file.
|
123
|
-
|
124
|
-
This setting is overridden by the same setting in a preset. See [the notes]({{ site.baseurl
|
125
|
-
}}/notes) for more detailed information.
|
126
|
-
|
127
|
-
* **Fast Build**
|
128
|
-
|
129
|
-
*Format:* `fast_build: (true|false|environment|array of environments)`
|
130
|
-
|
131
|
-
*Examples:*
|
132
|
-
|
133
|
-
- `fast_build: true`
|
134
|
-
|
135
|
-
- `fast_build: development`
|
136
|
-
|
137
|
-
- `fast_build: [development, staging]`
|
138
|
-
|
139
|
-
*Default:* `false`
|
140
|
-
|
141
|
-
Makes a tradeoff: Speeds repeated build times for sites with many images, by assuming that the
|
142
|
-
filename alone is enough to uniquely identify a source image. This doesn't speed up image
|
143
|
-
generation, just detection of whether or not it's necessary.
|
144
|
-
|
145
|
-
Ordinarily, JPT generates an MD5 hash for every source image, every site build. This ensures that
|
146
|
-
if you replace one image with another, but keep the filename the same, JPT will correctly generate
|
147
|
-
images for the new file. If you have many large images and/or limited hardware, this can take some
|
148
|
-
time and make the development process painful. Enable this setting to skip MD5 hash checking on
|
149
|
-
existing generated images (most of the time), and just assume that if the filename, format, and
|
150
|
-
width match then it's the right one. If there are multiple possible matches (resulting from
|
151
|
-
leftover generated images from previous filename replacements), it'll compute a hash instead of
|
152
|
-
guessing randomly.
|
153
|
-
|
154
|
-
* **Disable Jekyll Picture Tag**
|
155
|
-
|
156
|
-
*Format:* `disabled: (true|false|environment|array of environments)`
|
157
|
-
|
158
|
-
*Examples:*
|
159
|
-
|
160
|
-
- `disabled: true`
|
161
|
-
|
162
|
-
- `disabled: development`
|
163
|
-
|
164
|
-
- `disabled: [development, staging]`
|
165
|
-
|
166
|
-
*Default:* `false`
|
167
|
-
|
168
|
-
Disable image and markup generation entirely. Useful for debugging, or to speed up site builds
|
169
|
-
when you're working on something else.
|
170
|
-
|
171
|
-
Hint: If you're going to toggle this on and off frequently, you might just use an environment
|
172
|
-
variable. Set this to something like `nopics`, and then start the Jekyll server with something
|
173
|
-
like `JEKYLL_ENV=nopics bundle exec jekyll serve` when you don't want image generation.
|