18.10.2025
14

Кнопка назад в Elementor

# назад

Добавим кнопку назад на сайт. Зайдите в Elementor — Пользовательский код и вставьте код </body> — end, также отображать на всём сайте.

<script>
(function () {
  if (window.__BACK_BTN_INIT__) return;
  window.__BACK_BTN_INIT__ = true;
  var SEL = '.js-back-button, #btn-back';
  function fromSameOrigin() {
    var ref = document.referrer || '';
    if (!ref) return false;
    try { return new URL(ref, location.origin).origin === location.origin; }
    catch(e){ return false; }
  }
  function hasInternalHistory() {
    return fromSameOrigin() || sessionStorage.getItem('site:internal-nav') === '1';
  }
  function markInternalNav() {
    sessionStorage.setItem('site:internal-nav', '1');
  }
  function initBackButtons() {
    var btns = document.querySelectorAll(SEL);
    if (!btns.length) return;
    var canShow = hasInternalHistory();
    btns.forEach(function (btn) {
      if (!canShow) {
        btn.setAttribute('hidden', 'hidden');
        btn.classList.add('is-back-hidden'); 
        return;
      }
      btn.removeAttribute('hidden');
      btn.classList.remove('is-back-hidden');

      btn.addEventListener('click', function (e) {
        e.preventDefault();
        history.back();
      });
    });
  }
  document.addEventListener('click', function (e) {
    var a = e.target.closest('a[href]');
    if (!a) return;
    try {
      var u = new URL(a.getAttribute('href'), location.href);
      if (u.origin === location.origin) markInternalNav();
    } catch(e){}
  });
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', initBackButtons);
  } else {
    initBackButtons();
  }
})();
</script>
<style>
.is-back-hidden {display:none!important;}
</style>

<script>
(function () {
  if (window.__BACK_BTN_INIT__) return;
  window.__BACK_BTN_INIT__ = true;
  var SEL = '.js-back-button, #btn-back';
  function fromSameOrigin() {
    var ref = document.referrer || '';
    if (!ref) return false;
    try { return new URL(ref, location.origin).origin === location.origin; }
    catch(e){ return false; }
  }
  function hasInternalHistory() {
    return fromSameOrigin() || sessionStorage.getItem('site:internal-nav') === '1';
  }
  function markInternalNav() {
    sessionStorage.setItem('site:internal-nav', '1');
  }
  function initBackButtons() {
    var btns = document.querySelectorAll(SEL);
    if (!btns.length) return;
    var canShow = hasInternalHistory();
    btns.forEach(function (btn) {
      if (!canShow) {
        btn.setAttribute('hidden', 'hidden');
        btn.classList.add('is-back-hidden'); 
        return;
      }
      btn.removeAttribute('hidden');
      btn.classList.remove('is-back-hidden');

      btn.addEventListener('click', function (e) {
        e.preventDefault();
        history.back();
      });
    });
  }
  document.addEventListener('click', function (e) {
    var a = e.target.closest('a[href]');
    if (!a) return;
    try {
      var u = new URL(a.getAttribute('href'), location.href);
      if (u.origin === location.origin) markInternalNav();
    } catch(e){}
  });
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', initBackButtons);
  } else {
    initBackButtons();
  }
})();
</script>
<style>
.is-back-hidden {display:none!important;}
</style>

Далее добавим кнопку назад на старницу, удобнее всего разместить кнопку в хедере. Вставьте любую икноку и назначьте CSS ID btn-back

Либо, если у вас не Elementor, а другой конструктор, то разместите этот код в дочерней теме. Создайте файл wp-content/themes/ВАША-ДОЧЕРНЯЯ-ТЕМА/assets/js/back-button.js и вставьте туда этот код.

Подключить js код в дочерней теме:

<?php
// Подключение скрипта «Назад» в футере фронтенда
add_action('wp_enqueue_scripts', function () {
    if (is_admin()) return; // не грузим в админке

    $handle = 'site-back-button';
    $path   = get_stylesheet_directory() . '/assets/js/back-button.js';
    $uri    = get_stylesheet_directory_uri() . '/assets/js/back-button.js';
    $ver    = file_exists($path) ? filemtime($path) : '1.0.0';

    wp_enqueue_script($handle, $uri, [], $ver, true); // true — загрузить перед </body>
});

<?php
// Подключение скрипта «Назад» в футере фронтенда
add_action('wp_enqueue_scripts', function () {
    if (is_admin()) return; // не грузим в админке

    $handle = 'site-back-button';
    $path   = get_stylesheet_directory() . '/assets/js/back-button.js';
    $uri    = get_stylesheet_directory_uri() . '/assets/js/back-button.js';
    $ver    = file_exists($path) ? filemtime($path) : '1.0.0';

    wp_enqueue_script($handle, $uri, [], $ver, true); // true — загрузить перед </body>
});