Кнопка "Печать" для фотографий в фотоальбоме

InstantCMS 2.X
#1 25 января 2018 в 15:35
Добрый день!
Появилась необходимость сделать кнопку "Печать" для фото в фотоальбомах. Там уже есть кнопка "Скачать", и нужна аналогичная, которая выводит сразу на принтер, причем выводит только картинку (оригинал), а не всю страницу целиком.
Может быть, кто-нибудь посоветует, как это можно сделать? Версия 2.9.0, шаблон дефолтный.
Или может быть есть подходящая разработка в каталоге дополнений? Искала, не нашла.
Заранее спасибо за любую помощь!
#2 25 января 2018 в 17:46

Добрый день!
Появилась необходимость сделать кнопку "Печать" для фото в фотоальбомах. Там уже есть кнопка "Скачать", и нужна аналогичная, которая выводит сразу на принтер, причем выводит только картинку (оригинал), а не всю страницу целиком.
Может быть, кто-нибудь посоветует, как это можно сделать? Версия 2.9.0, шаблон дефолтный.
Или может быть есть подходящая разработка в каталоге дополнений? Искала, не нашла.
Заранее спасибо за любую помощь!

kizaika
файл templates/default/controllers/photos/view.tpl
после кода
  1. <?php if (!empty($downloads)){ ?>
  2. <div class="download_menu">
  3. <span id="download-button" class="download-button"><i class="photo_icon icon_download"></i> <?php echo LANG_DOWNLOAD; ?></span>
  4. <div id="bubble">
  5. <table>
  6. <tbody>
  7. <?php foreach ($downloads as $download) { ?>
  8. <tr class="<?php echo $download['preset']; ?>_download_preset <?php echo (!$download['link'] ? 'disable_download' : ''); ?>">
  9. <td>
  10. <label><input <?php echo ($download['select'] ? 'checked=""' : ''); ?> type="radio" name="download" <?php echo (!$download['link'] ? 'disabled=""' : ''); ?> value="<?php echo $download['link']; ?>"> <?php echo $download['name']; ?> </label>
  11. </td>
  12. <td>
  13. <?php echo $download['size']; ?>
  14. </td>
  15. </tr>
  16. <?php } ?>
  17. </tbody>
  18. </table>
  19. <a class="download-button process_download" href=""><?php echo LANG_DOWNLOAD; ?></a>
  20. </div>
  21. </div>
  22. <?php } ?>
вставь
  1.  
  2. <script language="javascript">
  3. function callPrint(link) {
  4. var win = window.open();
  5. win.document.write('<img src="'+link+'">');
  6. win.print();
  7. win.close()
  8. }
  9. </script>
  10.  
  11. <a class="print-button" href="javascript:" onclick="callPrint($(this).data('url'))" data-url="<?php echo html_image_src($photo['image'], 'original', true, array()) ?>">Распечатать</a>
  12.  
  13.  
#3 25 января 2018 в 19:59
ideasdigger, спасибо огромное!!! Получилось!
Может быть, Вы еще подскажете, как сделать так, чтобы кнопка выглядела аналогично кнопке "Скачать", а не просто надпись? Буду очень благодарна!
#4 26 января 2018 в 02:45
kizaika, оформите css стилями. Если что — го в лс, помогу
#5 26 января 2018 в 04:39

ideasdigger, спасибо огромное!!! Получилось!
Может быть, Вы еще подскажете, как сделать так, чтобы кнопка выглядела аналогично кнопке "Скачать", а не просто надпись? Буду очень благодарна!

kizaika
в файл templates/default/controllers/photos/styles.css добавить, отблагодарить можно + в карму
  1.  
  2. .print-button {
  3. display: block;
  4. margin: 10px 0 0;
  5. background-color: #57b057;
  6. color: #fff;
  7. padding: 10px 22px;
  8. border-radius: 2px;
  9. white-space: nowrap;
  10. vertical-align: middle;
  11. text-align: center;
  12. cursor: pointer;
  13. transition: background-color 0.5s;
  14. text-decoration: none;
  15. }
  16. .print-button:hover {
  17. background-color: #27ae60;
  18. text-decoration: none;
  19. color: #fff;
  20. }
  21.  
#6 26 января 2018 в 11:57
ideasdigger, спасибо!!!
#7 26 января 2018 в 12:03

отблагодарить можно + в карму

ideasdigger

+ однозначно за вашу готовность помогать людям.
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.