Greasy Fork

Help with a script for Youtube

Hi, I have this script for Youtube:

var URL = unescape(location.href);
var TITLE = document.getElementsByTagName("title")[0].innerHTML;

alert('mailto:[email protected]?subject='+TITLE+'&body='+URL);

var btn = document.createElement('button');
btn.textContent = 'Send';
btn.setAttribute('name', 'MAR');
btn.setAttribute('style','opacity: 0.70 !important; font-family: "Century Gothic" !important; position:fixed !important;  -moz-border-radius:5px !important;top:10px !important;  left:10px !important; width:130px !important; padding:4px !important; background: #B30000 !important; color: #FFF !important; font-weight:bold !important; border:1px !important; cursor: pointer !important; z-index:9999999 !important;');
btn.addEventListener("click", function() { window.location.href = 'mailto:[email protected]?subject='+TITLE+'&body='+URL; }, false);
document.body.insertBefore(btn, document.body.firstChild);

But the button is invisible. The alert is OK. Can you please help me for changing that script so my button is showed? I this that the problem is here document.body.insertBefore(btn, document.body.firstChild);

Thanks in advance.

Your script works, the button is inserted well, but the button is placed with a fixed position behind the Youtube logo.

[OPTION A] Try to place it in other fixed position (ex. change top position to 50px):

    var URL = unescape(location.href);
    var TITLE = document.getElementsByTagName("title")[0].innerHTML;
    alert('mailto:[email protected]?subject='+TITLE+'&body='+URL);
    var btn = document.createElement('button');
    btn.textContent = 'Send';
    btn.setAttribute('name', 'MAR');
    btn.setAttribute('style','opacity: 0.70 !important; font-family: "Century Gothic" !important; position:fixed !important;  -moz-border-radius:5px !important;top:50px !important;  left:10px !important; width:130px !important; padding:4px !important; background: #B30000 !important; color: #FFF !important; font-weight:bold !important; border:1px !important; cursor: pointer !important; z-index:9999999 !important;');
    btn.addEventListener("click", function() { window.location.href = 'mailto:[email protected]?subject='+TITLE+'&body='+URL; }, false);
    document.body.insertBefore(btn, document.body.firstChild);

[OPTION B] Try to put your button inside the Youtube framespace, not as first child, and removing the fixed position (ex. near the "Sign In" button):

    var URL = unescape(location.href);
    var TITLE = document.getElementsByTagName("title")[0].innerHTML;
    alert('mailto:[email protected]?subject='+TITLE+'&body='+URL);
    var btn = document.createElement('button');
    btn.textContent = 'Send';
    btn.setAttribute('name', 'MAR');
    btn.setAttribute('style','opacity: 0.70 !important; font-family: "Century Gothic" !important; -moz-border-radius:5px !important;top:10px !important;  left:10px !important; width:130px !important; padding:4px !important; background: #B30000 !important; color: #FFF !important; font-weight:bold !important; border:1px !important; cursor: pointer !important; z-index:9999999 !important;');
    btn.addEventListener("click", function() { window.location.href = 'mailto:[email protected]?subject='+TITLE+'&body='+URL; }, false);
    document.getElementById('yt-masthead-signin').insertBefore(btn, document.getElementById('yt-masthead-signin').firstChild);

@leoncastro
I kinda like your option B who is working well.
Thanks for your help.