javascript - How can I add rel = "nofollow" to a link in CKEditor if it's an external link - Stack Ove

admin管理员组

文章数量:1359503

i want to give rel="nofollow" to my external links which its content managed by ckeditor.

example = my site

externallink = any external link

For example:

<p>
    Lorem <a href=".html">ipsum</a> dolar
    <a href=".html" rel="nofollow">sit</a> amet.
</p>

This solution:

editor.dataProcessor.htmlFilter.addRules(
{
    elements :
    {
        a : function( element )
        {
            if ( !element.attributes.rel )
                element.attributes.rel = 'nofollow';
        }
    }
});

from adds nofollow to all a elements.

How can i filter only external links?

Also deep doc about CKEditor Data Processor: .x/Developers_Guide/Data_Processor

---

Note: Stackoverflow's text editor using these question's answer. Check two links' rel attribute in this question.

---

I'm using <script src="//cdn.ckeditor/4.5.10/standard/ckeditor.js"></script> from cdn on my pages.

i want to give rel="nofollow" to my external links which its content managed by ckeditor.

example. = my site

externallink. = any external link

For example:

<p>
    Lorem <a href="https://example./an-article.html">ipsum</a> dolar
    <a href="http://externallink./example.html" rel="nofollow">sit</a> amet.
</p>

This solution:

editor.dataProcessor.htmlFilter.addRules(
{
    elements :
    {
        a : function( element )
        {
            if ( !element.attributes.rel )
                element.attributes.rel = 'nofollow';
        }
    }
});

from https://stackoverflow./a/6930940/1848929 adds nofollow to all a elements.

How can i filter only external links?

Also deep doc about CKEditor Data Processor: http://docs.cksource./CKEditor_3.x/Developers_Guide/Data_Processor

---

Note: Stackoverflow's text editor using these question's answer. Check two links' rel attribute in this question.

---

I'm using <script src="//cdn.ckeditor./4.5.10/standard/ckeditor.js"></script> from cdn on my pages.

• javascript
• jquery
• html
• ckeditor
• nofollow

Share Improve this question Follow edited May 23, 2017 at 12:08 CommunityBot 111 silver badge asked Sep 9, 2016 at 17:14 hakkihakki 6,53777 gold badges6565 silver badges110110 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 4

I solved it like;

CKEDITOR.on('instanceReady', function(ev) {
        var editor = ev.editor;
        editor.dataProcessor.htmlFilter.addRules({
                elements : {
                    a : function( element ) {
                        if ( !element.attributes.rel ){
                           //gets content's a href values
                            var url = element.attributes.href;
                           //extract host names from URLs 
                            var hostname = (new URL(url)).hostname;
                            if ( hostname !== window.location.host && hostname !=="youranothersite.") {
                                element.attributes.rel = 'nofollow';
                            }
                        }
                    }
                }
            });
    })

This solution also works in Internet Explorer:

CKEDITOR.on('instanceReady', function(ev) {
    var editor = ev.editor;
    editor.dataProcessor.htmlFilter.addRules({
        elements : {
            a : function( element ) {
                if ( !element.attributes.rel ){
                    //gets content's a href values
                    var url = element.attributes.href;

                    //extract host names from URLs (IE safe)
                    var parser = document.createElement('a');
                    parser.href = url;

                    var hostname = parser.hostname;
                    if ( hostname !== window.location.host) {
                        element.attributes.rel = 'nofollow';
                        element.attributes.target = '_blank';
                    }
                }
            }
        }
    });
})

So you need to pare hosts, something like this should work.

a : function( element )
    {
        if ( element.host !== window.location.host ) {
            element.attributes.rel = 'nofollow';
        }
    }

Be shure to check hostname for empty value and for relative paths for do not add target='_blank' and rel='nofollow' for links like "tel:+70000000000" or "mailto:[email protected]"

CKEDITOR.on('instanceReady', function (ev) {
    var editor = ev.editor;
    editor.dataProcessor.htmlFilter.addRules({
        elements: {
            a: function (element) {
                var url = element.attributes.href;
                var parser = document.createElement('a');
                parser.href = url;
                var hostname = parser.hostname;
                if (hostname && hostname !== "localhost" && hostname !== window.location.host) { // если внешняя ссылка
                    if (!element.attributes.target)
                        element.attributes.target = '_blank';
                    if (!element.attributes.rel)
                        element.attributes.rel = 'nofollow';
                }
            }
        }
    });
});

本文标签： javascriptHow can I add relquotnofollowquot to a link in CKEditor if it39s an external linkStack Overflow