Tạo nút copy nội dung trên wordpress

Tạo nút copy nội dung trên wordpress

Chúng ta đều biết việc copy nội dung nào đó trên Windows chỉ cần quét chuột và ấn Ctrl + C hoặc ấn chuột phải chọn Copy. Tuy nhiên, nếu bạn muốn người đọc của mình copy chính xác phần nội dung cần thiết để tránh copy nhầm hoặc thừa thiếu chữ thì bạn cần tạo một nút copy chính xác nội dung đó.

Để tạo một nút “Copy” trên WordPress để sao chép nội dung, bạn có thể làm theo các bước sau:

Cách 1: Sử dụng Plugin

  1. Cài đặt Plugin “WP Copy Content” hoặc “Copy Anything to Clipboard”

    • Vào trang quản trị WordPress.
    • Điều hướng tới Plugin > Cài mới.
    • Tìm kiếm plugin với từ khóa “WP Copy Content” hoặc “Copy Anything to Clipboard”.
    • Cài đặt và kích hoạt plugin.
  2. Cấu hình Plugin

    • Sau khi kích hoạt, bạn có thể tìm thấy phần cài đặt của plugin trong trang quản trị WordPress.
    • Ở đây, bạn có thể chọn vị trí nút “Copy” sẽ hiển thị (ví dụ: trên bài viết, bên dưới đoạn văn bản, v.v.).
    • Tùy chọn cài đặt và tùy chỉnh khác sẽ có sẵn để bạn điều chỉnh theo nhu cầu.

Cách 2: Sử dụng Custom HTML và JavaScript

Nếu bạn không muốn cài đặt plugin, bạn có thể thêm trực tiếp HTML và JavaScript vào bài viết hoặc widget để tạo nút “Copy”.

  1. Thêm HTML vào bài viết hoặc trang:

    • Chuyển sang chế độ chỉnh sửa văn bản trong trình soạn thảo WordPress và thêm đoạn mã sau:
    <textarea id="content-to-copy">Nội dung cần sao chép</textarea>
    <button onclick="copyToClipboard()">Copy</button>
  2. Thêm JavaScript:

    • Thêm đoạn mã JavaScript sau vào trang của bạn (có thể thêm trong phần <head> hoặc ngay sau nút “Copy”):
    <script>
    function copyToClipboard() {
        var copyText = document.getElementById("content-to-copy");
        copyText.select();
        document.execCommand("copy");
        alert("Nội dung đã được sao chép: " + copyText.value);
    }
    </script>

Cách 3: Sử dụng Shortcode

Nếu bạn muốn sử dụng shortcode để dễ dàng tái sử dụng trong các bài viết khác nhau, bạn có thể tạo shortcode như sau:

  1. Thêm mã vào file functions.php:

    function custom_copy_button_shortcode($atts, $content = null) {
        $button = '<textarea id="content-to-copy">'.$content.'</textarea>';
        $button .= '<button onclick="copyToClipboard()">Copy</button>';
        $button .= '<script>
        function copyToClipboard() {
            var copyText = document.getElementById("content-to-copy");
            copyText.select();
            document.execCommand("copy");
            alert("Nội dung đã được sao chép: " + copyText.value);
        }
        </script>';
        return $button;
    }
    add_shortcode('copy_button', 'custom_copy_button_shortcode');
    
  2. Sử dụng shortcode trong bài viết hoặc trang:

    • Trong bài viết hoặc trang, bạn có thể sử dụng shortcode này:
    [copy_button]Nội dung cần sao chép[/copy_button]

Bằng cách này, bạn sẽ có một nút “Copy” để bạn đọc sao chép nội dung một cách dễ dàng và chính xác nhất trong WordPress.

Chia sẻ nếu bạn thấy hữu ích

Facebook
X
LinkedIn
Pinterest
Telegram
WhatsApp
Email
Skype