Change Gallery Block Background Color?

Is there anyone out there who can tell me how to change the color of a gallery block background? Code would be okay, but I don't have a developer account / access. Basically I would like a black background behind the images in the gallery. Or dark gray.

I'm also looking for a way to achieve this.

You can accomplish this with CSS by changing the color of the .sqs-gallery-block-slideshow. Add the following to your CSS:

.sqs-gallery-block-slideshow {
background-color: rgba(255,255,255,0); 
}

The above will set it to transparent. You can replace "rgba(255,255,255,0)" with anything you'd like to set the color to whatever you'd like.

Thank you!

Also, a good "color picker" site is: http://www.colorpicker.com. You would just change the first three "255" values to red, green and blue respectively. The last value, "0", ranges from 0 to 1 (1 being visible and 0 being transparent). So if you wanted to use red that was half transparent, you would use:

rgba(255, 0, 0, 0.5);

Hi, I have the same problem and I was wondering if you could give me a step by step on how/where to insert that code? I have no experience in using coding in any way but I do want to change the background colour of my images to white or transparent (it's currently light grey). Thank you.

That code goes in the Custom CSS area. Here's the code modified to white rather than transparent (just replaced the last 0 with a 1):

.sqs-gallery-block-slideshow { background-color: rgba(255,255,255,1); }

Hi I tried the code above and did not work for my page gallery block... Is there something else we need to insert in the CCS editor at the beg or end along with the code provided? THANKS!

Anyone know if this can be used to for a background image?

Thank you so much for this code:.sqs-gallery-block-slideshow { background-color: rgba(255,255,255,1); }

This worked perfectly on Flatiron template!

I was having trouble with it working b/c I inserted it into the "advanced" settings tab of the specfic page with the gallery block. Instead, I was able to get it to work by inserting the code under DESIGN > CUSTOM CSS with nothing additional.

Not working for me, for some reason

I'm trying to achieve a white or transparent background for summary and gallery lightbox slideshows... any suggestions... I'm using the Adirondack template

found this in the comments section of another similar question and it's worked for me

.yui3-lightbox2 .sqs-lightbox-overlay { background: #FFFFFF; }

If you use a Grid Gallery Block, you can add this code to the Custom CSS panel

.sqs-block:not(.sqs-block-html):not(.sqs-block-markdown){
 background-color:white;
 padding-bottom:1px;
}

Hope it helps!

hello, I tried this yesterday and it worked. But I later noticed that on 2 other pages, my "spacers" became white as well. Please can you help out with a code that will limit the white color change to only the gallery block background?Many thanks!

Same here! My gallery turned out nice but my spacers, footer logo, and footer social icons all had a white block background. Help!

@jcuvdb : This code above worked for my site! HOWEVER - my spacers, footer logo, and footer social icons all had a white block background. Any idea what is going on here?