"Версия для печати" как реализовать?

115 Posts

bangman Reply #1, 16 years, 11 months ago

Как реализовать такую вещь, как версия для печати, где страница открывается без оформительских излишеств, просто текст. Я так понимаю, что по клику на ссылку нужно подгрузить другой стиль.
На странице подгружается по-умолчанию стиль так:

<link rel="stylesheet" media="screen" type="text/css" href="css/main.css"/>

А вот по клику на ссылку должен подгрузиться такой:

<link rel="stylesheet" media="print" type="text/css" href="css/print_main.css"/>

Вопрос в том, как подгрузить пользовательские css с помощью MODx API? и оформить все это ссылкой....Может кто подкинет идею?

2,113 Posts

AKots Reply #2, 16 years, 11 months ago

При чем тут какие-то загрузки? На странице должны быть обе строки, и при выводе на экран будет использоваться один стиль, а при печати – другой. А распечатать можно так:
<a href="javascript:window.print()">Распечатать</a>

Создание сайтов на MODx, поддержка сайтов, поисковая оптимизация, программирование, копирайтинг
Статьи о MODx, регулярно новые публикации

31 Posts

stone Reply #3, 16 years, 11 months ago

Quote from: AKots at Nov 11, 2009, 09:21 PM

При чем тут какие-то загрузки? На странице должны быть обе строки, и при выводе на экран будет использоваться один стиль, а при печати – другой.....

Это все кошерно. Но вопрос, видимо, все-таки о другом. С такой ситуацией сам сталкивался, пока решения не нашел.

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

Существуют решения вроде PrintDoc, но оно выводить еще одно окно, для которого необходим отдельный MODX-шаблон (такое решение не понравилось).

Пробовал такое решение, очень понравилось - http://cssing.org.ua/2007/04/07/print-version-with-javascript/
До конца не смог настроить. Печатная версия генерирует site.ru/#print (происходит переход на главную) вместо site.ru/xz/xz1/xz2.html#print

PS
http://modxcms.com/forums/index.php?topic=37864.0

PPS
Искал что-то вроде
<a href="javascript:window.printpreview()">Просмотр печати</a>
не нашел

☆ A M B ☆
1,086 Posts

Fuzzy Reply #4, 16 years, 11 months ago

Сниппет PrintPage

<?php
$output = "";
if ($_GET["print"]==1) {
	$output = '<link rel="stylesheet" type="text/css" href="css/print_main.css"/>';
	$output .= '<script type="text/javascript">
	function printpage() {
	window.print();
	}
	window.onload = setTimeout("printpage()",3000);
	</script>';
}
else {
	$output = '<link rel="stylesheet" type="text/css" href="css/main.css"/>';
}
return $output;
?>

Вызываем сниппет в шаблоне между <HEAD> и </HEAD> там, где указан путь к CSS файлу, вроде этого:

<HEAD>
...
[!PrintPage!]
...
</HEAD>

Ну и ссылку "Печатная версия" надо добавить в шаблон, чтобы вызывать на каждой странице, вроде этого:

<a href="[~[*id*]~]?print=1" title="Печатная версия">Печатная версия</a>

Пример реализации можно посмотреть здесь http://ibc.lv/ru/ (любая внутренняя страница).

Удачи

Разработка сайтов и программных модулей на MODX.
Опыт работы на MODx с 2005 года. Высокое качество.
Компания Baltic Design Colors: http://www.bdcolors.ru.

2,113 Posts

AKots Reply #5, 16 years, 11 months ago

Quote from: Fuzzy at Nov 12, 2009, 02:12 AM

Сниппет PrintPage

Вряд ли так получится – в сниппете написано
<link rel="stylesheet" media="print" type="text/css" href="css/print_main.css"/>
А на сайте, куда указывает ссылка стоит на странице печати
<link href="/print.css" rel="stylesheet" type="text/css" />
То есть отсутствует media="print" – просто стиль, разработанный для печати, используется и для вывода на монитор.

