YouTube Embed Button Under Video

Adds a button under YouTube videos to open the embed page for the current video.

スクリプトをインストールするには、Tampermonkey, GreasemonkeyViolentmonkey のような拡張機能のインストールが必要です。

You will need to install an extension such as Tampermonkey to install this script.

スクリプトをインストールするには、TampermonkeyViolentmonkey のような拡張機能のインストールが必要です。

スクリプトをインストールするには、TampermonkeyUserscripts のような拡張機能のインストールが必要です。

このスクリプトをインストールするには、Tampermonkeyなどの拡張機能をインストールする必要があります。

このスクリプトをインストールするには、ユーザースクリプト管理ツールの拡張機能をインストールする必要があります。

(ユーザースクリプト管理ツールは設定済みなのでインストール!)

このスタイルをインストールするには、Stylusなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus などの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus tなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

(ユーザースタイル管理ツールは設定済みなのでインストール!)

このスクリプトの質問や評価の投稿はこちら通報はこちらへお寄せください
// ==UserScript==
// @name         YouTube Embed Button Under Video
// @namespace    https://greasyfork.org/en/scripts/537364-youtube-embed-button-under-video
// @homepageURL    https://github.com/almahmudbd
// @version      2.2
// @description  Adds a button under YouTube videos to open the embed page for the current video.
// @license GPL-3
// @author       unknown
// @match        https://www.youtube.com/watch*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    // Helper to get video ID from current URL
    function getVideoId() {
        const urlObj = new URL(window.location.href);
        return urlObj.searchParams.get('v');
    }

    // Create and insert the embed button under the video
    function insertEmbedButton() {
        // Avoid duplicate buttons
        if (document.getElementById('yt-embed-link-btn')) return;

        const videoId = getVideoId();
        if (!videoId) return;

        // Find the container below the video (where buttons like Share/Like appear)
        // This selector is relatively stable, but may need updating if YouTube changes its layout
        const actionsRow = document.querySelector('#top-level-buttons-computed, ytd-menu-renderer #top-level-buttons');

        if (actionsRow) {
            // Create the button
            const btn = document.createElement('button');
            btn.id = 'yt-embed-link-btn';
            btn.textContent = '▶ Open Embed Page';
            btn.style.marginLeft = "8px";
            btn.style.padding = "6px 12px";
            btn.style.background = "#222";
            btn.style.color = "#fff";
            btn.style.border = "none";
            btn.style.borderRadius = "3px";
            btn.style.cursor = "pointer";
            btn.title = "Open this video in YouTube embed view";

            btn.onclick = () => {
                const embedUrl = `https://www.youtube.com/embed/${videoId}`;
                window.open(embedUrl, '_blank');
            };

            // Insert the button at the end of the action row
            actionsRow.appendChild(btn);
        }
    }

    // Observe for SPA navigation and DOM updates
    let lastUrl = location.href;
    const observer = new MutationObserver(() => {
        if (location.href !== lastUrl) {
            lastUrl = location.href;
            // Remove button if navigating away (prevents stale button)
            const oldBtn = document.getElementById('yt-embed-link-btn');
            if (oldBtn) oldBtn.remove();
            setTimeout(insertEmbedButton, 700); // Wait a bit for the new page to render
        }
        // Try to insert the button if not present (handles dynamic loading)
        if (!document.getElementById('yt-embed-link-btn')) {
            setTimeout(insertEmbedButton, 700);
        }
    });

    observer.observe(document.body, { childList: true, subtree: true });

    // Initial insert
    setTimeout(insertEmbedButton, 1000);
})();