Overview

This guide explains how to change Product Images dimensions and different storage options for ActiveStorage which is the default attachment storage system in Spree.

Image dimensions

To change the default image dimensions or add new ones you need to create a decorator file app/models/spree/image_decorator.rb:

module Spree
  module ImageDecorator
    module ClassMethods
      def styles
        {
          mini:    '48x48>',
          small:   '100x100>',
          product: '240x240>',
          large:   '600x600>',
        }
      end
    end

    def self.prepended(base)
      base.inheritance_column = nil
      base.singleton_class.prepend ClassMethods
    end
  end

  Image.prepend(ImageDecorator)
end

You can also create image variations on the fly in your templates, eg.

<%= image_tag(main_app.url_for(@product.images.first.attachment.variant(resize: '150x150'))) %>

Using Amazon S3 as storage system

Please refer to the official Active Storage documentation

You can also use Microsoft Azure Storage or Google Cloud Storage

Was this page helpful?