Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Changing font of Gallery Block caption


Go to solution Solved by tuanphan,

Question

Hi guys!

I am using the BRINE template, and need some help with the tweaks on the Gallery Block slideshow. I'd like to change the font sizes on the title and description that shows up on a hover on the captions. I tried injecting custom css into the page itself but it is not working. I used the code:

.sqs-gallery-block-slideshow.sqs-gallery-block-meta-only-title { font-size: 10px !important; }

.sqs-gallery-block-slideshow.sqs-gallery-block-meta-only-description{ font-size: 5px !important; }

I'd like the font change for the slideshow to only be applicable on the homepage. I want it to be much smaller than the "body" font used.
Wondering if anyone has a better solution.


Is it possible to restrict the size of the caption overlay as well?

Many thanks in advance!
Neptina

Community forum question 08062020.png

Link to post
  • Answers 11
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Posted Images

11 answers to this question

Recommended Posts

  • 0

Add to Home > Design > Custom CSS

.slide:hover .meta * {
    color: red !important;
    font-family: monospace !important;
    font-size: 20px !important;
}

 

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
  • 0

So, I managed to find a tweak that works! Inserted this into the homepage's individual CSS.
Found this code here:

<style>
 .sqs-gallery-block-slideshow .meta .meta-title {
font-size: 10px;

}

 .sqs-gallery-block-slideshow .meta .meta-description p {
font-size: 8px;

}
}</style>

 

That being said, still trying to figure out how to change the size of the caption box (that hovers to appear) on the slideshow!

 

Link to post
  • 0

try

.slide:hover .meta {
	padding: 10px 20px 30px 40px !important;
}

(padding: top right bottom left)

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
  • 0

The code works perfect! I am able to change the size of the caption box bigger.
However I can't change a side to be smaller. I tried using -20px to make the left side shorter but it doesn't seem to work.

.slide:hover .meta {
    padding: 10px 10px 10px -20px !important;
}

Is it possible to move the caption box to the left most bottom corner as well?

Community forum question 09062020.png

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...