Отключен JavaScript

У вас отключен JavaScript. Некоторые возможности системы не будут работать. Пожалуйста, включите JavaScript для получения доступа ко всем функциям.

zooitem горизонтальное отображение

Автор nickolas , Jan 12 2014 13:02

Лучший Ответ Cheren-dow , 13 January 2014 - 12:02

$zoo->document->addStylesheet('modules:mod_zooitem/tmpl/list-h/style.css');"

Что бы это работало нужно инициализировать переменную $zoo следующим образом

$zoo = App::getInstance('zoo');

У вас в коде есть эта строка?

Перейти к сообщению

Вперед

Тема закрыта

Сообщений в теме: 18

#1 nickolas

JBZoo User (rus)
Общий рейтинг: 0
сообщений: 49
топиков: 17

Отправлено 12 January 2014 - 13:02

Добрый день - вроде вышло у меня настроить zooitem, благодарю - но не как мне не удается, чтобы 4 товара отображались горизонтально, а не один за другим.

http://boon.by/ventel.html

Может посоветуете, где это можно настроить - в Урок 9. Популярные и случайные товары по умолчанию что-то у человека все вышло... Я вроде так же все сделал

0

Наверх

#2 Артур

JBZoo User (rus)
Общий рейтинг: 0.9
сообщений: 63
топиков: 21

Отправлено 12 January 2014 - 13:33

В zoo item создайте шаблон list-h.php в него впишите:

<?php

defined('_JEXEC') or die('Restricted access');

// include css
$zoo->document->addStylesheet('modules:mod_zooitem/tmpl/list-h/style.css');

// include js
$zoo->document->addScript('modules:mod_zooitem/mod_zooitem.js');

$count = count($items);

?>

<div class="zoo-item list-h">

	<?php if ($count) : ?>

		<ul>
			<?php $i = 0; foreach ($items as $item) : ?>
			<li class="width<?php echo intval(100 / $count);?> <?php if ($i % 2 == 0) { echo 'odd'; } else { echo 'even'; } ?>">
				<div class="match-height"><?php echo $renderer->render('item.'.$layout, compact('item', 'params')); ?></div>
			</li>
			<?php $i++; endforeach; ?>
		</ul>
		
	<?php else : ?>
		<?php echo JText::_('COM_ZOO_NO_ITEMS_FOUND'); ?>
	<?php endif; ?>
		
</div>

<script type="text/javascript">
	jQuery(function($) {
		$('div.zoo-item.list-h').each(function() { $(this).find('.match-height').matchHeight(); });
	});
</script>

Рядом киньте папку list-h и в ней создайте файл style.css

.zoo-item.list-h > ul {
	margin: 0px -10px 0px -10px;
	padding: 0px;
	list-style: none;
	overflow: hidden;
}

.zoo-item.list-h > ul > li {
	margin: 0px;
	padding: 0px;
	background: url(images/line_dotted_v.png) 0 0 repeat-y;
	float: left;
	overflow: hidden;
}
.zoo-item.list-h > ul > li:first-child { background: none; }
.zoo-item.list-h > ul > li.odd {}
.zoo-item.list-h > ul > li.even {}

.zoo-item.list-h > ul > li.width12 { width: 12.5%; }
.zoo-item.list-h > ul > li.width14 { width: 14.285%; }
.zoo-item.list-h > ul > li.width16 { width: 16.666%; }
.zoo-item.list-h > ul > li.width20 { width: 20%; }
.zoo-item.list-h > ul > li.width25 { width: 25%; }
.zoo-item.list-h > ul > li.width33 { width: 33.33%; }
.zoo-item.list-h > ul > li.width50 { width: 50%; }

.zoo-item.list-h > ul > li > div { padding: 0px 10px 0px 10px; }

/* position: media */
.zoo-item.list-h div.media-top { margin-bottom: 10px; }

.zoo-item.list-h div.media-left {
	margin-right: 10px;
	float: left;
}

