Text caption

Hi,

To make the text for each image always visible and not just on hover, you can use the following CSS:

.twentytwenty-before-label,
.twentytwenty-after-label {
    opacity: 1;
}

This CSS will ensure that the labels are fully visible at all times.

Unfortunately, the feature to overlay the image with data from another shortcode (like product price) is not available at this time.

You can use the same CSS class for the background, font color, font size, etc.

For the “Before” Image:

.twentytwenty-before-label {
    background-color: #336699;
    color: #fff;
}

For the “After” Image:

.twentytwenty-after-label {
    background-color: #ffcc04;
    color: #000;
}