Customizing academica media carousel

• 

  gotmaester · Member · Aug 27, 2017 at 7:55 pm

  • Copy link
  • Add topic to favorites

  I would like to change the following:

  1. when mouse hovers on the image, I would like the pop up text to be on a black bkg with white text (instead of the black text on white),

  2. I would like to make it possible that when I click on the image instead of going to image carousel it takes user to url page.

  https://game-of-thrones-episodes.com/706-beyond-the-wall/

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

• 

  thesacredpath · Member · Aug 28, 2017 at 4:41 am

  • Copy link

  Hi, since the images you are using are within a Gallery, they will automatically go to the carousel. There is no way to change that behavior on a Gallery with CSS.

  This will change the color of the gallery image captions on hover.

  .tiled-gallery-caption:hover {
    color: #fff;
    background: #000;
  }

• 

  gotmaester · Member · Aug 28, 2017 at 4:56 am

  • Copy link

  I decided to go with simply

  .tiled-gallery-caption:hover {
  text-align: center;
  }

  However, this seems to be only half of the solution. I have kept it on the page, so you can check it out. It only works when the mouse hovers over the caption, but if the mouse hovers over the image the default view appears.

• 

  kathrynwp · Staff · Aug 28, 2017 at 1:45 pm

  • Copy link

  Adding this should do it:

  .tiled-gallery-item {
  	text-align: center;
  }

  2. I would like to make it possible that when I click on the image instead of going to image carousel it takes user to url page.

  If you want an image to link to another page, you’d need to take the images out of the gallery, as Richard mentioned. If you make them three standalone captioned images side-by-side, you could add links.

• 

  gotmaester · Member · Aug 28, 2017 at 1:51 pm

  • Copy link

  Oh, so much better! Thanks to both of you :)