Поиск Opencart — как перенести форму поиска из шапки в боковую панель.

Поиск Opencart переносим из хедера в левый или правый сайдбар (практика)

Дизайнеры, по-незнанию, не учитывают специфики строения и расположения блоков в Opencart и, изощряясь в мастерстве, создают верстальщикам задачи, связанные с изменением внутри кодов PHP, Javascript и т.д.
Однако, как правило, верстальщики не выходят за рамки знаний HTML и CSS. Именно для таких людей и пишется этот пост.
В Opencart форма поиска, и, соответственно, скрипты, осуществляющие этот самый поиск, находятся по-умолчанию в шапке (файлы header.tpl — во /view, header.php — в /controller, common.js в /javascript). Чтобы форма поиска работала безотказно не только в шапке, но в левой или в правой панели, придется пилить эти файлы.
Вызов html-кода, формирующего блок поиска в файле header.tpl осуществляется строкой:

<?php echo $search; ?>

Ее не составит труда перенести в файл column_right.tpl или column_left.tpl. Форма поиска станет видна в одном из сайдбаров, однако работать она не будет.
Чтобы заставить поиск трудиться, в соответствующий файл контроллера (например, column_right.php), перед строкой:

$data [‘modules’] = array();

Нужно вставить строку, которая объявляет переменную поиска:

$data [‘search’] = $this->load->controller(‘common/search’);

Однако поиск Opencart после всех наших манипуляций все равно откажется выполнять свои функции

Чтобы поиск Opencart заработал в боковой панели — изменяем код javascript

Дальнейшие правки будут производиться в файле /catalog/view/javascript/common.js
Позволю себе заметить, что правки файлов с расширениями .php .tpl .js удобно делать  с помощью программы notepad++
Открываем common.js программой notepad++ и ищем две строки, содержащие код:

$(‘header input[name=\’search\’]’)

В этом коде стираем слово «header», в результате чего в этих двух скриптах остается такой код:

$(‘input[name=\’search\’]’)

теперь,

Поиск Opencart работает в боковой панели

С чем я Вас и поздравляю!

6 comments on “Поиск Opencart — как перенести форму поиска из шапки в боковую панель.

  1. Unforgiver on said:

    Огромное спасибо за подсказку!!! Очень выручили!

    Еще момент: не работало, пока не убрал соответствующие строки из header.php и header.tpl.

  2. Unforgiver on said:

    Еще интересный момент: если вставлять только , то не работает ввод по нажатию клавиши «Enter», то есть, только по клику мыши. Но стоит заключить в , все работает.
    Может еще где-то надо подправить?

  3. Сергей on said:

    долго искал именно эту инфу, спасибо!!!!!!

  4. Спасибо, выручили

  5. Модули можно брать отсюда https://opencart2x.ru/moduli/

  6. Нажатие кнопки Enter закодировано в файле /catalog/view/javascript/common.js. в строках
    $(‘#search input[name=\’search\’]’).on(‘keydown’, function(e) {
    if (e.keyCode == 13) {
    $(‘header input[name=\’search\’]’).parent().find(‘button’).trigger(‘click’);
    }
    });
    Здесь скрипт находит поле ввода, которое в элементе с id=’search’ и после нажатия в нем клавиши с кодом 13 (Enter) перебрасывает клик на кнопку, к которой привязан скрипт поиска (button). Когда мы переносим весь поиск, нужно изменить соответственно и эти строки. Например, — если в левый сайдбар, то уже поле ввода не находится в блоке header и там работать не будет. Просто измените header на нужный элемент. Если нужна конкретная консультация — отвечу по почте mail@sait-kharkov.org.ua, пишите не стесняйтесь, денег не потребую.

Добавить комментарий

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

*

* Copy This Password *

* Type Or Paste Password Here *

5 361 Spam Comments Blocked so far by Spam Free Wordpress

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>