Fixes YouTube’s layout to display 4 thumbnails per row, resizing them for a more compact and cleaner browsing experience on the homepage and subscription feed.
As of
// ==UserScript==
// @name YouTube 4 Thumbnails Per Row Fix
// @namespace https://greatest.deepsurf.us/users/1461079
// @version 1.0
// @description Fixes YouTube’s layout to display 4 thumbnails per row, resizing them for a more compact and cleaner browsing experience on the homepage and subscription feed.
// @author Michaelsoft
// @match *://www.youtube.com/*
// @grant none
// @run-at document-start
// @license MIT
// ==/UserScript==
(function() {
'use strict';
function applyFixes() {
const gridRenderer = document.querySelector('ytd-rich-grid-renderer');
if (gridRenderer) {
gridRenderer.style.setProperty('--ytd-rich-grid-items-per-row', '4', 'important');
}
document.querySelectorAll('ytd-rich-grid-row, #contents.ytd-rich-grid-row').forEach(el => {
el.style.setProperty('display', 'contents', 'important');
});
document.querySelectorAll('ytd-rich-item-renderer').forEach(el => {
el.style.setProperty('margin-right', 'calc(var(--ytd-rich-grid-item-margin)/2)', 'important');
el.style.setProperty('margin-left', 'calc(var(--ytd-rich-grid-item-margin)/2)', 'important');
});
// Optional: font size fixes
document.querySelectorAll('#video-title.ytd-rich-grid-media, #video-title.ytd-rich-grid-slim-media').forEach(el => {
el.style.setProperty('font-size', '1.4rem', 'important');
el.style.setProperty('line-height', '2rem', 'important');
});
document.querySelectorAll('#metadata-line.ytd-video-meta-block').forEach(el => {
el.style.setProperty('font-size', '1.2rem', 'important');
el.style.setProperty('line-height', '1.8rem', 'important');
});
}
// Observe for dynamic content (SPA nav, infinite scroll)
const observer = new MutationObserver(() => {
applyFixes();
});
window.addEventListener('load', () => {
applyFixes();
observer.observe(document.body, { childList: true, subtree: true });
});
})();