Ajouter un lien "Lire la suite" au texte copié dans WordPress

Adding a Read more link to copied text is a great way to promote your website and increase traffic. This is especially useful for blog posts and other long-form content.

When someone copies and pastes your text, the link will be included along with it, encouraging them to visit your site to read the full article.

In this article, we'll explore the methods behind this technique and demonstrate how to implement it on your own website.

Recently, you may have noticed a "Read more" link appearing when you copy and paste text from certain websites, such as eHow, TechCrunch, and The Huffington Post.

Methods of adding a Read more link to copied text

Two main methods for adding a "Read more link" to copied text in WordPress

Method 1: Using WordPress Plugins

There are two popular plugins available that can automatically add a "Read more link" to copied text.

Once you have installed and activated one of these plugins, you do not need to do anything else. The plugin will automatically add a "Read more link" to copied text on all of your posts and pages.

This plugin will add the following sentence after copied text."

This plugin has more advance option than the former. This one is optimized both for pasting in rich editor (ex web editor, doc) and plain editor (ex: social media).

After activating it will start working. However, you can change few things. From Dashboard > Settings > Add link you can customize it.

Normally for rich editor it will look like this:

However, if you enable the "Use page/post title as link text" it will look like below in rich editors.

I personally prefer it. But remember, this option is not recommended even applicable if you intend for social media. Because in social media the inline link will not work.

And for plain editors such as social media it will look like this:

Method 2: Using Custom Code

If you are comfortable with coding, you can add a "Read more link" to copied text by manually adding some code to your WordPress theme. This method is more complex than using a plugin, but it gives you more control over the appearance and behavior of the link.

Here you have two option to choose based on your requirement.

✴️ Add Inline Link to the copy text

Add Inline link in title when you paste in any rich editor. [ Read More + Linked title ] - Best for rich text editor like website editor and any document editor. Not Suitable for social media share.

To add a "Read more link" to copied text using custom code, you will need to add the following code to your theme's functions.php file:

Caution: We recommend adding the following code to your child theme's functions.php file. Modifying the parent theme's functions.php file directly may result in lost customizations after theme updates.

If you want to create child theme you can follow this instruction - Comment créer un thème enfant pour WordPress

// Add Links in Copycats texts
function add_copyright_text_script() {
    wp_enqueue_script('clipboard-js', 'https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.8/clipboard.min.js', array(), '2.0.8', vrai);
}

add_action('wp_enqueue_scripts', 'add_copyright_text_script');

function add_copyright_text() {
    if (is_single()) {
        ?>
        <script type="text/javascript">
            function convertHtmlEntitiesToText(html) {
                var doc = new DOMParser().parseFromString(html, 'text/html');
                return doc.body.textContent || "";
            }

            function addLink() {
                if (window.getSelection().containsNode(document.getElementsByClassName('entry-content')[0], vrai)) {
                    const bodyElement = document.getElementsByTagName('body')[0];
                    const selection = window.getSelection();
                    const pageLink = "Read more: <a href='<?php echo esc_url(get_permalink()); ?>'><?php the_title(); ?></a>";
                    let copyText = selection + pageLink;

                    // Check if the platform supports inline links
                    if (!document.queryCommandSupported('copy')) {
                        // If not, use the explicit link with URL encoding
                        const permalink = encodeURIComponent(esc_url(get_permalink()));
                        const explicitLink = "Read more: <?php the_title(); ?> - " + permalink;
                        copyText = selection + convertHtmlEntitiesToText(explicitLink);
                    }

                    // Copy the formatted text to the clipboard using Clipboard.js
                    const clipboard = new ClipboardJS('.entry-content', {
                        text: function () {
                            return copyText;
                        }
                    });

                    clipboard.on('success', function (e) {
                        e.clearSelection();
                        alert('Copied to clipboard: ' + e.text);
                    });

                    clipboard.on('error', function (e) {
                        alert('Error copying to clipboard. Please try again.');
                    });
                }
            }

            document.oncopy = addLink;
        </script>
        < ?php
    }
}

add_action('wp_head', 'add_copyright_text');

This code will add a "Continue reading on [post title]" link to the end of any text that is copied from a single post page.

✴️ Add the explicit link to the copy text

Add URL after read more. [ Read More + URL ] - for all usage including social media share.

When copying content and pasting it into social media platforms, the behavior may vary depending on the platform and its support for formatting. Unfortunately, some social media platforms may not preserve HTML links when pasting. To address this you need to add explicit link.

To add a "Read more link" to copied text using custom code, you will need to add the following code to your theme's functions.php file:

function add_copyright_text() {
    if (is_single()) { ?>
 
<script type='text/javascript'>
function addLink() {
    if (
window.getSelection().containsNode(
document.getElementsByClassName('entry-content')[0], vrai)) {
    var body_element = document.getElementsByTagName('body')[0];
    var selection;
    selection = window.getSelection();
    var oldselection = selection
    var pagelink = "<br /><br /> Read more: <?php the_title(); ?> <a href='<?php echo wp_get_shortlink(get_the_ID()); ?>'><?php echo wp_get_shortlink(get_the_ID()); ?></a>"; //Change this if you like
    var copy_text = selection + pagelink;
    var new_div = document.createElement('div');
    new_div.style.left='-99999px';
    new_div.style.position='absolute';
 
    body_element.appendChild(new_div );
    new_div.innerHTML = copy_text ;
    selection.selectAllChildren(new_div );
    window.setTimeout(function() {
        body_element.removeChild(new_div );
    },0);
}
}
 
 
document.oncopy = addLink;
</script>
 
<?php
}
}
 
add_action( 'wp_head', 'add_copyright_text');

This code will add a "Read more [post url]" link to the end of any text that is copied from a single post page.

Additional Considerations

Reasons to Add "Read more link" to Copied Text

Adding a "Read more link" to copied text offers several advantages, this is actually a clever marketing tactic that can benefit both website owners and content creators.

Conclusion

Adding a "Read more link" to copied text is a simple yet effective way to promote your website and increase traffic. By following the instructions in this tutorial, you can easily add a "Read more link" to your WordPress posts and pages.

Latest Posts