Відкриття зовнішніх посилань у новій вкладці Shopify: детальне керівництво

Відкриття зовнішніх посилань у новій вкладці браузера – це поширена практика, яка покращує користувацький досвід на сайті. Коли посилання відкривається в новій вкладці, користувач може продовжити перегляд вашого магазину Shopify, не втрачаючи початкову сторінку. У цій статті ми розглянемо кілька способів налаштування відкриття зовнішніх посилань у новій вкладці в Shopify.

Навіщо відкривати зовнішні посилання у новій вкладці?

• Покращення користувацького досвіду: Відвідувачі можуть легко повернутися до вашого магазину, не використовуючи кнопку “Назад” у браузері.
• Зниження показника відмов: Відкриття зовнішніх посилань у новій вкладці може допомогти знизити показник відмов, оскільки користувачі не покидають ваш сайт повністю.
• Збереження трафіку: Якщо користувач переходить за зовнішнім посиланням, ваш магазин залишається відкритим в іншій вкладці, що може призвести до додаткових переглядів сторінок і потенційних покупок.

Способи відкриття зовнішніх посилань у новій вкладці Shopify

Редагування коду теми (для досвідчених користувачів)

Найбільш гнучкий спосіб – додати атрибут target="_blank" до тегів посилань (<a>) у коді вашої теми Shopify.

• Увійдіть до панелі адміністратора Shopify.
• Перейдіть до розділу “Онлайн-магазин” -> “Теми”.
• Знайдіть свою поточну тему та натисніть кнопку “Дії” -> “Редагувати код”.
• Відкрийте файли, де містяться зовнішні посилання (зазвичай це файли шаблонів сторінок, наприклад, page.liquid, article.liquid тощо).
• Знайдіть теги посилань, що ведуть на зовнішні сайти, та додайте до них атрибут target="_blank":

<a href="https://www.example.com" target="_blank">Зовнішнє посилання</a>

• Збережіть зміни.

Використання JavaScript (для всіх користувачів)

Якщо ви не хочете редагувати код теми, ви можете додати наступний JavaScript-код у файл theme.liquid (або аналогічний) перед закриваючим тегом </body>:

<script>
  document.addEventListener('DOMContentLoaded', function() {
    const externalLinks = document.querySelectorAll('a[href^="http"]');
    for (let i = 0; i < externalLinks.length; i++) {
      if (externalLinks[i].hostname !== window.location.hostname) {
        externalLinks[i].setAttribute('target', '_blank');
        externalLinks[i].setAttribute('rel', 'noopener noreferrer'); // Для безпеки
      }
    }
  });
</script>

Цей код автоматично додасть атрибут target="_blank" до всіх зовнішніх посилань на вашому сайті.

Використання сторонніх застосунків

У Shopify App Store є застосунки, що дозволяють легко налаштовувати відкриття посилань у новій вкладці. Деякі з них:

• Link Modifier
• Better Link Manager

Висновок

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