Add LICENSE and README
This commit is contained in:
parent
2d9aa73d18
commit
d8015c91d6
|
@ -0,0 +1,21 @@
|
|||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2014 Joseph Wynn
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
|
@ -0,0 +1,67 @@
|
|||
# Jekyll Responsive Images
|
||||
|
||||
Jekyll Responsive Images is a [Jekyll](http://jekyllrb.com/) tag and utility for automatically resizing images. Its intended use is for sites which want to display responsive images using something like [`srcset`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Img#Specifications) or [Imager.js](https://github.com/BBC-News/Imager.js/).
|
||||
|
||||
[![Build Status](https://travis-ci.org/wildlyinaccurate/jekyll-responsive-images.svg?branch=master)](https://travis-ci.org/wildlyinaccurate/jekyll-responsive-images)
|
||||
[![Coverage Status](https://img.shields.io/coveralls/wildlyinaccurate/jekyll-responsive-images.svg)](https://coveralls.io/r/wildlyinaccurate/jekyll-responsive-images)
|
||||
[![Dependency Status](https://gemnasium.com/wildlyinaccurate/jekyll-responsive-images.svg)](https://gemnasium.com/wildlyinaccurate/jekyll-responsive-images)
|
||||
|
||||
## Installation
|
||||
|
||||
Install the gem yourself
|
||||
|
||||
```
|
||||
$ gem install jekyll-responsive-image
|
||||
```
|
||||
|
||||
Or simply add it to your Jekyll `_config.yml`:
|
||||
|
||||
```yaml
|
||||
gems: [jekyll-responsive-image]
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
An example configuration is below.
|
||||
|
||||
```yaml
|
||||
responsive_image:
|
||||
template: '_includes/responsive-image.html' # Path to the template to render. Required.
|
||||
|
||||
# An array of resize configurations. When this array is empty (or not specified),
|
||||
# no resizing will take place.
|
||||
sizes:
|
||||
- width: 480 # How wide the resized image will be. Required
|
||||
- width: 800
|
||||
quality: 90 # JPEG quality. Optional.
|
||||
- width: 1400
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
Replace your images with the `responsive_image` tag, specifying a path to the image.
|
||||
|
||||
```
|
||||
{% responsive_image path: assets/my-file.jpg %}
|
||||
```
|
||||
|
||||
Any extra attributes will be passed to the template.
|
||||
|
||||
```
|
||||
{% responsive_image path: assets/image.jpg alt: "Lorem ipsum..." title: "Lorem ipsum..." %}
|
||||
```
|
||||
|
||||
Create a template to suit your needs. A basic template example is below.
|
||||
|
||||
```html
|
||||
<img src="/{{ path }}"
|
||||
alt="{{ alt }}"
|
||||
title="{{ title }}
|
||||
|
||||
{% if resized %}
|
||||
srcset="{% for i in resized %}
|
||||
/{{ i.path }} {{ i.width }}w{% if forloop.last == false %},{% endif %}
|
||||
{% endfor %}"
|
||||
{% endif %}
|
||||
>
|
||||
```
|
Loading…
Reference in New Issue