Как настроить в шаблоне галерею с большой картинкой и превьюшками?

passshok

Новичок
4
0 / 0

Как настроить в шаблоне галерею с большой картинкой и превьюшками?

« : 21.07.2012, 08:19:52 »

Добрый день, форумчане!

Я тут новенький, буду рад если примите меня в ваше сообщество.

Вопрос у меня такой. Есть сайт на Joomla 1.7.3. Нужно сделать для модуля ZOO вывод страницы продукта в таком виде как на этом сайте . В левой колонке должно быть большое изображение и внизу превьюшки, по нажатию на которые большое изображение меняется. В идеале приделать к большому изображению magiczoomplus. Сейчас же на моём сайте всё это выводится как статичный контент вбитый в поле Description.

Добавил в шаблон модули Image и Gallery. Не могу понять, как их связать так чтобы они работали как единое целое и как к ним приделать magiczoomplus.

Подскажите как это осуществить!

Благодарю.

Записан

passshok

Новичок
4
0 / 0

Re: Как настроить в шаблоне галерею с большой

« Ответ #1 : 21.07.2012, 12:51:13 »

Сделал так. Добавил в имеющийся плагин вид отображение галереи.

В plugins/system/widgetkit_zoo/elements/gallery добавил опцию custom:

Код

		<param name="mode" type="list" default="lightbox" label="Mode" description="The gallery mode">
			<option value="lightbox">Lightbox</option>
			<option value="slideshow">Slideshow</option>
			<option value="custom">Custom</option>
		</param>

Скопировал и изменил файл tmpl/lightbox.php на tmpl/custom.php следующего вида:

Код

<?php
/**
* @package   Widgetkit
* @author    YOOtheme http://www.yootheme.com
* @copyright Copyright (C) YOOtheme GmbH
* @license   YOOtheme Proprietary Use License (http://www.yootheme.com/license)
*/

// no direct access
defined('_JEXEC') or die('Restricted access');

$css_classes  = ($params->get('corners', 'square') == 'round')? 'round ' : '';
$css_classes .= ($params->get('effect') == 'zoom')? 'zoom ' : '';
$css_classes .= ($params->get('margin'))? 'margin ' : '';

$id = $this->identifier.'-'.uniqid();
$max_width = (int) $params->get('slideshow_width');
$max_height = (int) $params->get('slideshow_height');

?>
<div class="zoo-gallery" id="<?php echo $id; ?>">
	<div class="zoo-gallery-wall clearfix <?php echo $css_classes; ?>">

    <?php $count = 0; ?>
		<?php foreach ($thumbs as $image) : ?>

			<?php
				/* Prepare Image */
        $content = '<img src="'.$image['thumb'].'" alt="'.$image['filename'].'" />';
			?>
      
      <?php
        if ($count == 0) {
      ?>
      <div id="bigimage" style="clear: both;">
        <a id="<?=$this->identifier?>" class="MagicZoomPlus" rel="zoom-width: 400;" href="<?php echo $image['img']; ?>" style="max-width:<?=$max_width?>px; max-height:<?=$max_height?>px;">
          <img style="max-width:<?=$max_width?>px; max-height:<?=$max_height?>px;" src="<?=$image['img']?>"/>
        </a>
      </div>
      <div id="thumbs" style="clear: both;">
      <?php
        }
      ?>
			<a rel="zoom-id:<?=$this->identifier?>" rev="<?=$image['img']?>" href="<?php echo $image['img']; ?>">
			<?php echo $content; ?>
			</a>

    <?php
		  $count++;
	  ?>

		<?php endforeach; ?>
		</div>

	</div>
</div>
<?php
	if ($params->get('effect') == 'opacity') {
		$this->app->document->addScriptDeclaration(sprintf("jQuery(function($) { $('%s').opacity(); });", '#'.$id .' .thumb'));
	}
 ?>

Записан

passshok

Новичок
4
0 / 0

Re: Как настроить в шаблоне галерею с большой

« Ответ #2 : 16.08.2012, 13:50:03 »

Не могу отправлять личные сообщения, поэтому пишу тут. Чтобы выбрать режим custom, нужно зайти в Zoo, нажать на шестерёнку, нажать Full, нажать карандаш на блоке Галерея, выбрать из списка Режим (один из трёх) «Пользовательский». Это и будет он.

p.s. Если использовать этот вариант галереи, то нужно дописать CSS чтобы галерея и миниатюры отображались корректно.

Записан

gelios

Осваиваюсь на форуме
10
0 / 0

Re: Как настроить в шаблоне галерею с большой картинкой и превьюшками?

« Ответ #3 : 09.06.2013, 00:58:49 »

подскажи, пожалуйста, в какую строчку ты вставлял этот код?

Записан

Как правильно вставлять позиции модулей в шаблоне под HTML5? Автор borro	Ответов: 1 Просмотров: 6047	11.04.2015, 12:06:17 от AlekVolsk
Как изменить ширину колонок в Gantry 4 шаблоне? Автор borro	Ответов: 1 Просмотров: 6523	31.03.2014, 10:20:57 от borro
Отображение лого в адаптивном шаблоне на Gantry при разных разрешениях Автор borro	Ответов: 1 Просмотров: 6311	20.03.2014, 12:34:13 от ShfVD
Трансформация видео в шаблоне с использованием Bootstrap Автор Sergey-N81	Ответов: 1 Просмотров: 2414	23.05.2013, 16:26:20 от Sergey-N81
Аналог фрейма в шаблоне? Автор dolci2006	Ответов: 1 Просмотров: 2012	30.01.2013, 15:24:31 от Artem4eg

Как настроить в шаблоне галерею с большой картинкой и превьюшками? - Joomla 2.5: Разработка шаблонов

Новости Joomla

Вышли релизы безопасности Joomla 6.1.3 и Joomla 5.4.8

👩‍💻 WT Otpravkapochtaru - библиотека сервиса Отправка Почты России для Joomla-разработчиков.

👩‍💻 В Joomla 6.2 появятся встроенный функционал мультикатегорий.

passshok

Как настроить в шаблоне галерею с большой картинкой и превьюшками?

passshok

Re: Как настроить в шаблоне галерею с большой

passshok

Re: Как настроить в шаблоне галерею с большой

gelios

Re: Как настроить в шаблоне галерею с большой картинкой и превьюшками?

Похожие темы