Закрытые окна Быстрый просмотр товара

Здравствуйте.
Как сделать так, чтобы всплывающее окно “Быстрый просмотр товара” закрывалось при нажатии на любую область экрана вне этого окна? (сейчас его можно закрыть только щелкнув на крестик)

1 лайк
  1. Cоздайте в папке САЙТ/js/addons/my_changes/ файл close_dialog.js. В него вставьте код:
jQuery(function($){
    $('body').on('click','.ui-widget-overlay', function() {
        $('.ui-dialog').filter(function () {
            return $(this).css("display") === "block";
        }).find('.ui-dialog-content').dialog('close');
    });
});

Далее, в папке САЙТ/design/themes/ТЕМА/templates/addons/my_changes/hooks/index/ создайте файл scripts.post.tpl и в него вставьте код:

{script src="js/addons/my_changes/close_dialog.js"}

После этого включите модуль “Мои изменения”, если он выключен, и почистите кэш.

  1. Либо более быстрый способ и более “дубовый”, это пойти в Дизайн – Макеты, в макете “По-умолчанию” создать новый блок с поддержкой smarty и в него добавить содержимое:
{literal}
<script>
jQuery(function($){
    $('body').on('click','.ui-widget-overlay', function() {
        $('.ui-dialog').filter(function () {
            return $(this).css("display") === "block";
        }).find('.ui-dialog-content').dialog('close');
    });
});
</script>
{/literal}
4 лайка
{literal}    
<script type="text/javascript">
    	(function (_, $) {
    		$('body').on('click','.ui-widget-overlay', function() {
    			obj = $.ceDialog('get_last');
    			if (obj.length){
    				obj.ceDialog('close');
    			}
    		});
    	})(Tygh, Tygh.$);
    </script>
{/literal}

Так же как в предыдущем посте - либо добавить код в func.js модуля либо создать блок типа смарти с этим содержимым.

2 лайка

А как сделать закрытия уведомлений?

Увы, тут не подскажу. Уведомления сверху экрана никому не мешают и быстро скрываются сами.

Нажимая на кнопку купить появляется окно с уведомлением о купленном товаре с двумя кнопками “Оформить заказ” и “Закрыть” последнюю из логичных соображений переименовал в “Продолжить покупки”. Так вот этот блок по умолчанию вместе с остальными уведомлениями исчезает через время.
Из личного опыта проверено, что самовольное исчезновение этого блока вводит покупателя в ступор, поэтому отключаю его в настройках время отображения уведомлений (чтобы уведомления не скрывались автоматически, введите 0) . Но тут тогда появляется другая проблема это закрытие уведомлений, особенно неудобное на мобильных устройствах. Исчезновение по клику в не области уведомлений решило бы все эти проблемы.

Можно воспользоваться этим способом и вместо попапа выводить уведомление о добавлении товара в корзину сверху экрана:

Так меньше покупателей раздражаться будет.

Сам попап необходим, только его нужно доработать:

  1. Добавить возможность изменять количество купленного товара прямо в этом окне с автоподсчетом общей суммы (автопересчет осуществляется сторонним модулем).
  2. После добавления в корзину следующего товара в попап должен отображаться весь список с итоговой суммой, а то получается отображается один товар, а сумма за все уже добавленные в корзину. По сути запихнуть бы в этот попап страницу корзины только по компактней с мини-иконками и прокруткой.
  3. Сделать закрытие по клику вне области попап.
    И было бы все гуд, покупатель контролировал бы все свои покупки без лишних телодвижений не переходил бы по несколько раз в корзину для проверки добавленных товаров.

Вот пример
https://comfy.ua/means-for-washing/

1 лайк

Если ещё актуально, напишите в личку.