Responsive wrappers

Responsive wrappers module adds a new filter in your input formats that checks the content and adds the video wrapper for responsive videos with 16/9 or 4/3 ratio aspect, the table wrapper and image class to control responsive breakpoints and content size.

This is useful because users can use the WYSIWYG to add videos, tables or images and magically append the responsive wrappers, without the need to allow users to create divs or know or remember to add the bootstrap responsive wrappers or classes.

This module can also work without Bootstrap with a custom CSS that can be added in module settings or with custom classes.

Installation and configuration

• Enable the module.
• Go to your input formats.
• Add the responsive wrapper filter in your input format.
• Configure the input format.
• If you want a Bootstrap 3 output instead of the Bootstrap 4/5 default output
  or more advanced settings like attach responsive CSS or custom classes go to
  module settings: admin/config/content/responsivewrappers

The input filter scans the content to find embed videos, tables or images to append the responsive classes and wrappers to the output.