README

Extends silverstripe-responsive-images to allow responsive images in WYSIWYG editor. When the user selects an image to insert, they are given the option of responsive sizing or standard sizing. If they choose responsive, they can select a Responsive Set to use, these sets are defined in your yml configuration. If they choose standard resizing, they get the normal Width x Height fields.

##Requirements

SilverStripe 3
SilverStripe Responsive Images module

##Installation

$ composer require sheadawson/silverstripe-responsive-wysiwyg-images dev-master

##Usage

Define your responsive image sets in yml config as you normally would. Sets that you would like to be available in the WYSIWYG image insert form should specify an additional "wysiwyg" property and "description" property to opt-in.

Example:

ResponsiveImageExtension:
  sets:
    ResponsiveSet1:
      wysiwyg: true
      description: "ResponsiveSet1, used for X and Y"
      sizes:
        - {query: "(min-width: 200px)", size: 100}
        - {query: "(min-width: 800px)", size: 400}
        - {query: "(min-width: 1200px)", size: 800}

##Additional Configuration

You can set the image insert form to default to "Standard" image resizing (user sets the width and height) or "Responsive". Default is "Responsive".

ResponsiveImageHtmlEditorField_Toolbar:
  default_resize_method: 'Standard'
`

sheadawson / silverstripe-responsive-wysiwyg-images

Maintainers

Details

README