Change the appearance of the 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:

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*/
}

This is how my thumbnails look like after the change:

This is how the thumbnails look like after the change.

Leave the first comment