JS — скрыть внешние ссылки на сайте

wp hide external links javascript 620x403 - JS — скрыть внешние ссылки на сайте
CMS WordPress — внешние ссылки на странице зашифрованы и превращены во внутренние

Очень простой скрипт для скрытия внешних ссылок на любом сайте. Разрабатывался для CMS WordPress, но будет работать абсолютно везде. Полностью нативный JS. Состоит из небольшого JavaScript кода, PHP обработчика и трех строк для редиректа в .htaccess.

Пример работы и более подробное описание скрипта: https://code.itikhonov.art/index.php?page=exlinks

Источник с детальным описанием: https://itikhonov.art/wordpress-hide-external-links/

Предусмотрен аттрибут, для исключения шифрования ссылок, а также белый список, доменов. Административной части нет. Все работает на файлах и устанавливается за пару минут. Править ничего не нужно — только дописать немного кода.

JavaScript

    // #######################
    // СКРЫТИЕ ВНЕШНИХ ССЫЛОК
    // #######################

    // получаем все ссылки на странице
    var links = document.querySelectorAll('a[href]');

    // список исключений (слеш в конце обязательно)
    var exclude = [
    'https://exclude.name/',
    ];
        
    // проверяем каждую ссылку в цикле
    for(let i = 0; i < links.length; i++){

        // проверяем, что текущая ссылка не является доменом сайта          
        if(links[i].origin !== window.location.origin){

            // и вешаем на нее открытие в новой вкладке
            links[i].setAttribute('target', '_blank');

            // проверяем ссылку на наличие исключений
            if(!exclude.includes(links[i].href)){           

                // проверяем ее дополнительно на наличие rel="follow"
                if(links[i].getAttribute('rel') != 'follow'){

                    // декодируем в base64 и подставляем префикс /go/
                    links[i].href = '/go/' + btoa(links[i].href);

                    // или без редиректов через .htaccess
                    // links[i].href = '/go.php?go=' + btoa(links[i].href);
            

                }
            }
            
        }
        
    }

Все ссылки передаются методом GET на внешний файл PHP. В скрипте предусмотрено два способа сделать это: просто передав get-ссылку в виде /go.php?go=link_here на нужный адрес или переделав адрес чрез .htaccess в виде /go/link_here. Выбирайте тот вариант, который больше подходит раскомментировав или закомментировав одну строку кода в конце скрипта выше.

PHP-обработчик

В обоих случаях переход по ссылке выполняет GET запрос на файл go.php, который нужно будет скачать (см. источник выше и ниже) и положить в корень сайта.

PHP традиционно получается большим (а это лишь сухой код без визуального оформления). Поэтому ограничимся скриншотом. Полный код можно скачать по ссылке выше и ниже.

php get handler 2 620x443 - JS — скрыть внешние ссылки на сайте

.HTACCESS

Данный файл находится в корне сайта и в нашем случае будет отвечать за переадресацию ради сокращения адреса. В него нужно внести четыре строчки кода. На самый верх. Иначе обработчик WordPress заблокирует наши инструкции.

RewriteEngine On
RewriteRule ^go$ ^go/1$ [L]
RewriteRule ^go/(.+)(/?)$ go.php?go=$1 [L]
RewriteRule ^go(/+) go.php [L]

Скрипт разработан мной, но в рамках другого проекта. Поэтому все ссылки там: https://itikhonov.art/wordpress-hide-external-links/

Похожие записи

WordPress: плавное увеличение изображений на Higslide
Плагин для плавного увеличения изображений для CMS WordPress. Что делает плагин: при клике на изображение оно плавно увеличивается в модальном...
jQuery — таймер обратного отсчета с изменяемой скоростью
Рассмотрим наглядный пример управления таймером на jQuery. Задача: Таймер запускается при загрузке страницы. При клике на кнопку с числом скорость...
jQuery — очищаем поле с результатом после каждого выполненного события
Уже после написаний данной статьи случайно наткнулся на реальный пример описанного здесь простейшего косяка в jQuery коде. Это известный онлайн...
jQuery — простое модальное окно
В данной статье расскажу про очень простое решение с модальным окном на jQuery. Прикручивал его поверх платного конструктора шаблонов сайта...
Telegram — отправка данных в чат с сайта с помощью jQuery и Ajax + защита через Cookies
HTML форма, которую обрабатывает jQuery, записывает данные в Cookies и если все ОК — пересылает данные в Telegram с помощью...

Комментарии

Бесполезно писать спамные сообщения. Все комментарии проверяются;
Можно оставлять ссылки (через <a href), если они несут полезную информацию или дополняют статью;

Добавить комментарий