TechBlogSD - Все для WordPress и WEB разработки
WEB и WordPress инструкции, новости, обзоры тем и плагинов

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

31

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

По теме: Как вставлять гиперссылки в Weebly?

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

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

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

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

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

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

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

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

Вставить блок абзаца

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

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

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

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

Тип Внешняя ссылка

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

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

Выбрать существующую статью как ссылку

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

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

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

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

Удалить или изменить ссылку

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

Предложение SEO: оптимизируйте свой сайт с помощью специальной 14-дневной бесплатной пробной версии Semrush Pro.

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

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

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

Добавить атрибуты к текстовым ссылкам

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

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

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

Отредактируйте как HTML, чтобы увидеть код

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

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

Исходный код гиперссылок в WordPress

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

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

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

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

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

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

Добавить ссылку на изображение в WordPress

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

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

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

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

Добавить атрибуты ссылки в изображение

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

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

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

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

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

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

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

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

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

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

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

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

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

Ярлык Функция
Command + K Вставить ссылку в Mac
Shift + Command + K Удалить ссылку на Mac
Ctrl + K Вставить ссылку на ПК с Windows
Shift + Control + K Удалить ссылку на ПК с Windows

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

Источник записи: www.webnots.com

Этот веб-сайт использует файлы cookie для улучшения вашего опыта. Мы предполагаем, что вы согласны с этим, но вы можете отказаться, если хотите. Принимаю Подробнее