Кнопка "Назад" на OpenCart 3.

Открыть файл catalog/view/theme/Ваш_Шаблон/template/common/footer.twig

Найти в файле </body>

Добавить до этого

Код:

 <script type="text/javascript">
                    $(document).ready(function() {
                        // Проверка, не на главной ли странице для r_n
                        if (window.location.pathname !== '/' && window.history.length > 1) {
                            $('<a>', {
                                href: '#',
                                class: 'breadcrumb-back-history',
                                html: '<div class="arrow-back-m"><span>&#171;</span></div>',
                                click: function(e) {
                                    e.preventDefault();
                                    history.back();
                                }
                            }).appendTo('body');
                        }
                    });
               </script>
        
               <style>
               .breadcrumb-back-history {
                   position: fixed;
                   bottom: 35px;
                   left: 20px;
                   z-index: 1000;
                   text-decoration: none;
               }

               .arrow-back-m {
                   display: flex;
                   align-items: center;
                   justify-content: center;
                   width: 50px;
                   height: 50px;
                   background-color: #ffffff;
                   border-radius: 50%;
                   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
                   transition: all 0.3s ease;
               }

               .arrow-back-m:hover {
                   background-color: #f0f0f0;
                   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
               }

               .arrow-back-m span {
                   font-size: 35px;
                   color: #333333;
                   display: flex;
                   align-items: center;
                   justify-content: center;
                   width: 100%;
                   height: 100%;
                   margin: 0;
                   line-height: 1;
                   padding-bottom: 8px;
                   padding-left: 0px;
               }
               </style>

 

Я так и сделал, но с Главной всё равно не убралось.

 

Поставил чистую сборку с данного форума. Добавил модификатор.
https://trosti.tw1.su/
Почему не работает у вас, не представляю, код перед публикацией я всегда перепроверяю.

 

Да, вижу. У вас всё работает правильно. И при переходе на Главную кнопка Назад пропадает, как и нужно.
Посмотрел ваш код, попробовал сделать так же и у себя, но ничего не получается.
Может посмотрите, что мне конкретно нужно дописать чтобы кнопка исчезала с Главной, с учётом моих id и class? Это тестовый сайт, на котором я пробую это реализовать.
Кнопка доступна только для моб.версии, поэтому на десктопной её не будет.
Посмотреть вложение 9267

 

Кстати, у вас тоже так, или это только у меня?

 

Это у меня моё дополнение Short Code. Которое по этим данным может вывести в любом практически месте нужный модуль/модули. Просто отключил что бы быть полностью уверенным, что в модификатор для кнопки "Назад" ничего более не вмешивается.

 

Наконец-то сделал кнопку Назад, со всеми необходимыми функциями.
Оставлю способ здесь, вдруг кто-то будет искать так же как и я.

Отдельное спасибо Тому за внимание и помощь в решении проблемы. К сожалению, моих знаний не хватило для реализации варианта кнопки от Тома. Насколько я понял, у него уже готовое решение, в виде модификатора. Если кто понимает как это добавить на сайт, то данный способ подробно описан автором в этой теме.

У себя реализовал таким способом:


1. /* В ФАЙЛЕ common/header.twig ПОСЛЕ <div class=@container"> ВСТАВЛЯЕМ: */

<button id="history-button" class="history-hide"><i class="fa fa-chevron-left"></i></button>
<script>
window.addEventListener("load", function() {
let elem = document.querySelector('#history-button');

function checkPage() {
// Проверяем, если URL является корневым или содержит 'route=common/home'
if (window.location.pathname === '/' || window.location.href.includes('route=common/home')) {
elem.classList.add("history-hide");
} else if (window.history.length > 2) {
elem.classList.remove("history-hide");
}
}
checkPage();
// Добавляем обработчик для истории
window.addEventListener('popstate', checkPage);
elem.addEventListener('click', () => {
history.back();
});
});
</script>

2. В CSS
/* НАСТРАИВАЕМ ОТОБРАЖЕНИИ КНОПКИ НАЗАД */

.history-hide {
display: none!important;
}
#history-button {
background: transparent;
border: transparent;
color: #fff;
font-size: 13px;
padding: .5em 0em;
display: inline-block;
}

/* ФИКСИРУЕМ ВЕРХНЮЮ ПОЛОСКУ МЕНЮ */

@Media (max-width: 768px)
{
#top {
position: sticky;
top: 0;
z-index: 1000;
}}

/* УБИРАЕМ КНОПКУ НАЗАД НА ДЕСКТОПНОЙ ВЕРСИИ */

@Media (min-width: 768px)
{
#history-button {
display: none;
}}

Это вариант как на скрине выше.
У меня кнопка появляется только в моб.версии, везде кроме Главной страницы, там где есть история переходов по сайту (т.е. если просто зайти на сайт по ссылке, то кнопка отображаться не будет).
Слышал, что отображение только на моб.версии лучше делать через 'Mobile_Detect.php' но я не совсем понимаю как это реализовать.
В общем, пока остановился на таком варианте.

 

Я же вам расписал прям пошагово, что куда и как добавить....