Skip to main content

Are you still looking for something?

Generic filters
Exact matches only
Filter by Categories
Customization
Domains
Lightroom Plugin
Tools and Tips

Try these: contact formbuttonbuy photos

Change the appearance of titles and captions of your photo thumbnails

In this article I am going to show you, how you can change the appearance of the titles, captions that appear under or over your thumbnails, inside your galleries.

This is how my thumbnails look before the change:

SmugMug Titles and Captions before the change

My plan is to make my titles UPPERCASE, YELLOW and change the font slightly so the titles stand out a bit more.

For my captions – I want to make them RED and increase the size of them slightly as well.

Adding CSS code

First you will need to add a CSS content block to your gallery and then add this code to it:

CSS
/*Changing the appearance of photo thumbnail TITLES*/
.sm-user-ui .sm-tile-title a {
    font-size: 18px; /*This value changes the font size*/
    color: #ffd400;  /*This value changes the font color*/
}

/*Changing the appearance of photo thumbnail CAPTIONS*/
.sm-user-ui .sm-tile-caption {
    font-size: 16px; /*This value changes the font size*/
    color: #ff0000;  /*This value changes the font color*/
}
CSS

This is how my thumbnails look like after the change:

This is how the thumbnails look like after the change.

Related articles

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Support me

I am writing this portal in my free time and I pay for it myself. So, if you want to support my work – use this button to buy me a coffee 🙂 Which will help towards the hosting costs of the portal.