Using custom CSS code, we can replace the Image module's overlay icon with plain text.
Insert the image module into the page layout and make sure that the Open in Lightbox option is enabled
From Design Tab > Overlay, enable the Image Overlay option
Set the Overlay Icon color. This will be the color of the plain text as well. Make sure you choose a good color that will offer a high contrast with the Hover Overlay Color
Set the Hover Overlay Color
In the Advanced Tab, locate CSS ID & Classes, and enter
divi-im-text-overlayas a custom CSS class. This class will be utilized in the CSS code later on.
Finally, proceed to Divi > Theme Options > General Tab > Custom CSS, and input the provided CSS code:
.divi-im-text-overlay .et_pb_image_wrap .et_overlay::before {
content: "View Article";
font-family: inherit !important;
font-size: 24px;
line-height: 1.3em;
text-align: center;
transform: translateX(-50%) translateY(-50%);
margin-left: 0px;
width: 80%;
}
Note: In the above CSS code, you can change the text that is being displayed by editing the content property and changing the View Article text.