Hey @quituck,
Regretfully, this is not something that can be achieved using the Image element. It’s not a feature offered by the Image element. This would need CSS that will position an icon at the center of your image as a background and then change the opacity of your image. That is not something that is within the scope of our support because that is not possible using native options. It is not simple code. I’m sorry but you need to consult with a third party developer for this.
The custom codes we provide are hard to maintain and there’s no guaranteed it would work in the future and they not supported. If you have copied a custom code in the past or have received help, we’re sorry that we have not added that the giving of custom codes is not a part of our support but it only serves as a guide to provide you a head start.
I’ll post this in our issue tracker as feature request though. We need to know if this particular feature would be in demand before our development team could consider developing this feature.
For your sidebar text, that could be achieved by simple CSS. Please add this code in Theme Options > CSS
.x-sidebar a {
color: black;
}
.x-sidebar a:hover {
color: rgb(57,255,20);
}
For your blog post title, the reason why it’s too close to the navbar is because your navbar’s height is set to 0. Please go to Theme Options > Header > Navbar and set Navbar Top Height (px) to 140
Hope that helps and thank you for understanding.