Как открывать ссылки в новом окне только в зоне .entry-content постов?

Ссылка скопирована
1 ответ

Мне нужен код, чтобы ссылки открывались в новом окне ТОЛЬКО в постах, и только в зоне .entry-content (т. е. тело статей).

Мне подсказали вот такой код для footer.php Вордпресса:

<script> jQuery(document).ready(function($) { $('body').on('click', '.post .entry-content a', function(event) { event.preventDefault(); let href = $(this).attr('href'); window.open(href); }); }); </script>

<script> jQuery(document).ready(function($) { $('body').on('click', '.post .entry-content a', function(event) { event.preventDefault(); let href = $(this).attr('href'); window.open(href); }); }); </script>

Однако у этого кода 3 проблемы.

1. Ссылкам не присваиваются атрибуты target="_blank" rel="noopener".

2. Этот код распространяется не только на .entry-content постов, но и главной страницы, а также рубрик. А мне нужно только в "post" type.

3. Помимо тела статьи, в новом окне начинают открываться рекомендуемые записи от плагина Yarpp, которые в конце каждого поста. Хотелось бы их как-то исключить, если это возможно.

Как допилить вышеуказанный код, чтобы решить эти проблемы?

Дополнительно:

Ответы:

1. Ознакомиться с материалом из документации https://developer.mozilla.org/en-US/docs/Web/API/W...
2. Правильно написать селектор (мы вашего html кода не видим), читаем https://jquery-docs.ru/category/selectors/
3. Отключить плагин? Сделать кастомный темплейт этой страницы, на которой не будет вывода рекомендуемых постов

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Ирина WP Ответ

Открывать ссылки в новом окне только внутри .entry-content можно, но лучше делать это не через перехват клика в footer, а при рендеринге контента или аккуратным JS, который просто добавляет атрибуты. Перехватывать click и вручную менять поведение ссылки хуже для доступности и может ломать ctrl+click, middle click и аналитику.

JS-вариант:

document.addEventListener('DOMContentLoaded', () => {
  document.querySelectorAll('.entry-content a[href]').forEach((link) => {
    const url = new URL(link.href, window.location.origin);
 
    if (url.origin !== window.location.origin) {
      link.target = '_blank';
      link.rel = 'noopener noreferrer';
    }
  });
});

document.addEventListener('DOMContentLoaded', () => { document.querySelectorAll('.entry-content a[href]').forEach((link) => { const url = new URL(link.href, window.location.origin); if (url.origin !== window.location.origin) { link.target = '_blank'; link.rel = 'noopener noreferrer'; } }); });

Так код затрагивает только ссылки в теле статьи и только внешние ссылки. Внутренние ссылки останутся в текущем окне.

Если нужно именно PHP-решение, можно фильтровать the_content через DOMDocument, но для такой задачи JS обычно проще и безопаснее. Регуляркой HTML лучше не править.

Если хотите открывать в новом окне вообще все ссылки внутри .entry-content, уберите проверку origin:

document.querySelectorAll('.entry-content a[href]').forEach((link) => {
  link.target = '_blank';
  link.rel = 'noopener noreferrer';
});

document.querySelectorAll('.entry-content a[href]').forEach((link) => { link.target = '_blank'; link.rel = 'noopener noreferrer'; });

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

Итог: не перехватывайте click. Просто добавляйте target="_blank" и rel="noopener noreferrer" нужным ссылкам внутри .entry-content. Это чище, безопаснее и не трогает меню, футер, карточки и кнопки сайта.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно