Phlox Image

Phlox Image gives you the possibility to upload an image or a number of images in any widget area you want.

There is no limit to the number of image widgets you add and you can also upload a second image to each image widget that shows up after the user hover over the image.

Follow below steps to add Phlox Image to a widget area or in a page content  in widget area::

1. Go to your WordPress admin panel
2. Click Appearance on the Dashboard
3. Then click Widgets
4. Find [Phlox] Image among the available widgets and add it to your desired Widget Area

Video Tutorial

Access Advanced Image Options in Elementor Page Builder

1. Go to your WordPress Admin Panel
2. Click the Pages on the Dashboard
3. Click the Add New
4. Navigate to the top left hand of the WordPress text-box and find Edit with Elementor button
5. Check out Elements
6. Scroll down to PHLOX PRO – GENERAL section
7. Choose Advanced Image

Content

Image

You can add your image to this section. The available  Image Sizes are: Thumbnail - 150 x 150, Medium 300 x 300, Medium Large 768 x 768, Large 1024 x 1024, Post-thumbnail 280 x 180, Full, and Custom

Image link is settable. You are able to click the gear icon to see the options: Open in new window or Add nofollow.

Hover Image

Besides the image, it is possible to add a second image that will be appear when the mouse is hovering over the image.

Ribbon

Another option is adding a  Ribbon to your image. The text of this badge is changeable. Also, there are three available styles: Simple, Corner, and Cross

You can change the ribbon position and align it to  Top Right, Top Left, Bottom Right, and Bottom Left

Ribbon Thickness can be changed in PX or EM. Maximum possible value is 50px (3EM)

• Settings

To open image in lightbox, enable  Open in lightbox. It can be specified by a Plus iconic button.

Image  Alignment in block can be Left, Center, or Right

Dark and Light are the two available player skins.

Enable  Preload Image, so it add a loading animation while loading the image. The available effects are: Blurred placeholder image, In-progress box animation, and Loading spinner in Blue, Light, or Dark

If you leave it blank, an option will be available to set a color for the placeholder while loading image.

Tilt Effect

Colorized Shadow adds a shadow of the image below it.