This script will (hopefully) revert the current gross UI/layout Youtube has implemented (for some reason) back to something that resembles the old layout. Also, if something breaks, good ol' F5 might help. PLEASE NOTE: I'm updating this for my own use on Youtube and am sharing it as is. I will not be taking feature requests. There will be bugs and things will break and I may at any time choose to stop updating it entirely.
// ==UserScript==
// @name Youtube - Revert Layout
// @namespace https://greasyfork.org/en/scripts/488206-youtube-revert-layout
// @version 1.0
// @description This script will (hopefully) revert the current gross UI/layout Youtube has implemented (for some reason) back to something that resembles the old layout. Also, if something breaks, good ol' F5 might help. PLEASE NOTE: I'm updating this for my own use on Youtube and am sharing it as is. I will not be taking feature requests. There will be bugs and things will break and I may at any time choose to stop updating it entirely.
// @author Threeskimo
// @match *.youtube.com/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=youtube.com
// @grant none
// @license MIT
// ==/UserScript==
(function() {
'use strict';
var timer;
function removeElementByXPath(xpath) {
var element = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
if (element) {
element.parentNode.removeChild(element);
}
}
function moveElementById(sourceId, targetId) {
var sourceElement = document.getElementById(sourceId);
var targetElement = document.getElementById(targetId);
if (sourceElement && targetElement) {
targetElement.appendChild(sourceElement);
}
}
function removeAvatarLinks() {
var avatarLinks = document.querySelectorAll('a#avatar-link');
avatarLinks.forEach(function(link) {
link.parentNode.removeChild(link);
});
}
function modifyThumbnailDivs() {
var thumbnailDivs = document.querySelectorAll('div#thumbnail');
thumbnailDivs.forEach(function(div) {
div.removeAttribute("class");
div.setAttribute("style", "width:167px;position:absolute;");
});
}
function modifyDetailsDivs() {
var detailsDivs = document.querySelectorAll('div#details');
detailsDivs.forEach(function(div) {
div.setAttribute("style", "padding-left:173px;margin-top:-10px;");
});
}
function modifyContentDivs() {
var contentDivs = document.querySelectorAll('div#content');
contentDivs.forEach(function(div) {
});
}
function modifyMarginTopByXPath(xpath, marginTopValue) {
var element = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
if (element) {
element.setAttribute("style", "margin-top: " + marginTopValue);
}
}
function removeParagraphsWithNew() {
var paragraphs = document.querySelectorAll('p');
paragraphs.forEach(function(paragraph) {
if (paragraph.textContent.trim() === 'New') {
paragraph.parentNode.removeChild(paragraph);
}
});
}
function clickExpandButton() {
var expandButton = document.evaluate("/html/body/ytd-app/div[1]/ytd-page-manager/ytd-watch-grid/div[5]/div[2]/div/ytd-playlist-panel-renderer/div/div[1]/div/div[1]/yt-icon-button/button", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
if (expandButton && expandButton.getAttribute("aria-label") === "Expand") {
expandButton.click();
}
}
function modifyPageElements() {
if (window.location.href.includes("youtube.com/watch")) {
removeElementByXPath("/html/body/ytd-app/div[1]/ytd-page-manager/ytd-watch-grid/div[5]/div[1]/div/div[2]/div/ytd-watch-next-secondary-results-renderer/div[2]/ytd-rich-grid-renderer/div[1]");
moveElementById("secondary-inner", "bottom-grid");
removeAvatarLinks();
modifyThumbnailDivs();
modifyDetailsDivs();
modifyContentDivs();
removeParagraphsWithNew();
modifyMarginTopByXPath("/html/body/ytd-app/div[1]/ytd-page-manager/ytd-watch-grid/div[5]/div[2]/ytd-watch-next-secondary-results-renderer/div[2]/ytd-rich-grid-renderer/div[5]", "-20px");
var bottomRow = document.getElementById("bottom-row");
if (bottomRow) {
bottomRow.setAttribute("style", "margin-top: -10px; padding-bottom: 5px;");
var descriptionInner = document.getElementById("description-inner");
if (descriptionInner) {
descriptionInner.insertBefore(bottomRow, descriptionInner.firstChild);
}
}
var aboveTheFold = document.getElementById("above-the-fold");
if (aboveTheFold) {
aboveTheFold.setAttribute("style", "padding-top: 10px;");
}
var secondaryInner = document.getElementById("secondary-inner");
if (secondaryInner) {
secondaryInner.removeAttribute("class");
}
var sourceElement = document.evaluate("/html/body/ytd-app/div[1]/ytd-page-manager/ytd-watch-grid/div[5]/div[1]/div/div[2]/div/ytd-watch-next-secondary-results-renderer", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
var targetElement = document.evaluate("/html/body/ytd-app/div[1]/ytd-page-manager/ytd-watch-grid/div[5]/div[2]", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
if (sourceElement && targetElement) {
targetElement.appendChild(sourceElement);
}
var urlParams = new URLSearchParams(window.location.search);
if (urlParams.has('list') && urlParams.get('list') === 'WL') {
removeElementByXPath("/html/body/ytd-app/div[1]/ytd-page-manager/ytd-watch-grid/div[5]/div[2]/ytd-watch-next-secondary-results-renderer/div[2]/ytd-rich-grid-renderer/div[5]");
clickExpandButton();
}
var channelNameTags = document.querySelectorAll('ytd-channel-name#channel-name');
channelNameTags.forEach(function(tag) {
tag.style.zIndex = "1";
});
}
}
function stopTimer() {
clearInterval(timer);
}
timer = setInterval(modifyPageElements, 1000);
setTimeout(function() {
document.addEventListener('click', stopTimer);
}, 5000);
})();