Code to create a button and text overlayed on a slideshow gallery

Here is a link to video of what my squarespace looks like. It is Squarespace 7.0 Template "Impact"

https://app.screencast.com/RYhqrX5s3trZC

Website link is 

https://amkoaerospace.com/

I attached image at the end of this post of what i want to insert (text and button on top of a gallery image) and also what it looks like now. I don't see any option to insert button or text like this.

Id like to also have a different text and button on each gallery image.

I found a forum with code to do this but its not working for me. Code is below and link to that forum.

section#ingredients-gallery .Index-gallery-wrapper .Index-gallery-item p:last-child {
    background: #fff;
    color: #000;
    display: block;
    max-width: 200px;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 10px;
}

Add this to Custom CSS

/* move slideshow text to top */
.Index-gallery-item-content.Index-gallery-item-content--has-title-and-body {
    padding-top: 5px !important;
}