Как сделать всплывающие изображения с помощью magnific popup?

[forlan]

Привет . На тестовом сайте http://at7.ru/index.php?route=information/information&information_id=4 нужно сделать чтобы всплывающее изображение было с помощью magnific popup. Как это сделать? Искал решение, в теме по ссылке был похожий вопрос. Попробовал сделать следующее, но что-то не заработало

1.В шаблоне catalog/view/theme/ВАШАТЕМА/template/information/information.tpl добавить

<script type="text/javascript">
   $(document).ready(function() {
    $('.image').magnificPopup({
      type:'image',
      delegate: 'a',
      gallery: {
        enabled:true
      }
    });
  });
</script>

2.

В контроллере catalog/controller/information/information.php после строки

$this->document->setKeywords($information_info['meta_keyword']);

вставить следующее:

$this->document->addScript('catalog/view/javascript/jquery/magnific/jquery.magnific-popup.min.js');
$this->document->addStyle('catalog/view/javascript/jquery/magnific/magnific-popup.css');

 

 

 

 

[Blast]

2 часа назад, forlan сказал:

Привет . На тестовом сайте http://at7.ru/index.php?route=information/information&information_id=4 нужно сделать чтобы всплывающее изображение было с помощью magnific popup. Как это сделать? Искал решение, в теме по ссылке был похожий вопрос. Попробовал сделать следующее, но что-то не заработало

 

<script type="text/javascript">
   $(document).ready(function() {
    $('.category-item').magnificPopup({
      type:'image',
      delegate: 'a',
      gallery: {
        enabled:true
      }
    });
  });
</script>

и обновите кэш модификаторов

[forlan]

13 часов назад, Blast сказал:

 

<script type="text/javascript">
   $(document).ready(function() {
    $('.category-item').magnificPopup({
      type:'image',
      delegate: 'a',
      gallery: {
        enabled:true
      }
    });
  });
</script>

и обновите кэш модификаторов

все, теперь заработало! Спасибо

[forlan]

В 11.09.2019 в 19:06, Blast сказал:

 

<script type="text/javascript">
   $(document).ready(function() {
    $('.category-item').magnificPopup({
      type:'image',
      delegate: 'a',
      gallery: {
        enabled:true
      }
    });
  });
</script>

и обновите кэш модификаторов

@Blast привет, помогите пожалуйста. отловил один баг. Кроме самих фото магазинов на странице с информацией также есть кнопки на страницы категории в виде изображений (Каталог магазина, Люстры, Тарелки и т.д) при нажатии на которые теперь вместо перехода по ссылке открывается магнифик попап и текст "The image could not be loaded". Вопрос ОЧЕНЬ для меня важный, прошу Вас помочь. Сайт тестовый если что http://at7.ru/index.php?route=information/information&information_id=4

Змінено 2 жовтня 2019 користувачем forlan

[Blast]

4 минуты назад, forlan сказал:

@Blast привет, помогите пожалуйста. отловил один баг. Кроме самих фото магазинов на странице с информацией также есть кнопки на страницы категории в виде изображений (Каталог магазина, Люстры, Тарелки и т.д) при нажатии на которые теперь вместо перехода по ссылке открывается магнифик попап и текст "The image could not be loaded". Вопрос ОЧЕНЬ для меня важный, прошу Вас помочь. Сайт тестовый если что http://at7.ru/index.php?route=information/information&information_id=4

 

<script type="text/javascript">
   $(document).ready(function() {
    $('.ext-description .category-item').magnificPopup({
      type:'image',
      delegate: 'a',
      gallery: {
        enabled:true
      }
    });
  });
</script>

[forlan]

15 минут назад, Blast сказал:

 

<script type="text/javascript">
   $(document).ready(function() {
    $('.ext-description .category-item').magnificPopup({
      type:'image',
      delegate: 'a',
      gallery: {
        enabled:true
      }
    });
  });
</script>

Внес эти правки на основном сайте и теперь все работает просто замечательно! Огромное спасибо Вам за помощь!

[Azazello77]

На третьем опенкарте не заработало.

Страница обваливается с ошибкой:

 

Notice: Undefined variable: this in /home/хост/сайт.ru/htdocs/storage/modification/catalog/controller/information/information.php on line 54

Notice: Trying to get property 'document' of non-object in /home/хост/

сайт.ru/htdocs/storage/modification/catalog/controller/information/information.php on line 54

 

причем строка 54 вообще:

 

$data['description'] = html_entity_decode($information_info['description'], ENT_QUOTES, 'UTF-8');

 

 

В итоге просто подключил скрипты на information.twig

и  скрипт 

 

 

$('.image-popup-zoom').magnificPopup({
 type: 'image',
 zoom: {
     enabled: true,
     duration: 300 // продолжительность анимации. Не меняйте данный параметр также и в CSS
 }
 });

 

вставил

Змінено 9 липня 2020 користувачем Azazello77

[Clan]

А как можно реализовать попап-фото в описании карточки товара?

[Clan]

В 11.09.2019 в 15:06, Blast сказал:

и обновите кэш модификаторов

 

А как можно реализовать попап-фото в описании товара?

[Dimasscus]

21 минуту назад, Clan сказал:

 

А как можно реализовать попап-фото в описании товара?

например так https://mir-dverey.biz/mezhkomnatnye_dveri/dverikorfad/piano-deluxe-pnd-01-dub-bras-steklo-satin-5254_