SurferSEO Trigger Share & copy links

Adds a button to trigger the "Share" action on SurferSEO drafts and automatically copies the link text, with a popup notification when copied.

当前为 2024-11-18 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         SurferSEO Trigger Share & copy links
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Adds a button to trigger the "Share" action on SurferSEO drafts and automatically copies the link text, with a popup notification when copied.
// @match        https://app.surferseo.com/drafts/*
// @grant        none
// @author       mhshan
// @license      MIT
// ==/UserScript==

(function () {
    'use strict';

    // Function to create the custom button
    function createCustomButton() {
        const button = document.createElement('button');
        button.textContent = 'Trigger Share & copy link';
        button.style.position = 'fixed';
        button.style.top = '10px';
        button.style.right = '800px';
        button.style.padding = '10px';
        button.style.backgroundColor = '#FA4032';
        button.style.color = 'white';
        button.style.border = 'none';
        button.style.borderRadius = '5px';
        button.style.cursor = 'pointer';
        button.style.zIndex = '1000';

        // Append button to body
        document.body.appendChild(button);

        // Add click event to the button
        button.addEventListener('click', function () {
            // Find and click the "Share" button
            const shareButton = document.querySelector('button[data-tour="share-content-editor"]');
            if (shareButton) {
                shareButton.click();
                console.log("Share button clicked.");
                setTimeout(copyLinkText, 100); // Wait for 1 seconds before attempting to copy the link
            } else {
                alert('Share button not found.');
            }
        });
    }

    // Function to copy the text content of the link element
    function copyLinkText() {
        // Wait for the link element to be present
        const linkElement = document.querySelector("span.block.truncate");

        if (linkElement) {
            // Get the text content of the link element
            let textContent = linkElement.textContent;

            // Create a temporary textarea to copy the text content to the clipboard
            const textArea = document.createElement('textarea');
            textArea.value = textContent;
            document.body.appendChild(textArea);

            // Select the text in the textarea
            textArea.select();
            textArea.setSelectionRange(0, 99999); // For mobile devices

            // Copy the selected text to the clipboard
            document.execCommand('copy');

            // Clean up by removing the temporary textarea
            document.body.removeChild(textArea);

            console.log("Link text copied:", textContent);

            // Show the popup notification
            showCopiedNotification();
        } else {
            console.log("Link element not found.");
        }
    }

    // Function to show a popup notification with animation
    function showCopiedNotification() {
        const notification = document.createElement('div');
        notification.textContent = 'Link copied!';
        notification.style.position = 'fixed';
        notification.style.top = '10px';
        notification.style.right = '400px';
        notification.style.padding = '10px 20px';
        notification.style.backgroundColor = '#99FF74';
        notification.style.color = '#00681C';
        notification.style.borderRadius = '5px';
        notification.style.fontSize = '14px';
        notification.style.zIndex = '1000';
        notification.style.opacity = '0';
        notification.style.transition = 'opacity 0.5s ease-out';
        document.body.appendChild(notification);

        // Trigger the fade-in animation
        setTimeout(() => {
            notification.style.opacity = '1';
        }, 10);

        // After 2 seconds, fade out and remove the notification
        setTimeout(() => {
            notification.style.opacity = '0';
            setTimeout(() => {
                document.body.removeChild(notification);
            }, 500); // After the fade-out animation finishes
        }, 2000);
    }

    // Wait until the page has fully loaded
    window.addEventListener('load', function () {
        // Create the custom button
        createCustomButton();
    });
})();