Как скрывать ссылки от индексации посредством технологии ajax

Как усыпить внимание поисковиков и не только… как скрыть ссылки от железных глаз индексации ПС на 99.7% процентов..? Этим нынче и займёмся!

Конечно же, многие знают способ закрыть ссылки nofollow или noindex, но мы сегодня поступим несколько иначе… а заодно узнаем

как добавить полезную кнопочку в html редактор WP

(ведь по умолчанию в редакторе кнопка ajax не предусмотрена)

Среди прочего нам потребуется: подключенная библиотека jQuery, а у кого её нет -подключим…

Думаю, много излишне толковать о том, что в некоторых случаях просто необходимо скрывать ссылки, да так — чтобы всё шыто-крыто))

Основная задача предприятия исключения ссылок из индексации нужна для того, чтобы управлять полезным весовым ссылочным балансом страниц своего сайта.

Однако эта статья о технической составляющей этого предприятия… а на теоретическую основу темы ссылка будет ниже, — итак:

Вкратце: обычная ссылка закрытая тегом nofollow отображается в редакторе так:

<!-- noindex --><a title="имя" href="http://адрес" rel="nofollow" target="_blank">ИМЯ-ССЫЛКИ</a><!--/ noindex -->

Но — среди веб мастеров существуют убеждения, что сквозь атрибут nofollow всё же утекает полезный вес ресурса! А посему некоторые ссылки полезно закрывать иной атрибутикой тегов, в нашем случае — уделим внимание технологиям ajax:

…тогда ссылку перво-наперво следует упаковать так…

<!-- noindex --><span class="external-reference" data-link="COD-SSILCI">ИМЯ-ССЫЛКИ</span><!--/ noindex -->

Всё как бы здорово… но проблематично каждый раз вручную прописывать необходимые теги… Моё предложение:

Давайте…

пропишем кнопочку скрытия ссылки в html редактор

…чтобы сегодня не повторяться порожний раз о том) как прописывать основной код для кнопок в файле функций…

…перво наперво, тем которые не знают как обогащать редактор WordPress, нужно будет ознакомиться с моей статьёй добавить свои кнопки в текстовый HTML редактор прочитав которую, вы запрасто научитесь добавлять любые полезные кнопочки и, более того, ознакомитесь с возможными ошибками использования некоторых из способов.

Продолжим…

В общем, сегодняшние решение закрытия линков, осуществляется в два счёта: дописывайте в файл функций functions.php строку к уже имеющимся коду (ссылка на пост, в котором мы внедряли основной код выше) и у вас появится замечательная кнопка — щёлк и готово дело! Обратите внимание сколько на фотке полезных кнопок в разделе html !! — если хотите, столько же будет и у вас…

Вот строки:

QTags.addButton( 'AYACS', 'AYACS', '<span class="external-reference" data-link="COD-SSILI"></span>');

или такая…

QTags.addButton( 'AYACS', 'AYACS', '<span class="external-reference" data-link="COD-SSILI">\n', '\n</span>');

…последняя отличается тем, что работает проще: стоит выделить нужный анкор и кликнуть по новенькой кнопке редактора и — всё обёртывается нужными тегами автоматом… вам только останется дописать саму ссылку на место COD-SSILI.

Лепота…))

Однако — продолжим: теперь нам нужно заставить эту атрибуцию ссылок работать в купе с технологией ajax.

Тут тонкость вот в чём: когда проверите работоспособность кнопки, конечно же, разглядите то, что, обернутый тегами анкор ссылки, на выходе (на страничках сайта) будет ни чем не примечателен от обычного текста: и это корошо!

Далее потребуется сделать другой шаг — чтобы ссылка при наведении и клике курсора срабатывала как реальная… и отводила посетителя куда нужно, а ни к чёрту на кулички… нужно подключить техническую обработку аякс-запросов.

как подключить к ссылке отработку AJAX

Делаем так:

Пропишите в футер (файл footer.php) перед закрывающим тегом </body> следующий ниже код.

<script>$('.external-reference').replaceWith (function (){return'<a onclick="return !window.open(this.href)" href="'+$(this).data ('link')+'" title="'+$(this).text ()+'">'+$(this).html ()+'</a>';})</script>

(Обратите взор на пример: в первых круглых скобках между апострофами обозначено имя селектора CSS. Запомните!)

Всё! …отныне скрипт, призванный нами к обработке аякс-запросов — подключен.

Online консультация по настройкам и созданию сайтов на WordPress

далее…

Если ссылки не работают должным образом — вероятно, у вас не включена в работу библиотека jQuery.

как подключить библиотеку jQuery удалённо

Вот примерный скрипт включения библиотеки: поместите эту строку также в футере где-то над скриптом показанным выше… У меня файл JS библиотеки загружен в корень шаблона.  Можете сделать точно так же, но для этого следует скачать саму jQuery.

Как это делается в подробностях читайте эту статейку… Кстати, из её темы узнаете, как сделать плавный скроллинг якоря и кнопки наверх.

Итак — скрипт:

<script src="http://ВАШ_ДОМЕН/wp-content/themes/ВАША_ТЕМА/js/jquery-1.12.4.min.js"></script>

Чтобы скрипт библиотечной макулатуры подгружался с серверов Google пропишите её так:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

придаём визуальный эффект ссылке с отработкой ajax

….чтобы она ничем не отличалась от обычной в глазах пользователя вашего блога.

Нарядим её в соответствующие вашему сайту стили CSS.

Предположим, в стилистическом файле вашей темы селекторы линков-ссылок выглядят так (вам останется их только подстроить под себя):

a {font-weight:bold;color:#146099}
a:hover{font-weight:bold;color:#00355D}

Организовать селекцию CSS можно такими способами: создать отдельные же селекторы для всех ново-организованных ссылок и спокойно пользоваться.

Но — я у себя делаю проще, а именно — добавляю новую атрибутику к селектору a

получается вот так:

a, .external-reference{font-weight:bold;color:#146099}
a:hover, .external-reference:hover{font-weight:bold;color:#00355D}

Но — коли у вас не заработает предложенный мною вариант, смело создавайте отдельный селектор, в котором и зададите стили.

Как-то так…

.external-reference{font-weight:bold;color:#146099}
.external-reference:hover{font-weight:bold;color:#00355D}

Занавес)

…Лепота…

…в следующих статьях также будет много нужного для того, чтобы правильно настроить тех-seo своего сайта, — так что, возможно, будет полезно подписаться:

Online консультация по настройкам и созданию сайтов на WordPress

…а о КИНО я не могу говорить…

Если что-то не ясно, спрашивайте. Помогу… в чём дюжу.
Вместе мы многое сможем! Берегите себя! …и всевозможных удач!