Personalizing your platform's terminology can help create a more cohesive brand experience for your users.
🔗 Learn more about Catalog Filters
This guide explains how to change common filter terms like "Category" and "Author" to alternatives that better match your content strategy, such as "Producer," "Coach," "Expert," or "Workout Type", "Genre", "Topic".
📝 NOTE: This workaround requires the Head Code Snippet, available on Uscreen Plus. If you're not yet on Uscreen Plus, please reach out to sales@uscreen.tv.
🔗 Learn more about the Head Code Snippet
Classic Website Editor (Theme-based)
If you're using the Theme-based website editor, follow these steps:
Navigate to Code Snippets
In the Head Code Snippet area, prepare your custom code
To replace terms, add new terms between quotation marks " "
/* To replace both terms */
const newFilterAuthorLabel = "Coach";
const newFilterCategoryLabel = "Workout";
/* To replace only Author term */
const newFilterAuthorLabel = "Coach";
const newFilterCategoryLabel = "";
/* To replace only Category term */
const newFilterAuthorLabel = "";
const newFilterCategoryLabel = "Workout";Copy the full script below, with the terms replaced
Insert the whole script in the Head Code Snippet area
<script>
/*
########################################
# Change the terms of the Filters
########################################
*/
const newFilterAuthorLabel = "Coach";
const newFilterCategoryLabel = "Workout";
/*
########################################
# Not recommended to change the code below
########################################
*/
function replaceAuthor(newFilterAuthorLabel) {
// replace author
const authorFilter = document.querySelector('[for="author_id"]');
if (authorFilter && newFilterAuthorLabel) {
authorFilter.innerText = newFilterAuthorLabel
}
}
function replaceCategory(newFilterCategoryLabel) {
// replace category
const categoryFilter = document.querySelector('[for="category_id"]');
if (categoryFilter && newFilterCategoryLabel) {
categoryFilter.innerText = newFilterCategoryLabel
}
}
document.addEventListener('turbo:load', function (e) {
replaceAuthor(newFilterAuthorLabel)
replaceCategory(newFilterCategoryLabel)
})
</script>Click Save Changes
💡 TIP: The workaround works for any locale (not only English).
Result Example
Category (default) → Workout
Author (default) → Coach
New Website Editor (Themeless)
For the New Website Editor (Themeless), the approach is different as labels appear as form field placeholder texts.
Navigate to Code Snippets
In the Head Code Snippet area, prepare your custom code
To replace terms, add new terms between quotation marks " "
/* To replace both terms */
const newPlaceholderAuthor = "Coach: All";
const newPlaceholderCategory = "Workout: All";
/* To replace only Author term */
const newPlaceholderAuthor = "Coach: All";
const newPlaceholderCategory = "";
/* To replace only Category term */
const newPlaceholderAuthor = "";
const newPlaceholderCategory = "Workout: All";Copy the full script below, with the terms replaced
Insert the whole script in the Head Code Snippet area
<script>
/*
########################################
# Replace the Filter placeholder terms below
########################################
*/
const newPlaceholderAuthor = "Coach: All";
const newPlaceholderCategory = "Workout: All";
/*
########################################
# Not recommended to change the code below
########################################
*/
const updatePlaceholdersInterval = setInterval(() => {
const authorSelect = document.getElementById('author_id');
const categorySelect = document.getElementById('category_id');
let authorUpdated = false;
let categoryUpdated = false;
if (authorSelect && authorSelect.placeholder !== newPlaceholderAuthor) {
authorSelect.placeholder = newPlaceholderAuthor;
}
if (authorSelect && authorSelect.placeholder === newPlaceholderAuthor) {
authorUpdated = true;
}
if (categorySelect && categorySelect.placeholder !== newPlaceholderCategory) {
categorySelect.placeholder = newPlaceholderCategory;
}
if (categorySelect && categorySelect.placeholder === newPlaceholderCategory) {
categoryUpdated = true;
}
if (authorUpdated && categoryUpdated) {
clearInterval(updatePlaceholdersInterval);
}
}, 500);
</script>Click Save Changes
Result Example
Category: All (default) → Workout: All
Author: All (default) → Coach: All
Important Notes & Limitations
Caching Effects: Changes might not reflect immediately due to CDN caching; you may need to clear your browser cache
Compatibility: This custom code solution might be affected by other existing customizations on your page
Native Apps: Custom codes inserted in the Code Snippets do not affect native mobile or TV apps
Support Scope: Our support team cannot assist with implementing or troubleshooting custom coding
Filter Functionality: Currently, custom filters only allow single selection, meaning users can choose just one option at a time
Future Updates: Website structure changes may require script adjustments
⚠️ WARNING: This is a custom code suggestion and might only work in certain cases, as this could be limited by existing customizations applied to your website. Our Support team is unable to assist in implementing or troubleshooting custom coding.
If you need help implementing these customizations, we recommend consulting with a developer familiar with JavaScript and DOM manipulation.