CUSTOMSMUG

How to Rename Search Category Labels on SmugMug

Customize the search page category labels (Photos, Videos, Galleries, Folders, Pages) with your own text using CSS.

SmugMug's search page displays category labels like "Photos", "Videos", "Galleries", "Folders", and "Pages". You can replace these with custom labels that better fit your site's terminology or branding.

How it works

Each search category can be customized independently. The technique:

  1. Hide the original label
  2. Add your custom label using CSS ::after

CSS code

Here's how to rename each search category. Only include the sections you want to change:

/* Rename "Photos" label */
#sm-search-category-photos .sm-link-icon .sm-link-icon-label {
    display: none;
}

#sm-search-category-photos .sm-link-icon:after {
    content: "Images";
}

/* Rename "Videos" label */
#sm-search-category-videos .sm-link-icon .sm-link-icon-label {
    display: none;
}

#sm-search-category-videos .sm-link-icon:after {
    content: "Films";
}

/* Rename "Galleries" label */
#sm-search-category-galleries .sm-link-icon .sm-link-icon-label {
    display: none;
}

#sm-search-category-galleries .sm-link-icon:after {
    content: "Collections";
}

/* Rename "Folders" label */
#sm-search-category-folders .sm-link-icon .sm-link-icon-label {
    display: none;
}

#sm-search-category-folders .sm-link-icon:after {
    content: "Categories";
}

/* Rename "Pages" label */
#sm-search-category-pages .sm-link-icon .sm-link-icon-label {
    display: none;
}

#sm-search-category-pages .sm-link-icon:after {
    content: "Articles";
}

Replace the text inside the quotes with your preferred labels. You don't need to include all five — only add the categories you want to rename.

Where to add the code

You have two options:

  1. Search page only — Add a CSS content block directly to your search page
  2. Entire Site — Add to the Entire Site section if you have search fields on multiple pages

The Entire Site option ensures consistent labels wherever search appears on your site.

Example use cases

Wedding photographer

#sm-search-category-galleries .sm-link-icon:after {
    content: "Wedding Albums";
}

#sm-search-category-folders .sm-link-icon:after {
    content: "Couples";
}

Nature photographer

#sm-search-category-photos .sm-link-icon:after {
    content: "Wildlife";
}

#sm-search-category-galleries .sm-link-icon:after {
    content: "Expeditions";
}

Portrait studio

#sm-search-category-galleries .sm-link-icon:after {
    content: "Sessions";
}

#sm-search-category-pages .sm-link-icon:after {
    content: "Info";
}

On this page