Fixes YouTube’s oversized thumbnails with a customizable grid: More videos per row, full width, and no gaps — for a compact, efficient layout.
As of
// ==UserScript==
// @name YouTube Big Thumbnails Fix
// @namespace https://greatest.deepsurf.us/users/1461079
// @version 1.5
// @description Fixes YouTube’s oversized thumbnails with a customizable grid: More videos per row, full width, and no gaps — for a compact, efficient layout.
// @author Michaelsoft
// @match *://www.youtube.com/*
// @grant GM_addStyle
// @run-at document-start
// @license MIT
// ==/UserScript==
(function() {
'use strict';
// === SETTINGS ===
const settings = {
videosPerRow: 6, // Change this to set videos per row (e.g. 4, 5, 6, etc.). Default value is 6.
shortsPerRow: 12,// Change this to set shorts per row (e.g. 7, 8, 9, etc.). Default value to 12.
disableShorts: false, // Set to true to completely hide the Shorts section. Default value is false.
enableShowMoreFix: true, // Set to false to show only 1 row of Shorts (disables "Show More" force-expand). Default value is true.
};
// === Apply CSS customizations ===
GM_addStyle(`
ytd-rich-grid-renderer {
--ytd-rich-grid-items-per-row: ${settings.videosPerRow} !important;
--ytd-rich-grid-posts-per-row: ${settings.videosPerRow} !important;
--ytd-rich-grid-slim-items-per-row: ${settings.shortsPerRow} !important;
--ytd-rich-grid-game-cards-per-row: 7 !important; /* Number of game cards per row (possibly redundant) */
--ytd-rich-grid-gutter-margin: 0px !important;
}
ytd-two-column-browse-results-renderer.grid-${settings.videosPerRow}-columns {
width: 100% !important;
}
ytd-two-column-browse-results-renderer.grid:not(.grid-disabled) {
max-width: 100% !important;
}
/* Hide Shorts completely if setting is enabled */
${settings.disableShorts ? `
ytd-rich-section-renderer.style-scope.ytd-rich-grid-renderer {
display: none !important;
}
` : ''}
`);
// === "Show More" / hidden content fix ===
if (settings.enableShowMoreFix) {
const observer = new MutationObserver(() => {
document.querySelectorAll('ytd-rich-item-renderer[hidden]').forEach(el => {
el.removeAttribute('hidden');
});
document.querySelectorAll('ytd-rich-shelf-renderer').forEach(el => {
el.setAttribute('is-show-more-hidden', '');
});
});
observer.observe(document.documentElement, {
childList: true,
subtree: true
});
}
})();