Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
  • Sign Up

[Решено] Как сделать всплывающими изображения на странице информации?


Recommended Posts

Пытаюсь сделать изображения всплывающими на странице статей (index.php?route=information)

Вставляю в шаблон catalog/view/theme/pechi/template/information/information.tpl в самом конце до <?php echo $footer; ?>

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

И в шаблоне добавил thumbnails (класс блоку, внутри которого размещаю изображения)

<div id="content" class="col-sm-12 thumbnails" wfd-id="78">
  <h1>Сертификаты</h1>
  	<p><a href=".../img_20180904_095931_result.jpg"><img alt="" src=".../img_20180904_095931_result.jpg" style="height:359px; width:250px"></a></p>
</div>

Чего еще не хватает? Что еще добавить чтобы заработало всплывание изображений?

Link to post
Share on other sites

А чем вас не устраивает стандартный бутстрап?

Спойлер

<button class="btn btn-primary" data-toggle="modal" data-target=".bd-example-modal-lg">Large modal</button>

<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      ...
    </div>
  </div>
</div>

 

 

Link to post
Share on other sites
42 минуты назад, anboza сказал:

А чем вас не устраивает стандартный бутстрап?

  Скрыть контент


<button class="btn btn-primary" data-toggle="modal" data-target=".bd-example-modal-lg">Large modal</button>

<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      ...
    </div>
  </div>
</div>

 

 

Я пытался сделать на основе того, как это сделано на странице карточки товара, когда жмем на изображение и оно увеличивается. Для того чтобы задействовать бутстрап, придется прописывать блоки с классами, а я делаю для человека, который будет добавлять изображения через виз. редактор. Пытаюсь сделать, чтобы можно было через виз.редактор можно было добавить изображение с ссылкой на это же изображение и чтобы оно подхватывалось всплывашкой, которая задействована на странице товаров.

Link to post
Share on other sites

[РЕШЕНО]

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

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

2. В том же шаблоне дать родительскому блоку содержимого класс thumbnails

3. В контроллере 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');

 

Link to post
Share on other sites

  • 1 year later...
  • 7 months later...
On 9/19/2018 at 10:22 AM, alinalessioYandex said:

[РЕШЕНО]

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


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

2. В том же шаблоне дать родительскому блоку содержимого класс thumbnails

3. В контроллере 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');

 

Добрый день. По второму пункту можно подробнее пожалуйста? как дать родительскому блоку содержимого класс? где и куда его прописать?

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.