.zoo-item.list-h div.media-right {
	margin-left: 10px;
	float: right;
}

.zoo-item.list-h div.media-middle,
.zoo-item.list-h div.media-bottom { margin-top: 10px; }

.zoo-item.list-h div.media > img,
.zoo-item.list-h div.media > object,
.zoo-item.list-h div.media > embed { display: block; }

/* position: title */
.zoo-item.list-h h3.title {
	margin: 0px;
	font-size: 16px;
	line-height: 20px;
	font-weight: normal;
	letter-spacing: 0px;
}

.zoo-item.list-h h3.title a {}

/* position: meta */
.zoo-item.list-h p.meta {
	margin: 0px;
	font-size: 11px;
	color: #969696;
	line-height: 13px;
	font-style: italic;
}

/* position: description */
.zoo-item.list-h div.description { margin: 5px 0px 0px 0px; }

.zoo-item.list-h div.description > div { margin-top: 5px; }
.zoo-item.list-h div.description > div:first-child { margin-top: 0px; }

/* position: links */
.zoo-item.list-h p.links { margin: 5px 0px 0px 0px; }

.zoo-item.list-h p.links span a:after {
	content: " »";
	font-size: 14px;
}

Готово. в списке модулей находите ваш zoo item и выбирайте там новый шаблон list-h

1

Наверх

#3 Cheren-dow

JBZoo User (rus)
Общий рейтинг: 95.7
сообщений: 5060
топиков: 31

Отправлено 12 January 2014 - 15:07

Вопрос решен топик можно закрывать?

0

Наверх

#4 nickolas

Topic Starter
JBZoo User (rus)
Общий рейтинг: 0
сообщений: 49
топиков: 17

Отправлено 12 January 2014 - 20:55

Вопрос решен топик можно закрывать?

Не совсем

Сделал по написанному:

http://gyazo.com/aeb...ec16287c1f04fd3 - шаблон то появился, но пустой

http://boon.by/catalog.html

а вот что модуль выдал (он в футере)

0

Наверх

#5 nickolas

Topic Starter
JBZoo User (rus)
Общий рейтинг: 0
сообщений: 49
топиков: 17

Отправлено 12 January 2014 - 22:19

Вот принтскрин ftp - http://gyazo.com/20f...390d3c670e621a6 путь: /modules/mod_zooitem/renderer/item/ - добавил файл list-h.php с кодом и создал папку list-h с файлом style.css... Вроде от инструкций не отступил - а не получилось

0

Наверх

#6 Sliapy

JBZoo User (rus)
Общий рейтинг: 50.5
сообщений: 6393
топиков: 15

Отправлено 12 January 2014 - 22:20

Нужно добавить данные о шаблоне в metadata.xml и позиции шаблона в positions.xml по аналогии с уже существующими.

Сообщение отредактировал Sliapy: 12 January 2014 - 22:20

0

[color=#aa0000]Не забывайте нажимать кнопку "Вопрос Решён" под сообщением, которое решило Вашу проблему.[/color]

Наверх

#7 nickolas

Topic Starter
JBZoo User (rus)
Общий рейтинг: 0
сообщений: 49
топиков: 17

Отправлено 12 January 2014 - 22:39

-

- <metadata>

- <layout name="default">

<name>Default</name>

<description>This is the default layout to render an item in the module themes.</description>

</layout>

- <layout name="layout2">

<name>Layout 2</name>

<description>This is an alternative layout to render an item in the module themes.</description>

</layout>

- <layout name="layout3">

<name>Layout 3</name>

<description>This is an alternative layout to render an item in the module themes.</description>

</layout>

- <layout name="list-h">

<description>This is an alternative layout to render an item in the module themes.</description>

</layout>

- <layout name="uikit">

<name>UIkit</name>

<description>This is an UIkit layout to render an item in the module themes.</description>

</layout>

</metadata>

- <positions layout="default">

<position name="title">Title</position>