Что такое якорная ссылка и как ее сделать в WordPress

Здесь поговорим как создать якорную ссылку или попросту «якорь» для перемещения внутри статьи сайта на WordPress.

Что такое якорная ссылка и для чего нужна

Представим себя читателями.

Обратили внимание, какими стали длинными информационные статьи? Порой встречаются до 25 тысяч знаков, рука устает листать.  Очень много избыточной информации. Благо добросовестные вебмастера оформляют оглавление к своим статьям. Кликнул по интересующему пункту в этом самом оглавлении и готово: читай то, что тебе необходимо в данный момент. Прочитал, воспользовался кнопкой «Наверх» в правом нижнем углу монитора или полосой прокрутки и снова выбирай в «Оглавлении» интересное.

А что делать если дочитал статью до конца, а кнопки «Наверх» нет? Приходится долго тянуть полосу прокрутки или еще хуже — крутить колесико мыши. Как в таком случае вернуться наверх быстро?

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

Так вот. Что это такое?

Словарь. Якорная ссылка это — элемент навигации по статье, ведет на определенное место страницы, избавляет от прокрутки всего текста вручную

«Содержание», по сути, это те же «якоря» – только формируются они автоматически при помощи специального плагина или встроенными в тему функциями.

Для чего нужны якорные ссылки?

  1. Для перемещения:
  • по статье от пункта к пункту или
  • к информации, которую автор предлагает повторить;
  • в самый конец статьи
  • или в начало.
  1. Это дополнительная внутренняя перелинковка и элемент юзабилити:
  • для комфорта читателям и
  • удовольствия поисковикам.

Словарь. Юзабилити (от англ. use ability — возможность пользоваться) — удобство использования

А теперь вспомним, что мы вебмастера, работаем с сайтом на Вордпресс, и озадачимся вопросом: как же сделать «якоря». Что для этого требуется?

Как сделать якорную ссылку в WordPress

Рассмотрим на примере классического редактора.

Упс. Штатный классический редактор WordPress нам такую возможность не предоставляет. Т. е. там можно сделать ссылку, но на другую статью, или другой сайт. Это будет уже не «якорь».

Помним, что якорной называют ссылку-навигатор внутри одной статьи.

Поэтому, устанавливаем хороший и бесплатный плагин «Advanced Editor Tools (ранее TinyMCE Advanced)». Он расширяет возможности и классического редактора, и Gutenberg.

Вот скриншот панели управления, которую этот плагин нам предоставляет:Панель инструментов с плагином Advanced Editor Tools

В ней мы видим значок «Флажок» с выскакивающей подписью «Якорь». Он то нам и нужен.

Якорь устанавливается в то место текста, куда мы будем переходить. Если нам требуется перейти с конца текста куда-то выше, то выше мы и будем устанавливать «Якорь».

Выделяем нужную строку в тексте левой кнопкой мыши (ЛКМ), в том числе это может быть заголовок пункта. Жмем на «Флажок». Монитор затемняется, выскакивает окно «Якорь» с полем для ввода его имени. Вводим в эту строку латиницей любой текст, например «ajda» (отображаться он нигде не будет). Жмем «Ок».

Строка ввода имени якоря

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

Переходим к ней и печатаем: «Читайте здесь», «Жмите здесь для перехода». Или любой другой текст, из которого будет понятно: «нажав сюда, вы перейдете к желаемой информации».

Выделяете нужное сочетание слов лкм, в панели управления выбираете инструмент «Ссылка» (на картинке под № 1). Инструменты Ссылка и Удалить ссылкуВыскакивает окно с предложением ввести URL или слово для поиска. Вводим # (хэш) и наше слово «ajda» без пробелов, жмем голубую стрелку «Применить».

Окно ввода имени якоря для перехода к немуВсе. Пробуйте. Якорная ссылка создана и работает, быстро перемещая вас к строке с «якорем».

Внимание. На один и тот же элемент статьи можно ставить несколько якорей с переходом к нему из других частей текста

А вот, кстати, пример. Жмите здесь, чтобы вернуться к определению, что такое якорная ссылка.

Как удалить якорную ссылку

Предположим, что в «якоре» на странице отпала необходимость и вы хотите его удалить.

Что ж, нет ничего проще.

  1. В строке со значком якоря в квадратике, выделите сам символ щелчком левой клавиши мыши. Потом на клавиатуре жмите «Delete». Значок исчез.
  2. Удалите ссылку, ведущую на якорь, просто выделив ее ЛКМ и кликнув по значку удаления в панели инструментов (на рисунке под № 2) или в выскакивающем окошке.
черный якорь в квадрате на белом фоне

В завершение

Ссылки на статье — это важно, но еще важнее между статьями. Их расстановка между материалами сайта является одним из элементов перелинковки. О важности которой вы, наверняка, слышали. Поэтому, чтобы вы не испытывали в этом затруднений, авторы подготовили и предлагают ознакомиться с записью: «Как в WordPress сделать ссылку на другую статью«.

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

Применяйте якорные ссылки. Делитесь с друзьями. До новых встреч.

Оцените статью
( 7 оценок, среднее 5 из 5 )
Записки айтишника для каждого
Добавить комментарий

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

  1. Светлана

    Странно, а я думала, что на другой сайт тоже ведет якорная ссылка

    Ответить
  2. Сергей

    Очень полезная информация! Спасибо.

    Ответить
  3. олег

    Спасибо за информацию очень доступно и понятно!

    Ответить
  4. Татьяна

    Раньше пробовала делать якорные ссылки на сайте, но что-то не сработало. Спасибо за плагин и подробное объяснение. Все работает! Статьи длинные, очень нужный плагин.

    Ответить
  5. Роман Романыч

    Спасибо за Якорь, а то я голову ломал как его правильно поставить.

    Ответить
    1. znatok автор

      Понимаю. Yoast требует. Надо разбираться ?

      Ответить
  6. Танечка

    Нужная статья! Спасибо!

    Ответить
  7. Леонид

    Получилось. Спасибо за инфу!

    Ответить
  8. Сергей

    В теме Ребут якорные ссылки по умолчанию встроены в содержание статьи, что очень удобно для читателя. А, как вставить ссылку на другую статью?

    Ответить
  9. Ирина

    Сайт супер), всё я ваш постоянный читатель ! Всё понятно, даже такому чайнику , как я!))

    Ответить
    1. znatok автор

      Ирина, не надо так о себе говорить. Вы во многом разбираетесь уже.

      Ответить
  10. олег

    Спасибо автору. Информация пригодилась!

    Ответить
  11. Юрий

    Воспользовался подсказками
    Плагин установил.
    Вот только панель не изменилась. Может в настройках, что то надо выделить.
    Будет здорово, если будет такая инструкция: настройка плагина.
    Спасибо!

    Ответить