Picture Slideshow Background Color

• 

  urbanela · Member · Sep 22, 2016 at 7:41 pm

  • Copy link
  • Add topic to favorites

  I am creating 200 pages for furniture products that will all be equipped with a picture slideshow on each page of the products photos. Is it possible to insert one CSS code that can auto default to ALL slideshows for the background color? I want the background color to be white instead of black but I don’t want to have to input 200 CSS codes for every single page. Is there a way to default to ALL slideshows?

  Thank you so much!

  Mel

  The blog I need help with is: (visible only to logged in users)

• 

  hallluke · Member · Sep 25, 2016 at 12:27 pm

  • Copy link

  Yes it’s possible, here’s some code you can test out based on your theme’s demo site carousel pages:

  .jp-carousel-overlay {
    background-color: #fff;
  }
  .jp-carousel-titleanddesc {
    border-color: #ccc;
  }
  .jp-carousel-titleanddesc-title {
    color: #111;
  }
  .jp-carousel-buttons {
    border-color: #ddd;
    background: #ddd;
  }
  .jp-carousel-image-meta {
    background: #eee;
      border-color: #ddd;
  }
  a.jp-carousel-image-download {
    color: #111;
  }
  .jp-carousel-close-hint span {
    background-color: #ddd;
  }

  I’ve basically switched all the blacks and dark greys for the opposite whites and light greys but you can play around with the colours yourself. The images (download icon and left/right arrows) are a bit trickier. You could always download the image files, edit them and then reupload them but it might be easier to work with the existing ones.

• 

  urbanela · Member · Oct 14, 2016 at 8:07 pm

  • Copy link

  Not working, what else could I try?

• 

  hallluke · Member · Oct 14, 2016 at 10:07 pm

  • Copy link

  It works on the carousel image pages of the Obsidian demo site.

  If you have a page on your site where you’ve tried it could you post the URL so I can take a closer look.

• 

  urbanela · Member · Oct 17, 2016 at 5:44 pm

  • Copy link

  Take a look at this page, I want the background of the slideshow to be white, not black. But I don’t want to have to configure a CSS code for every page, I want to default it white for all slideshows inserted.

  https://urbaneladesign.com/products_17_degree_light_pole

  The page is not published yet, just a draft.

• 

  hallluke · Member · Oct 18, 2016 at 7:19 am

  • Copy link

  That page doesn’t exist, and that’s what the original code does on the demo site. Try posting the URL to another page with the slideshow on and I’ll keep trying.