Как добавить гиперссылки в WordPress с атрибутами? »WebNots

WordPress представил блочный редактор Гутенберга версии 5.0. Он позволяет быстро вставлять гиперссылки, аналогично предыдущему классическому интерфейсу редактора. Кроме того, вы можете легко добавить атрибуты ссылки, такие как спонсорство и nofollow, в редакторе Gutenberg. В этой статье мы объясним, как добавить гиперссылки в WordPress с атрибутами.

Связанный: Как вставить гиперссылки в Weebly?

Добавить гиперссылки в WordPress

Вы можете добавлять ссылки к тексту и изображениям в редакторе разными способами.

• Копирование и вставка из Microsoft Word и других редакторов форматированного текста
• Вставить текстовые ссылки
• Добавить ссылки на изображения
• Использование ссылок в кнопках
• Вставка ссылок в таблицу

Копировать и вставлять из текстовых редакторов

Многие из нас готовят контент в редакторах форматированного текста, таких как Microsoft Word или Apple Pages. Это простой способ подготовить контент в автономном режиме и быстро вставить его в редактор. И классический редактор, и редактор Гутенберга сохранят форматирование и сохранят заголовки и гиперссылки, которые вы создали в автономном режиме. Однако есть несколько проблем с тем, что изображения будут удалены в классическом редакторе и заменены заполнителем в Gutenberg. Кроме того, вы не можете добавлять к ссылкам такие атрибуты, как nofollow.

Вставить текстовые ссылки в WordPress

Поскольку классический редактор уходит, мы объясним вставку ссылок с помощью редактора Гутенберга. Вы можете вставить ссылку в любой текстовый элемент, например абзац и заголовок. Когда вы находитесь в редакторе, щелкните значок + и добавьте блок «Абзац».

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

Щелкните значок гиперссылки на панели инструментов блока вверху. Вы увидите всплывающую подсказку с просьбой «Вставить URL или ввести для поиска». Вы можете вставить любую внешнюю ссылку в текстовое поле и нажать клавишу ввода или значок стрелки.

Это добавит гиперссылку к выделенному тексту в вашем абзаце. Если вы хотите вставить ссылку на статью, уже существующую на вашем сайте, введите ключевое слово в текстовое поле.

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

Удаление или изменение гиперссылки

Если вы хотите удалить ссылку, просто щелкните текст гиперссылки. Это выделит значок ссылки по-другому, как разрыв цепи. Щелкните значок, чтобы удалить ссылку из текста.

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

Предложение SEO: Получите специальную 14-дневную бесплатную пробную версию с SEMrush для анализа вашего сайта.

Добавление атрибутов к гиперссылкам

Рекомендуется добавить атрибут «rel =», чтобы указать тип ссылки для целей SEO. Например, в соответствии с рекомендациями Google вам необходимо идентифицировать ссылки как «rel = sponsored», если вы публикуете спонсируемую ссылку. Щелкните небольшой значок стрелки вниз во всплывающем окне ссылки, чтобы просмотреть параметры атрибутов.

• Открыть в новой вкладке — включите этот параметр, чтобы ссылка открывалась в новом окне. Это добавит атрибут target = _blank к тегу ссылки.
• Nofollow — используйте это, чтобы сделать ссылку nofollow, чтобы поисковые системы игнорировали ссылку. Это добавит атрибут «rel =» nofollow »к тегу ссылки.
• Спонсируемые — используйте это, когда вы вставляете платные ссылки от своих спонсоров. Это добавит атрибут rel = sponsored к тегу ссылки.

Вы можете нажать на кнопку настроек с тремя точками и выбрать «Редактировать как HTML», чтобы увидеть внутренний код.

Код будет выглядеть примерно так, как показано ниже. Как видите, WordPress автоматически добавит еще два атрибута.

• Aria-label = ”(открыть в новой вкладке)” — это для программы чтения с экрана, чтобы указать, что ссылка будет открыта в новой вкладке. WordPress добавит это в целях доступности, когда вы выберете опцию «Открыть в новой вкладке».
• Rel = ”noreferrer noopener” — WordPress добавит эти атрибуты автоматически, когда вы выберете открытие в новом окне. В целях безопасности отключите отслеживание ссылок, когда вы открываете ссылку в новом окне или вкладке браузера.

Вы можете вернуться в визуальный режим, снова щелкнув настройки трех точек и выбрав «Редактировать визуально».

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

Добавление гиперссылок в изображения

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

У вас есть все варианты, аналогичные вставке текстовой ссылки.

• Вставьте внешнюю ссылку в поле и нажмите Enter.
• Введите ключевое слово для поиска и вставьте существующую внутреннюю ссылку на свой сайт.
• Выберите опцию «Медиа-файл», чтобы вставить ссылку на файл изображения.
• Выберите опцию «Страница прикрепления», чтобы вставить ссылку на страницу прикрепления изображения к изображению.

После добавления гиперссылки к изображению еще раз щелкните значок ссылки, а затем небольшую стрелку вниз. Теперь вы можете увидеть дополнительные атрибуты для настройки открытия ссылки в новой вкладке и добавления атрибутов rel. Вы можете ввести nofollow спонсируется в поле «Ссылка на ссылку», чтобы сделать ссылку nofollow и спонсируемой.

Добавить ссылки в кнопку

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

Блок кнопок имеет атрибуты на боковой панели. Нажмите кнопку и просмотрите раздел «Блокировать» на правой боковой панели. Здесь вы можете настроить атрибуты для открытия в новом окне или добавить атрибуты rel. Как видите, опция «Открыть в новой вкладке» доступна как под блоком, так и на боковой панели.

Изучите WordPress: Просмотрите более 300 бесплатных руководств по WordPress.

Вставить ссылки в таблицу Гутенберга

Подобно элементам текста и изображений, вы также можете вставлять ссылки на контент внутри блока таблицы Гутенберга.

• Текстовая ссылка — выделите текст и вставьте ссылку, как описано выше.
• Ссылка на изображение — щелкните маленькую стрелку на панели инструментов и выберите «Встроенное изображение». Это откроет «Медиа-библиотеку» для выбора и вставки изображения в ячейку таблицы. Щелкните изображение, а затем значок ссылки, чтобы добавить гиперссылку.

Сочетания клавиш для вставки ссылки

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

Примечание. Ваша тема может влиять на настройки ссылок в редакторе Гутенберга. Например, вы увидите кнопку «Изменить» вместо значка карандаша и не сможете добавить атрибуты nofollow / sponsored. Лучше всего выбрать тему WordPress по умолчанию и связаться с разработчиком темы, если вы пропустили какие-либо параметры. В любом случае вы можете добавить атрибуты ссылки в исходный HTML, переключив представление «Редактировать как HTML» или перейдя в «Редактор кода».