Text Over Image Effect

I’ve struggled with this for 3 days. So I thought to come here to ask for help.

I need to create the exact same thing on this page:

https://www.livermoretreeremoval.com/tree-service-ulmar

Scroll down to the section called ”
Ulmar Tree Services Top Sights” and you will find what I want to achieve:

1.) If you hover your mouse over any of the images, it shows a Title. And if clicked, it takes you to a link.

2.) You will notice that there are 6 Images with a button under them. The button says “Show more”.

If you click the button, additional 6 Images appear, and the Text on the button says “Show Less”.

How do I achieve the Text Over Image Overlay using Gutentor?

2.) And how do I achieve the “Show More” and “Show Less” effect of the button?

Regards.