Contents

---
sort: 2
---

# Tag Usage

This section describes how to use JPT's liquid tag ({% raw %} `{% picture (...)
%}` {% endraw %}); what options it takes and what kind of information you can pass
through it to influence the the final HTML and generated images.

## Format

{% raw %}
`{% picture [preset] (image) [crop] [alternate images & crops] [attributes] %}`
{% endraw %}

The only required argument is the base image. Line breaks and extra spaces are
fine, and you can use liquid variables anywhere.

* `preset` - Select a recipe/blueprint from the ones you have defined in
  `presets`. Will use `default` if not specified.

* `(image)` - required.

* `crop` - Aspect ratio & keep settings.

* `alternate images & crops` - Art Direction; show different images on different
  devices. Give in order of ascending specificity.

* `attributes` - Add css classes, data-attributes, or wrap the whole thing in an
  anchor tag.

Version data entries

9 entries across 9 versions & 1 rubygems

Version	Path
jekyll_picture_tag-2.1.2	docs/users/liquid_tag/index.md
jekyll_picture_tag-2.1.1	docs/users/liquid_tag/index.md
jekyll_picture_tag-2.1.0	docs/users/liquid_tag/index.md
jekyll_picture_tag-2.0.4	docs/users/liquid_tag/index.md
jekyll_picture_tag-2.0.3	docs/users/liquid_tag/index.md
jekyll_picture_tag-2.0.2	docs/users/liquid_tag/index.md
jekyll_picture_tag-2.0.1	docs/users/liquid_tag/index.md
jekyll_picture_tag-2.0.0	docs/users/liquid_tag/index.md
jekyll_picture_tag-2.0.0pre1	docs/users/liquid_tag/index.md