How to edit ess grid background's opacity

Support
#1

Hi there,
I’m trying to change the opacity of the background in the skin editor but I’m not sure how; I’d like my image and other elements (title, meta etc) to remain with the full opacity.
I know I can edit the opacity of the cover, but that changes the opacity of everything.

Please advise,

#2

Hi There,

Thanks for writing in! Could you please provide us with the URL to your referenced page, so that we can assist you accordingly.

In the meantime, try referring to their documentation here (https://www.themepunch.com/essgrid-doc/item-skin-editor/).

Thanks!

#3

Hi there,
The website is still not live and we’re using an existing domain so you’d have to install it on your host.

m-neto.co.il

#4

Hi @liorgo81,

In that case, please provide which skin and layer you’re trying to edit and we’ll test it on our installation. We have to know your setup so we could try it in a similar way in our installation.

A screenshot will be helpful too.

Thanks!

#5

There’s only one grid there and the skin used is called - AC Catalogue Item
With regards to the layer - I’d like it to be the bg layer, but I don’t know if one can even edit it; all the additional layers, such as meta and featured image - those I’d like to keep at full opacity.

#6

Hi,

Would you mind providing us the ip address of your site so we can add it in our host file.

I would like to see how your grid looks like so we can provide you with a tailored answer .

Thanks

#7

Sure thing, sent it as a secure note

Thanks!

#8

Hi,

To adjust opacity of your grid background, you can add the code below in Theme Options > CSS

.esg-grid .mainul li.eg-ac-catalogue-item-wrapper {
    background: rgba(255,255,255,0.5);
}

Hope that helps

#9

Actually it’s not working; opacity remains the same.
I tried adding the code in both theme options > css as well as customized > css… nothing on both.

Please advise,

#10

Hi,

Please try adding !important

eg.

.esg-grid .mainul li.eg-ac-catalogue-item-wrapper {
    background: rgba(255,255,255,0.5) !important;
}

Change 0.5 to adjust the opacity.

Thanks

#11

Incredible! Looks amazing, thanks!

1 Like
#12