Вывод списка новостей в аккордеоне — различия между версиями
Gordeev (обсуждение | вклад) |
Mad grant (обсуждение | вклад) |
||
(не показаны 3 промежуточные версии 1 участника) | |||
Строка 1: | Строка 1: | ||
− | "Аккордеоном" принято называть механизм отображения контента, когда основное содержание раздела открывается при клике на заголовке | + | "Аккордеоном" принято называть механизм отображения контента, когда основное содержание раздела открывается при клике на заголовке, при этом ранее открытый раздел сворачивается. Данная статья не является каким-либо готовым решением для сайта, а скорее демонстрирует возможности использования стандартных конструкций библиотеки jQuery в UMI.CMS. Вместо списка новостей можно организовать аналогичный вывод какой-либо другой информации на сайте. |
Примерный результат выполнения этой статьи можно увидеть открыв в браузере HTML-файл следующего содержания. | Примерный результат выполнения этой статьи можно увидеть открыв в браузере HTML-файл следующего содержания. | ||
<pre> | <pre> | ||
Строка 54: | Строка 54: | ||
</pre> | </pre> | ||
− | Итак, создаем новый шаблон дизайна | + | Итак, создаем новый шаблон дизайна accordion.tpl со следующим содержанием: |
<pre> | <pre> | ||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> | ||
Строка 72: | Строка 72: | ||
<body> | <body> | ||
<div id="accordion"> | <div id="accordion"> | ||
− | %news lastlist('vse_novosti/novosti_ekonomiki',' | + | %news lastlist('vse_novosti/novosti_ekonomiki','acc')% |
</div> | </div> | ||
Строка 78: | Строка 78: | ||
</html> | </html> | ||
</pre> | </pre> | ||
+ | В макросе %news lastlist()% указываем раздел новостей, который хотим выводить и вывод его по шаблону 'acc', который мы создадим далее. | ||
+ | Подключаем шаблон accordion.tpl в настройках модуля "Контент". И указываем его в качестве шаблона дизайна для какой-либо страницы. | ||
+ | Создаем шаблон вывода новостей tpls/news/acc.tpl. За основу можно взять дефолтный шаблон, изменив в нем первые два блока: | ||
+ | <pre> | ||
+ | $FORMS['lastlist_block'] = <<<END | ||
+ | |||
+ | |||
+ | %items% | ||
+ | |||
+ | END; | ||
+ | |||
+ | $FORMS['lastlist_item'] = <<<END | ||
+ | |||
+ | |||
+ | <h3><a href="#">%system convertDate(%publish_time%, 'd.m.Y')% | %name%</a></h3> | ||
+ | <div> | ||
+ | <p> | ||
+ | %content% | ||
+ | </p> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | END; | ||
+ | </pre> | ||
+ | В результате, при открытии страницы, которой мы назначили шаблон дизайна accordion.tpl, будет выводиться список новостей в аккордеоне. | ||
+ | [[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]][[Категория:Модуль Новости]][[Категория:Верстка в TPL]] |
Текущая версия на 13:29, 5 июня 2013
"Аккордеоном" принято называть механизм отображения контента, когда основное содержание раздела открывается при клике на заголовке, при этом ранее открытый раздел сворачивается. Данная статья не является каким-либо готовым решением для сайта, а скорее демонстрирует возможности использования стандартных конструкций библиотеки jQuery в UMI.CMS. Вместо списка новостей можно организовать аналогичный вывод какой-либо другой информации на сайте. Примерный результат выполнения этой статьи можно увидеть открыв в браузере HTML-файл следующего содержания.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" xmlns:umi="http://www.umi-cms.ru/TR/umi"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Баян</title> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> <script> $(document).ready(function() { $("#accordion").accordion(); }); </script> </head> <body> <div id="accordion"> <h3><a href="#">23.12.2009 | Россия и Белоруссия отказались от ограничений во взаимной торговле</a></h3> <div> <p> <p>Россия и Белоруссия подписали соглашение о мерах по развитию торгово-экономического сотрудничества, которое отменяет существующие ограничения в торговле между странами. Об этом сообщает РИА Новости. Свои подписи под документом поставили вице-премьер Белоруссии Андрей Кобяков и замглавы Минэкономразвития России Виталий Савельев. Чиновники также договорились и о поставках белорусского сахара в Россию в 2007 и 2008 годах. Подписание соглашения по торговому сотрудничеству планировалось еще 20 марта. Однако в последний момент белорусская сторона внесла в проект ряд изменений, в связи с чем его пришлось заново согласовывать. По информации газеты "Коммерсант", Белоруссия в последний момент выступила за сдвиг сроков реализации соглашений. До настоящего времени в Белоруссии существуют квоты на ввоз российского пива, сигарет и морепродуктов. В свою очередь, Россия ограничивает импорт белорусского сахара. На подготовку соглашения о развитии торгово-экономического сотрудничества ушло около года. Серьезный прогресс в переговорах был достигнут после встречи премьер-министров России и Белоруссии Михаила Фрадкова и Сергея Сидорского в январе 2007 года. Они пообещали отменить около 40 правительственных актов, затрудняющих ввоз российских товаров на территорию Белоруссии.</p> </p> </div> <h3><a href="#">19.12.2009 | Онищенко предлагает пугать курильщиков до смерти</a></h3> <div> <p> <p>Главный санитарный врач России Геннадий Онищенко предложил размещать на сигаретных пачках изображение, наглядно демонстрирующее смертельную опасность курения. Как передает агентство "Интерфакс", на пресс-конференции во вторник, 6 февраля, он заявил: "Моя мечта - сделать, как в Канаде - помещать на пачку изображение легких курильщика на стадии рака". Онищенко также выразил озабоченность ростом числа курильщиков среди подростков. По его словам, к 11-му классу в России курят 60 процентов мальчиков и 40 процентов девочек, сообщает РИА Новости. "Табачный бизнес сегодня втягивает все больше наших детей, снижая тем самым их здоровье", - отметил главный санитарный врач РФ.</p> </p> </div> <h3><a href="#">16.12.2009 | Белоруссия отменит квоты на сигареты из России</a></h3> <div> <p> <p>Белоруссия намерена отменить квоты на импорт сигарет из России. Соответствующие поправки внесены министерством торговли в Совет министров, сообщает агентство БЕЛТА. В последнее время Белоруссия постепенно сокращает квоты на ввоз сигарет, который, в основном, идет с российских предприятий. В 2006 году квота составила полтора миллиарда сигарет, а в 2005 году - три миллиарда. При этом только четыре белорусских компании могут приобретать сигареты за рубежом. Уменьшением квот Белоруссия пыталась добиться того, чтобы крупные иностранные производители делали сигареты на местных фабриках. В настоящее время белорусские заводы выпускают по лицензии табак под марками Alliance, Viceroy, Magna, Winston, West и другими. Отмена квот на российские сигареты будет выполнена согласно договоренности между премьер-министрами России и Белоруссии Михаилом Фрадковым и Сергеем Сидорским. Когда в начале января чиновники подписали документы об экспорте нефти и нефтепродуктов, Сидорский пообещал в ближайшем времени отменить около 40 правительственных актов, затрудняющих движение российских товаров.</p> </p> </div> </div> </body> </html>
Итак, создаем новый шаблон дизайна accordion.tpl со следующим содержанием:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" xmlns:umi="http://www.umi-cms.ru/TR/umi"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>%title%</title> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> <script> $(document).ready(function() { $("#accordion").accordion(); }); </script> </head> <body> <div id="accordion"> %news lastlist('vse_novosti/novosti_ekonomiki','acc')% </div> </body> </html>
В макросе %news lastlist()% указываем раздел новостей, который хотим выводить и вывод его по шаблону 'acc', который мы создадим далее. Подключаем шаблон accordion.tpl в настройках модуля "Контент". И указываем его в качестве шаблона дизайна для какой-либо страницы. Создаем шаблон вывода новостей tpls/news/acc.tpl. За основу можно взять дефолтный шаблон, изменив в нем первые два блока:
$FORMS['lastlist_block'] = <<<END %items% END; $FORMS['lastlist_item'] = <<<END <h3><a href="#">%system convertDate(%publish_time%, 'd.m.Y')% | %name%</a></h3> <div> <p> %content% </p> </div> END;
В результате, при открытии страницы, которой мы назначили шаблон дизайна accordion.tpl, будет выводиться список новостей в аккордеоне.