image effect joomla responsive caption

Image Effect CK adds some nice effects to your images. You can control which effect to show by adding a css class to any image of your website. The caption is automatically created from the title tag of the image.





On any image into your website you can add the effect you want. You can choose to have different effects in the same page.

  • Applies to any image in the page
  • You can add the effect you want to each image
  • Responsive behavior
  • Animated caption that is automatically generated from the title tag of the image
  • No HTML knowledge required, just add the CSS class on the image
  • Possibility to add a link on the image
  • Create your own styles using Image Effect CK Params
  • Integrated with Page Builder CK
  • Compatible with Mediabox CK

Using Image Effect CK you don't have to wrap your image with some HTML tag or add any additional code, just set the CSS class and the title on your image and that's all !


image effects simple usage

Simple to use

No coding required, no need to worry about the code, just add the CSS class on your image. You can use your editor to add the CSS class of the desired effect on any image.

You can use any effect on any image without restriction. You can use it in the articles but also in any content in your website.


How to use it (without the Params)

The only thing you have to do is to add the CSS class on your image. You can use your editor is it has the ability to set a class, or edit the source code to add the class manually to the image tag. The caption is automatically created from the title tag of the image. Example of image source code :

<img src="/images/yourimage.jpg" class="effectck-lily" title="My title::A little description" />

See the demo for the list of available classes and efects.

Note that you can set a title and desciption using the separator "::" into the title tag.


Editor button

Adding an effect to your images has never been so easy ! Use the Image Effect CK button in your editor to open the popup that shows you the list of effects. Click on the effect you want and that's it.

image effects editor button


How to use it (with Image Effect CK Params)

You can download the plugin Image Effect CK Params to help you to manage your effects. This will be an addon to the main Image Effect CK plugin with the following features :

  • Add a button to your editor which opens a new window to manage your effect
  • Get the selected image and apply it the selected effect immediately
  • Allows you to add a title into the effect to your image
  • Allows you to add a descripion into the effect to your image
  • Direct rendering preview into the interface
  • Create your custom list of effects into a fast interface, including a direct preview


Editor button

imageeffectbutton editor

Edition popup

screenshot popup edition

Download Image Effect CK Params



27 effects preinstalled

You can use any of the 27 effects available with Image Effect CK just by adding the CSS class on your image. This will apply instantly without effort. You can also use the interface of the component to create your own effect, or combine your custom styling to any existing effect. Use them to add an amazing effect to your images.

See the effects

multiple image effects available


fusion page builder and image effect

Integrated with Page Builder CK

You can use Page Builder CK and Image Effect CK together to add amazing effects to your images !

Image Effect CK is directly integrated into the images options in the Page Builder interface.

Read More


Custom HTML

You can create your own HTML code to render the image with the effect, you are not limited to an image with a CSS class. If you use the HTML solution, you can adapt the code to your needs and add what you want, like social icons in the caption for example.

Read More

image effects custom html


image effects override

Override the effects

Create your own effects ! You can edit the available effect using an override technique, but you can also create your own list of effects. This way you can have custom css classes to use on your images and you can also limit the effect list to your own values.

Read More


Create amazing image effects for joomla! - Video

image effects video

Video timeline :

00:08 = Basic usage. Add a CSS class on your image to make it works
01:18 = Editor button. Use the integrated editor button to add the effect on any image easily and quickly
02:08 = Image gallery with Mediabox CK. USe Mediabox CK with Image Effect to create your images gallery in few click using the effect that you want on the images
04:17 = Easy integration with Page Builder CK. Create your content with the page builder for Joomla and insert your images without effort
06:45 = Advanced usage with custom HTML. If you are a designer, just create your own HTML code and add what you want in the image
08:52 = Create your own effects. Use the interface to create your own effect with a direct preview, without limit




joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect
joomla responsive image effect


Download Image Effect CK

Download Image Effect CK Params


Release notes (click to show) :

VERSION 2.2.4 - 18/11/18
  • Improve the CSS to be more flexible and work with the gallery addon from Page Builder CK
VERSION 2.2.3 - 24/12/17
  • Fix issue with html layout rendered by the script
VERSION 2.2.2 - 04/12/17
  • Fix issue with CSS loading
VERSION 2.2.1 - 19/11/17
  • Fix issue with CSS loading
VERSION 2.2.0 - 16/10/17
  • [Params] New version with a new styling interface
  • New Possibility to override the css file in the template
  • New feature to create custom styles with a JSON file and style them in the CSS file
  • [Params] New feature to limit the effect list to the custom list
VERSION 2.1.1 - 17/07/17
  • [Params] Add effects fadeck, edafck, and puffck in the list of the editor button and compatiblity with the css classes
VERSION 2.1.0 - 22/05/17
  • Add mobilde touch catching, 1st tap to show the effect, 2nd tap to redirect the link
  • Improve JS and dissociate from the jQuery instance
VERSION 2.0.8 - 25/04/17
  • Fix issue with frontend edition
VERSION 2.0.7 - 18/05/16
  • Add an helper to allow other extensions to get the Image Effect CK list (example of integration with Mediabox CK)
VERSION 2.0.6 - 22/03/16
  • Rename the PHP Class constructor to be compatible PHP7
VERSION 2.0.5 - 04/02/16
  • Fix issue with images dimensions
  • Add support for images border-radius styles
VERSION 2.0.4 - 30/08/15
  • Fix issue with images


Fast and powerful creation, customizable and responsive.

Read More

Favorites extensions

logo maximenuck 110 logo pagebuilderck 110 logo slideshowck 110template creator ck large 449