Заметил, что чаще люди все-таки хотят сделать наоборот — из текста ссылку. Но я надеюсь, что это делать вы умеете
. А вот как превратить ссылку в текст знает гораздо меньше людей. Именно об этом я и хотел бы написать.
Зачем это вообще нужно?
В своих статьях я часто ссылаюсь на другие ресурсы. Это полезно, но если бы все это были открытые внешние ссылки, то с точки зрения оптимизации текста это не совсем лучшее решение. Поисковики будут видеть, что это внешние ссылки и вес со статьи будет уходить на другие ресурсы. Можно закрывать все ссылки с помощью атрибута rel = nofollow
. Но даже в таком случае вес все равно будет передаваться.
Как превратить ссылку в текст — простой рабочий скрипт
Если же вы превратите ссылку в текст, то таких ссылок можно вставить в статью хоть 100 и они будут восприняты поисковиком как обычный текст. При этом посетители смогут переходить по ним, то есть вся функциональность полностью сохранится.
В этой статье я поделюсь с вами одним очень простым и рабочим скриптом, который позволит при необходимости любую ссылку превратить в кликабельный текст, при этом обычный пользователь даже не заметит разницы. Единственное, не будет видно адреса, по которому осуществляется переход, но нам от этого даже лучше, ведь так можно прятать партнерские ссылки.
Итак, чтобы скрипт работал, вам нужно подключить к своему сайту библиотеку jquery
, если она еще не подключении. О ее подключении вы можете прочитать в этой статье. Далее я советую вам создать отдельный файл с расширением .js
, в него мы и вставим небольшой код, который позволит создавать наши искусственные ссылки. Я предлагаю назвать его link.js
, просто чтобы было интуитивно понятно, для чего предназначен файл.
Сам код, который нужно вставить в файл, выглядит так:
$(document).ready(function(){
$(‘.hidden-link’).click(function(){window.open($(this).data(‘link’));return false;});
});
Все, вот такой вот короткий скрипт. Чтобы все заработало, необходимо еще подключить файл к html-документу. Для этого перед закрывающим тегом нужно указать в тегах script
путь к файлу. В моем случае он выглядит так:
<script src="js/link.js"></script>
Из расчета на то, что файл со скриптом лежит в папке js
.
Как создать скрытую ссылку?
Проделав все вышеописанные манипуляции остается только вставить в том месте, где должна быть скрытая ссылка, вот такой код:
<span class="hidden-link" data-link="http://адрес-сайта/">анкор</span>
Отлично, вот так вот вы можете быстро внедрить скрытые ссылки на свой сайт. При наведении на них не будет видно url-адреса. Да и вообще нельзя будет отличить такие ссылки от обычного текста, но при этом при клике будет происходить переход по адресу, указанному в атрибуте data-link
. Этот атрибут заменяет собой атрибут href
у настоящей ссылки.
Чтобы наши псевдоссылки ничем не отличались от настоящих, необходимо задать им такие же стили. Для этого в css обратитесь к ним по классу hidden-link
и пропишите нужные стилевые правила. Если же вы не разбираетесь в css, всегда можно научиться. Рекомендую обратить внимание на эту статью.
Что ж, у меня на этом все. Сегодня мы разобрали очень полезную вещь, которую вы можете внедрить на своем сайте, и которая уж точно не будет лишней.
Неплохая инструкция, но…
Насколько мне известно, существует плагин, который как раз реализует все эти функции. Не легче ли им воспользоваться, нежели копаться в кодах, подсоединять библиотеку и т.п.