In my recently made store (woocommerce) only now I saw that, for the images in the product gallery, I have no possibility to close (just for mobile) after zooming, nor close (x), nor if I click around the picture. In single product page
So I did the code below.
Now the help I have is how to turn this into php to introduce it with snnipet.
With the online resources found to combine, convert or emorgify I am not doing anything right.
Thank you.
.closex {
width: 25px;
height: 25px;
line-height: 25px;
border-radius: 50%;
font-size: 16px;
text-align: center;
background: hsla(0, 3%, 50%, 0.3);
cursor: pointer;
z-index: 999;
}
.closex a {
color: black;
text-decoration: none;
}
.closex :hover {
background-color: hsla(0, 3%, 50%, 0.7);
border-radius: 50%;
color: #ffffff;
}<div class="closex">
<p><a href="#" onclick="JavaScript:jQuery('#html5-close').click();return false;">x</a></p>
</div>