Search code examples
htmljquerygoogle-chrome-extensiontampermonkey

How to use tampermonkey to remove these specific html elements?


Ok, so for some reason youtube has made some dumb design decisions. The problem is that for some reason they have made it so that the like, dislike, share, etc. buttons cover up the upload date and view count as you can see here:

enter image description here(this is most likely cause the latvian words are longer than the english words but still)

I wanted to fix them for myself. So what I did was I used inspect element to remove the text next to each button:

enter image description here

In my opinion this looks way better. But I have no idea how I could make this permanent. I was thinking of using tampermonkey but I didnt have any luck with that just cause I have no idea how to code for tampermonkey or how to use jquery.

Here I have marked the elements i would like to remove: enter image description here


Solution

  • If you have some ability with CSS, you should be able to tweak the below code to work as you need. Just copy/paste the below code block into a new TM script (steps below).

    // ==UserScript==
    // @name         YouTube button fixer
    // @namespace    http://tampermonkey.net/
    // @match        https://youtube.com/*
    // @grant        none
    // ==/UserScript==
    
    
    (function() {
        'use strict';
    
        document.querySelectorAll('#actions #top-level-buttons-computed .ytd-menu-renderer').forEach((el, i) => {
            el.querySelector('#text').style.display = 'block';
        });
    
    }
    

    Use the instructions in below answer to "install" the above script:

    DuckDuckGo API - How to get more results?