Download the PHP package netgen/ngresponsiveimages without Composer
On this page you can find all versions of the php package netgen/ngresponsiveimages. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download netgen/ngresponsiveimages
More information about netgen/ngresponsiveimages
Files in netgen/ngresponsiveimages
Package ngresponsiveimages
Short Description eZ Publish 4 extension that eases creation and usage of responsive images by leveraging eZ Publish image aliases
License GPL-2.0
Informations about the package ngresponsiveimages
Netgen Responsive Images
This extension uses picturefill.js
v1.2.0 as a base for loading different image sizes.
Usage 1st case:
This use case requires that we change the template files and setup ngresponsiveimages.ini and image.ini file.
Usage 2nd case:
This case allows you to override image aliases without need to change the template files. Everything you need to do is to setup ngresponsiveimages.ini and image.ini file to your needs.
Options
image_class
- standard image_alias. This image is not responsive unless AlwaysResponsive is set to enabledresponsive_image_class
- Responsive image alias. This image alias uses picturefill html outputresponsive_disabled
- deactivate image responsiveness for current attribute(not for image alias)
ngresponsiveimages.ini
In ngresponsiveimages.ini
, you need to define the responsive breakpoints with media query expressions.
After that you need to create the group in ngresponsiveimages.ini file for each image alias in your eZ Publish installation that you would like to make responsive.
In the following example, imagefull
image alias will be replaced with alias_768_3_2
on the desktop screen and for the mobile screen default_alias
will be used because we didn't specified mapping for mobile screen MediaQueryMappings[mobile]
:
This will output next html for imagefull alias:
Other aliases (eg. large, medium, small) will be intact because we didn't defined INI group for the.
Installation instructions
-
Activate the extension
-
Copy and uncomment image aliases from provided example
image.ini
toimage.ini
in your project extension. You can ofcouse map your own image aliases instead of using the example ones. -
Copy
ngresponsiveimages.ini
INI file tongresponsiveimages.ini.append.php
in your project extension and configure image aliases and responsive breakpoints to suit your needs. - Add
viewport
meta tag to your page head if not already present:
Author
Netgen & Mario Ivančić