rotate resized images based on exif info
EXIF rotation information embedded by the capture device is now respected when generating output images. Original images remain untouched.
This commit is contained in:
parent
0cc608031e
commit
438bb264d1
23
README.md
23
README.md
|
@ -47,6 +47,11 @@ responsive_image:
|
||||||
- width: 1400
|
- width: 1400
|
||||||
quality: 90
|
quality: 90
|
||||||
|
|
||||||
|
# [Optional, Default: false]
|
||||||
|
# Rotate resized images depending on their EXIF rotation attribute. Useful for
|
||||||
|
# working with JPGs directly from digital cameras and smartphones
|
||||||
|
respect_exif_rotation: false
|
||||||
|
|
||||||
# [Optional, Default: assets]
|
# [Optional, Default: assets]
|
||||||
# The base directory where assets are stored. This is used to determine the
|
# The base directory where assets are stored. This is used to determine the
|
||||||
# `dirname` value in `output_path_format` below.
|
# `dirname` value in `output_path_format` below.
|
||||||
|
@ -128,7 +133,23 @@ You will need to create a template in order to use the `responsive_image` tag. B
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% endcapture %}
|
{% endcapture %}
|
||||||
|
|
||||||
<img src="/{{ path }}" alt="{{ alt }}" srcset="{{ srcset | strip_newlines }} /{{ original.path }} {{ original.width }}w">
|
<img src="/{{ path }}" alt="{{ alt }}" srcset="{{ srcset | strip_newlines }}">
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Responsive image with `srcset` where the largest resized image is the default
|
||||||
|
|
||||||
|
> **Note:** This is useful if you don't want your originals to appear on your site. For example, if you're uploading full-res images directly from a device.
|
||||||
|
|
||||||
|
```twig
|
||||||
|
{% capture srcset %}
|
||||||
|
{% for i in resized %}
|
||||||
|
/{{ i.path }} {{ i.width }}w,
|
||||||
|
{% endfor %}
|
||||||
|
{% endcapture %}
|
||||||
|
|
||||||
|
{% assign largest = resized | sort: 'width' | last %}
|
||||||
|
|
||||||
|
<img src="/{{ largest.path }}" alt="{{ alt }}" srcset="{{ srcset | strip_newlines }}">
|
||||||
```
|
```
|
||||||
|
|
||||||
#### Responsive images with `<picture>`
|
#### Responsive images with `<picture>`
|
||||||
|
|
|
@ -2,11 +2,12 @@ module Jekyll
|
||||||
module ResponsiveImage
|
module ResponsiveImage
|
||||||
class Config
|
class Config
|
||||||
DEFAULTS = {
|
DEFAULTS = {
|
||||||
'default_quality' => 85,
|
'default_quality' => 85,
|
||||||
'base_path' => 'assets',
|
'base_path' => 'assets',
|
||||||
'output_path_format' => 'assets/resized/%{filename}-%{width}x%{height}.%{extension}',
|
'output_path_format' => 'assets/resized/%{filename}-%{width}x%{height}.%{extension}',
|
||||||
'sizes' => [],
|
'sizes' => [],
|
||||||
'extra_images' => []
|
'extra_images' => [],
|
||||||
|
'respect_exif_rotation' => false
|
||||||
}
|
}
|
||||||
|
|
||||||
def initialize(site)
|
def initialize(site)
|
||||||
|
|
|
@ -4,6 +4,7 @@ module Jekyll
|
||||||
include ResponsiveImage::Utils
|
include ResponsiveImage::Utils
|
||||||
|
|
||||||
def resize_image(img, config)
|
def resize_image(img, config)
|
||||||
|
img.auto_orient! if config['respect_exif_rotation']
|
||||||
resized = []
|
resized = []
|
||||||
|
|
||||||
config['sizes'].each do |size|
|
config['sizes'].each do |size|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
module Jekyll
|
module Jekyll
|
||||||
module ResponsiveImage
|
module ResponsiveImage
|
||||||
VERSION = '1.1.0'.freeze
|
VERSION = '1.1.1'.freeze
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
Loading…
Reference in New Issue