https://github.com/web-tiki/picture-builder
Joomla plugin to generate thumbnails and output a picture element for responsive images
https://github.com/web-tiki/picture-builder
image-processing joomla joomla-plugin php responsive-images
Last synced: 7 months ago
JSON representation
Joomla plugin to generate thumbnails and output a picture element for responsive images
- Host: GitHub
- URL: https://github.com/web-tiki/picture-builder
- Owner: web-tiki
- License: apache-2.0
- Created: 2018-03-15T11:11:13.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2018-03-29T07:15:30.000Z (about 8 years ago)
- Last Synced: 2025-03-23T04:41:25.390Z (about 1 year ago)
- Topics: image-processing, joomla, joomla-plugin, php, responsive-images
- Language: PHP
- Size: 54.7 KB
- Stars: 3
- Watchers: 1
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Picture builder for joomla!
This is a Joomla! plugin to generate thumbnails and output a picture element for responsive images.
The function uses parameteres to set:
- the width of the thumbnails
- the heights of the thumbnails
- the breakpoints
- the thumbnail compression quality.
It relies on the imagick or GD php image libraries.
## Responsive image plugin usage
The plugin can be called in template overrides. You also need to trigger the content plugins if it hasen't already been done.
Here is an example:
```
JPluginHelper::importPlugin('content');
echo plgContentPicturebuilder::picturebuilder($imageUrl, $altText, $params);
```
### Function parameters
`$imageUrl` is the original image all the thumbnails should be generated from.
`$altText` is the alternative text for the image.
`$params` is an array. It looks like this :
```
$params = array(
'thumbWidths' => array( 600, 750, 1200, 1480, 2001),
'thumbHeights' => array( 600, 750, 1200, 1480, 2001),
'breakPoints' => array( 450, 650, 950, 1500),
'quality' => 70
);
```
This array defines the sizes of thumbnails, breakpoints and tumbnail compression. It is either an array of sizes as shown above, either an id or string that refers to parameters set in the plugin options in backend.
At this point, the thumb widths and heights must have 5 values and there must be 4 breakpoints. The plugin generates 10 thumbnails :
- 5 thumbnails with the specified sizes
- 5 thumbnails with these sizes multiplied by 1.5 for HD images (to be displayed on screens with a higher pixel ratio)
The thumbHeights can be `null` if you only need to specify the width of the thumbnails and keep the aspect ratio of the original image.
## Picture element output
The plugin outputs a picture element for **responsive images**.
This is an example HTML output :
```
```
## Requirements and warning
- Joomla! >= 3.2
- Imagick must be installed on your server (A fallback to the GD library has been implemented but see "help need" section to make it better)
- This isn't a plug and play plugin yet. You need to know about template overrides to use it and call the apropriate function to build the responsive picture element.
- The plugin generates thumbnails but it can't delete them
- only tested on `.png` and `.jpeg` images but it should work on many more extensions (imagick supports a lot)
## Issues end help needed to:
- Make a fallback to the GD library (This is done but the compression isn't good, files are huge adn no compression for png files yet)
- Redesign the plugin to let the user specify the number of thumbnails and breakpoints
- Find a solution to update the thumbnails if original image changes but keeps the same size (width and height)
- Delete the thumbnails when the original image changes or is deleted
- Why does the parameters need to be nested in a second level of array when the event is called?
- Joomla 4 will imprement the [event package](https://github.com/joomla-framework/event/tree/2.0-dev). Event call should be changed then.
- Errors when there are a lot of images to generate at the same time
-------------
Created by [web-tiki](https://web-tiki.com)