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

Avenue: How to change gallery font?


cakalak

Question

Hi!

I'm trying to change the font for the gallery image captions in the Avenue template. Right now they are set to the body style; I'd like to use the Heading 3 style instead. Can anyone help? Thank you!

Link to post
  • Answers 10
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Thanks for the link. I had assumed you were using the Project blocks in Avenue and wanting to change those titles. For the way you have it set up, using a gallery grid, you'd need to use code like thi

Thank you @christyprice!

@christyprice It worked perfectly in Basil! Thank you!!

Posted Images

10 answers to this question

Recommended Posts

  • 0

Hi @cakalak,

You'd add something like this to Design > Custom CSS. Delete the lines you don't need, and change the font-family, font-size, etc to match your H3.

.project .project-title {
    font-family: "futura-pt" !important;
    font-size: 20px !important;
    line-height: 1.2em !important;
    text-transform: lowercase !important;
    letter-spacing: .02em !important;
     font-weight: 300 !important;
    font-style: normal !important;
    color: #404040 !important;
}

 

Edited by christyprice
Link to post
  • 0

Thank you, @christyprice! I added the CSS but it didn't do anything. This may be a stupid question but do I have to substitute something for ".project" and ".project-title"?

 

(To clarify, I'm referring to the image titles below each image in my gallery. Please see attached screenshot.)

Screen Shot 2019-11-07 at 8.30.36 PM.png

Edited by cakalak
Added more info
Link to post
  • 0

Thanks for the link. I had assumed you were using the Project blocks in Avenue and wanting to change those titles. For the way you have it set up, using a gallery grid, you'd need to use code like this, added to Design > Custom CSS: 

.sqs-gallery-block-grid.sqs-gallery-block-meta-only-title .margin-wrapper .image-slide-title {
    font-family: futura-pt !important;
    font-size: 20px !important;
    line-height: 1.2em !important;
    text-transform: none !important;
    letter-spacing: .02em !important;
     font-weight: 300 !important;
    font-style: normal !important;
    color: #404040 !important;
}

You'll need to change out the values to match your H3. Since I didn't see it used on your site, I can't see what values you are using, so just replace the sizes and colors with whatever you want.

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...