Download the PHP package balismatz/laravel-image-style without Composer

Laravel Image Style

A Laravel package to manage your app image styles with an easy and organized way. Each image style is a PHP class that contains the image modifications. A facade, a helper function and an Artisan command are provided to create, retrieve and flush styled images. Also, Artisan commands are provided to easily create image styles, list all the available image styles and cache or clear their information.

To modify images, it uses the most popular open source PHP image processing library, the Intervention Image.

There is an official Intervention Image package for Laravel (Intervention Image Laravel) with a basic functionality. Check it out.

[!IMPORTANT] This is NOT the official Intervention Image Laravel package.

Requirements

• PHP 8.4 or higher
• Laravel 11.0 or higher
• Intervention Image 3.9 or higher

Installation

Require the package using Composer:

Publish the config file by running the following command:

Usage

[!NOTE] An extended documentation and a repository with examples will come in the near future.

Create image styles

You can create an image style by running the following command:

After running the above command, the following prompts will appear:

1. What should the image style be named?

   Set the image style class name. This name will be used to autogenerate - if needed - the unique image style ID (see next).

2. ID

   By default, the package will try to generate the unique image style ID based on the class name, but this prompt gives you the ability to set your own ID, if you want. Leave it empty to autogenerate the image style ID.

   • If the image style ID can not be generated from the given class name, fallbacks to "default".
   • In cases of multiple image styles with same ID, the first detected will be considered as valid.

3. Help text

   The package gives you the ability to list all available image styles. Here you can set a help text (important for teams) to describe the image modifications, why it is created, when to use it or other useful information.

4. Status

   There are cases where you want to have a "Disabled" image style, ie. to use it in the future. You can set it's status by selecting one of the available options. "Default" is considered as active.

[!TIP] You can avoid the prompts by passing the options in the command. Run the following command for more information:

Image style classes are placed in directory.

[!TIP] You can use directory depth levels (from 0 to 3) to organize better your image styles.

List image styles

You can list all available image styles by running the following command:

[!TIP] There are various list options. Run the following command for more information:

Create / Retrieve styled images

Styled images are stored in the directory. In example, the thumbnail (image style ID) of image will be saved at .

The disk that styled images will be stored, depends on configuration or the given parameters of the following methods.

[!IMPORTANT]

• The following methods are available to you by either the facade or the function.

• In blade templates you can use the facade without namespace, as .

• facade is macroable.

1. path()

   Based on the given image style and the original image path, creates, recreates (see parameters) or retrieves the styled image and returns it's storage path.

   Provides a basic functionality and it is useful when you simply want to create a styled image. See the "Performance" section.

2. url()

   Based on the given image style and the original image path, creates, recreates (see parameters) or retrieves the styled image and returns it's storage URL.

   It is useful when you want to display a styled image with the HTML tag.

3. imageInformation()

   Based on the given image style and the original image path, creates, recreates (see parameters) or retrieves the styled image and returns an object that contains the image URL, height, width, mimetype and the given parameters.

   It is useful when you want to display a styled image with the HTML tag and the loading attribute. You can set the height and width to avoid unexpected behaviors (ie. flickering).

4. paths()

   Based on the given image styles (array or string) and the original image path, creates, recreates (see parameters) or retrieves the styled images and returns their storage paths.

   Provides a basic functionality and it is useful when you simply want to create multiple styled images. See the "Performance" section.

5. urls()

   Based on the given image styles (array or string) and the original image path, creates, recreates (see parameters) or retrieves the styled images and returns their storage URLs.

   It is useful when you want to display responsive images - based on styles - with the HTML tag (more information).

6. imagesInformation()

   Based on the given image styles (array or string) and the original image path, creates, recreates (see parameters) or retrieves the styled images and returns a collection of objects that contain the image URL, height, width, mimetype and the given parameters.

   It is useful when you want to display responsive images - based on styles - with the (more information) or (more information) HTML tags.

   You can pass - to each style - parameters that will be returned with objects. These parameters may contain the media query for each styled image.

[!NOTE]

• Image style(s) parameter can be the image style ID or the class name (with namespace). In example, .
• • • get multiple styles as array or string, separate by "," (comma).
• All the above methods get style parameters () that are passed to image style class and methods. In example, you can pass a dynamic watermark, focal point etc.
• All the above methods have the following name suffixes, to convert the styled image(s) in other format:

[!TIP] Click each of the above methods to see the available parameters.

Fallback URL

When style(s) or original image do not exist and based on the configuration, - -

• would return the default storage URL(s) or empty value(s).

Quality

You can change the quality of each image style by overriding the method from class.

Performance

By default, styled images are created when one of the above methods is called. This means that styled images will be created the first time that a user visits the page. You can avoid this behavior by simply calling the or method (for each image) with a queued job or when the model, that references the image(s), is saved.

Flush styled images

You can flush styled images by running the following command:

[!TIP] You can avoid the prompts by passing the options in the command. Run the following command for more information:

Preview

You can preview the image style modifications by calling the method.

[!NOTE] Preview image by Freepik.

Deployment

If you are building an application with many image styles, you should make sure that you are running the Artisan command during your deployment process:

This command caches the image styles information in the configured cache store, improving the performance of the image style information retrieval.

Troubleshooting

1. If image style is not listed on the available styles, check if:

   • Class is in the directory.
   • Class is placed in a supported directory level.
   • Class extends the class.
   • Class is not an class.

   If all of the above is correct, try to clear the cache of image styles information by running the following command:

2. If styled images are not displayed, check the and config.

License

Laravel Image Style is open-sourced software licensed under the MIT license.