Wexley template: Adjusting the size and position of the "Close Lightbox"-X

Hello all,

the close button in Lightbox view is way off in the upper right corner of the page header, often far away from anything else on the page. Visitors could have a hard even seeing it.

I would like the X to be either:

• on the left side of the header (preferred solution)
• bigger
• Read something like "Close lightbox" instead of "X"

Does anyone have a solution for this problem?

for reference:http://martinkappler.com/military/

EDIT: The solution works but then another problem springs up: "Close lightbox" or whatever the button says is still visible in the mobile mode of the website. If someone has a solution to this please let us know.

Try adding this to custom CSS.

#backToThumbs:after {
 content: "Close Lightbox";
 color: #000;
}
.collection-type-gallery.full-view #backToThumbs {
 font-size: 2.0em;
 top: 15px;
 left: 152px;
 color: rgba(0,0,0,0);
}

CSS beginner here, thanks for your help.

So the first line needs to be:

That did not work so far.

No, the script tag is something entirely different than CSS.

Log-in to your site, then click on the eyeball to preview. In the bottom right corner, click on the paintbrush, then in the bottom left corner click on custom CSS. Paste the code I gave you there.

Ah, you very much for your answer. It worked now. Only problem is that the "close lightbox" text is also visible in the mobile version of the website whereas the x disappeares. But no problem, I will get only the x centered over the images. It's much easier to navigate that way.

Ah, you very much for your answer. It worked now. Only problem is that the "close lightbox" text is also visible in the mobile version of the website whereas the x disappeares. But no problem, I will get only the x centered over the images. It's much easier to navigate that way.

Try adding this to the CSS Editor under the Design Menu:

 .collection-type-gallery.full-view #backToThumbs {
  font-size: 5.0em;
}

This should make it pretty big. Feel free to adjust the em value to customize.

Good luck!

Thank you thank you! :)