No commit activity in last 3 years
No release in over 3 years
Generate responsive images sizes on assets:precompile and include a handy img_tag helper.
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
 Dependencies

Development

~> 1.7
~> 11.2
~> 3.5

Runtime

>= 5.2.0, ~> 5.2
 Project Readme

Gem Version

Rails responsive images

A Rails image_tag() extension to generate HTML5 <img> tag using srcset. To resize images use the rake task "rake rails_responsive_images".

The following image_tag

= image_tag 'awesome/picture.jpeg', alt: 'awesome', responsive: true

will generate this output:

<img src="/assets/picture.png"
     srcset="/assets/responsive_images_360/picture.png 360w,
             /assets/responsive_images_576/picture.png 576w,
             /assets/responsive_images_768/picture.png 768w,
             /assets/responsive_images_992/picture.png 992w,
             /assets/responsive_images_1200/picture.png 1200w,
             /assets/responsive_images_1600/picture.png 1600w"
>

Installation

Add this line to your application's Gemfile:

gem 'rails_responsive_images'

And then execute:

$ bundle

Or install it yourself as:

$ gem install rails_responsive_images

Usage

Configure the size steps you want to create:

RailsResponsiveImages.configure do |c|
  c.image_sizes  = [767, 991, 1999]
end

Default is:

image_sizes  = [360, 576, 768, 992, 1200, 1600]

Add the responsive flag on image_tag helper

= image_tag 'awesome/picture.jpeg', alt: 'awesome', responsive: true

Capistrano - Integration

before 'deploy:assets:precompile', 'build_responsive_images'
task :build_responsive_images, roles: :app do
  run "cd #{release_path} && RAILS_ENV=#{rails_env} bundle exec rake rails_responsive_images"
end

TODO's & issues

https://github.com/chilian/rails_responsive_images/issues

Contributing

  1. Fork it ( https://github.com/chilian/rails_responsive_images/fork )
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create a new Pull Request

Copyright

Copyright © 2015 Christoph Chilian. See LICENSE.txt for further details.