Ich nutze bei YouTube sehr gerne die "Später ansehen"-Playlist, um mir selbst ein Programm zusammenzustellen mit Videos, die ich nacheinander ansehen möchte. Ich pflege diese auch sehr fleißig und schmeiße jeden Tag die Videos raus, die ich bereits gesehen habe. Über die Web-Ansicht ist das allerdings recht mühselig, da sich der Entfernen-Button unter jedem einzelnen Video in einem eigenen Dropdown-Menü befindet. Das sind mir deutlich zu viele Interaktionen, deswegen habe ich mir mit JavaScript ein Script geschrieben, das für jedes Video einen direkten Löschen-Button hinzufügt:
Du kannst den Code z.B. durch die Browser-Extension Custom JavaScript for Websites 2 für youtube.com anwenden. Wenn du Arc verwendest, kannst du auch das Boost-Feature verwenden.
/** | |
This script adds a Delete button for each video in your YouTube playlists. | |
So you now longer have to got the action menu to delete videos. | |
To apply this script, you can use a browser extension like [Custom JavaScript for Websites 2](https://chrome.google.com/webstore/detail/custom-javascript-for-web). | |
When you're using Arc, you can also just create a Boost. | |
*/ | |
const style = document.createElement("style"); | |
style.innerHTML = `.lgk-delete-btn { | |
margin-right: .5rem; | |
color: var(--ytd-menu-renderer-button-color,var(--yt-spec-icon-inactive)); | |
} | |
@media (hover: hover) { | |
ytd-playlist-video-renderer:not(:hover) { | |
.lgk-delete-btn { | |
opacity: 0; | |
} | |
} | |
}`; | |
document.head.appendChild(style); | |
function lgkCustomPlaylistItemBtns() { | |
if (location.pathname === "/playlist") { | |
setTimeout(() => { | |
// clear previously added buttons | |
const lgkDeleteBtns = document.querySelectorAll(".lgk-delete-btn"); | |
[...lgkDeleteBtns].forEach((b) => b.remove()); | |
const items = document.querySelectorAll("ytd-playlist-video-renderer"); | |
for (const item of items) { | |
const iconBtn = document.createElement("yt-icon-button"); | |
iconBtn.className = "lgk-delete-btn style-scope"; | |
const btn = document.createElement("button"); | |
btn.setAttribute("aria-label", "Löschen"); | |
btn.className = "style-scope yt-icon-button"; | |
btn.innerHTML = `<svg fill="currentColor" enable-background="new 0 0 24 24" height="24" viewBox="0 0 24 24" width="24" focusable="false" style="pointer-events: none; display: block; width: 100%; height: 100%;"><path d="M11 17H9V8h2v9zm4-9h-2v9h2V8zm4-4v1h-1v16H6V5H5V4h4V3h6v1h4zm-2 1H7v15h10V5z"></path></svg>`; | |
btn.addEventListener("click", () => { | |
item.querySelector("#menu #button").click(); | |
setTimeout(() => { | |
document | |
.querySelector( | |
"ytd-popup-container #items > ytd-menu-service-item-renderer:nth-child(3)" | |
) | |
.click(); | |
}, 200); | |
}); | |
iconBtn.appendChild(btn); | |
item.appendChild(iconBtn); | |
} | |
}, 1000); | |
} | |
} | |
const observeUrlChange = () => { | |
let oldHref = document.location.href; | |
const body = document.querySelector("body"); | |
const observer = new MutationObserver(() => { | |
if (oldHref !== document.location.href) { | |
oldHref = document.location.href; | |
lgkCustomPlaylistItemBtns(); | |
} | |
}); | |
observer.observe(body, { childList: true, subtree: true }); | |
}; | |
window.onload = observeUrlChange; | |
lgkCustomPlaylistItemBtns(); |