А вообще задача печати и просмотра – разные задачи. Добавлением отдельного CSS для печати успешно реализуется и просмотр и печать средствами браузера, причем просмотр намного удобнее, чем доморощенными методами – с разбивкой на страницы, с заголовками и учетом особенностей настройки печати в браузере. Генерация лишних строк «для печати» при этом негативно воспринимается поисковыми системами, требуются дополнительные усилия по их запрету к индексации, да и не получится сделать их точно такими, как будет выглядеть распечатанный документ. Но если очень хочется сделать такую страницу, то действительно, надо CSS для печати использовать для отображения на экране, причем есть разные способы реализации этого.

Создание сайтов на MODx, поддержка сайтов, поисковая оптимизация, программирование, копирайтинг
Статьи о MODx, регулярно новые публикации

☆ A M B ☆
1,086 Posts

Fuzzy Reply #6, 16 years, 11 months ago

Quote from: AKots at Nov 12, 2009, 04:07 AM

Вряд ли так получится – в сниппете написано
<link rel="stylesheet" media="print" type="text/css" href="css/print_main.css"/>
А на сайте, куда указывает ссылка стоит на странице печати
<link href="/print.css" rel="stylesheet" type="text/css" />

Я просто уже вписал тот адрес CSS стилей, который был у топикстартера.
Конечно, на ibc.lv используется в сниппете свой адрес.
Quote from: AKots at Nov 12, 2009, 04:07 AM

То есть отсутствует media="print" – просто стиль, разработанный для печати, используется и для вывода на монитор.

Понятно, что можно использовать media="print", но по-моему у топикстартера была другая задача, которая точно совпадает с решением на ibc.lv.

Разработка сайтов и программных модулей на MODX.
Опыт работы на MODx с 2005 года. Высокое качество.
Компания Baltic Design Colors: http://www.bdcolors.ru.

2,113 Posts

AKots Reply #7, 16 years, 11 months ago

Quote from: Fuzzy at Nov 12, 2009, 04:15 AM

Я просто уже вписал тот адрес CSS стилей, который был у топикстартера.

Дело не в адресе, а в том, что если в сниппете будет написано media="print", ничего работать не будет, надо это убрать.

Создание сайтов на MODx, поддержка сайтов, поисковая оптимизация, программирование, копирайтинг
Статьи о MODx, регулярно новые публикации

☆ A M B ☆
1,086 Posts

Fuzzy Reply #8, 16 years, 11 months ago

Quote from: AKots at Nov 12, 2009, 04:23 AM

Дело не в адресе, а в том, что если в сниппете будет написано media="print", ничего работать не будет, надо это убрать.

А, понял, да, действительно. Это я просто скопировал весь код топикстартера. Изменил код.

Разработка сайтов и программных модулей на MODX.
Опыт работы на MODx с 2005 года. Высокое качество.
Компания Baltic Design Colors: http://www.bdcolors.ru.

115 Posts

bangman Reply #9, 16 years, 11 months ago

Спасибо, Fuzzy, задача именно такая, как на ibc.lv.

358 Posts

labasus Reply #10, 16 years, 10 months ago

У меня почему-то линк начал работать только когда поменял

C

<a href="[~[*id*]~]?print=1" title="Печатная версия">Печатная версия</a>

На

<a href="[~[*id*]~]&print=1" title="Печатная версия">Печатная версия</a>

P.S. EVO 1.0.2, ЧПУ - off

Quote from: Fuzzy at Nov 12, 2009, 02:12 AM

Ну и ссылку "Печатная версия" надо добавить в шаблон, чтобы вызывать на каждой странице, вроде этого:
<a href="[~[*id*]~]?print=1" title="Печатная версия">Печатная версия</a>
Пример реализации можно посмотреть здесь http://ibc.lv/ru/ (любая внутренняя страница).