Page 1 of 1

Photo Gallery overlay block

Posted: Sat May 12, 2018 5:59 pm
by fochardo
Knows someone how to change the + sign by a magnifying glass in the custom code?. I tried to insert from fonts that have symbols by copy and paste trough an word processor and nothing happens. only see a square.

Re: Photo Gallery overlay block

Posted: Sat May 12, 2018 6:09 pm
by Pablo
To which specific feature are you referring?

Re: Photo Gallery overlay block

Posted: Sat May 12, 2018 9:17 pm
by fochardo
In the Photo Gallery Overlay block have an custom code:

<style>
#gallery a
{
text-decoration: none;
}
#gallery a:hover::before
{
background: rgba(0,0,0,.7);
border-radius: 50%;
color: #FFFFFF;
content: "🔍";
font-family: Arial;
font-size: 32px;
font-weight: 100;
height: 50px;
left: 50%;
line-height: 50px;
margin-left: -25px;
position: absolute;
text-decoration: none;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
width: 50px;
z-index: 1;
}
#gallery a:hover img
{
opacity: 0.6;
}
</style>

You will see that I replace the content: "+" by a magnifying glass using a word processor, copy and paste. Not all font characters work, what I'm looking for is how to add a simpler magnifier without colors.

Re: Photo Gallery overlay block

Posted: Sat May 12, 2018 9:24 pm
by Pablo
Maybe this will work?
https://www.fileformat.info/info/unicod ... /index.htm

Note that this is not specific to WWB.

Re: Photo Gallery overlay block

Posted: Sun May 13, 2018 7:15 am
by fochardo
I'm going to see .. thanks