Варианты вызова модуля в шаблонах

По мотивам — Различные условия в шаблонах

Варианты вызова модуля в шаблонах компонента Jshop

как вызвать модуль, например, в шаблоне категории или товара, 3 способа
1. Вывод конкретного модуля, на примере модуля меток

Код
<?php echo JHTML::_('content.prepare', '{loadmodule mod_jshopping_label_products}'); ?>

2. Вывод любого (всех) модулей, опубликованных в конкретной позиции — bottom

Код
<?php echo JHTML::_('content.prepare', '{loadposition bottom}'); ?>

3. Еще вариант вызова модулей по позиции

Код
<?php  $modules = JModuleHelper::getModules('Указать позицию модулей');
if ($modules && is_array($modules)) {
	foreach ($modules as $module) {
		//заголовок 
		echo $module->title;
		//контент
		echo JModuleHelper::renderModule($module);
	};
} ?>

Различные условия в шаблоне Joomla (templates/ВАШ_Шаблон/index.php)

1. Получаем необходимые параметры

Перед составлением условий, рекомендую — отключить SEF, тогда будет видно в URL какие у вас параметры

Код
$input = JFactory::getApplication()->input;
$option = $input->getCmd('option', '');
$controller = $input->getCmd('controller', '');

$option определяет компонент, в нашем случае $option это ‘com_jshopping’
$controller работает уже внутри компонента — это может быть ‘category’, ‘product’, ‘cart’ и другое; все это можете узнать отключив SEF в настройках и посмотрев чему равен $controller (в адресной строке) на интересующих вас страницах.

Логические операторы
(для совсем новичков, чтоб вы сами могли составлять условия)

логические операторы

Примеры для шаблона Joomla (templates/ВАШ_Шаблон/index.php)

1. Компонент Jshop установлен как главный пункт меню (для красивых ссылок, допустим), но не хотим выводить его на главной

Код
<?php if (JURI::current()!= JURI::base()):?> //само условие
<jdoc:include type="component" /> //непосредственно вывод компонента
<?php endif;?>

2. Позицию модуля не показывать в корзине и при оформлении заказа

Код
<?php if ( $option == 'com_jshopping' && $controller != 'cart' && $controller != 'checkout' ) : ?>
<jdoc:include type="modules" name="left" />
<?php endif; ?>

3. Показать модуль только в категории, у которой ID=5

Код
<?php if ( $option == 'com_jshopping' && $controller == 'category' && $category_id == '5') : ?>
<jdoc:include type="modules" name="left" />
<?php endif; ?>

тут новая переменная — $category_id, поэтому в самом начале ее тоже нужно определить

Код:
$category_id = $input->getCmd('category_id', '');

и т.д., думаю, смысл понятен — можно составлять различные комбинации

Различные условия в шаблонах компонента Joomshopping

Первым делом переопределяем шаблоны —  всю папку /components/com_jshopping/templates/default/ копируем, переименовываем в com_jshopping и загружаем по адресу /templates/ваш_шаблон/html/*

1. Выводить описание категории только на первой странице (на второй и последующих — описания не будет)
/templates/ваш_шаблон/html/com_jshopping/category/category_default.php

Код
<?php 
        $input = JFactory::getApplication()->input;
	$start = $input->getCmd('limitstart', 0);
	$option = $input->getCmd('option', '');
	If (!$start && $option == 'com_jshopping'){ ?>
	<?php print $this->category->description?> //описание категории товаров
<?php } ?>

2. Выводить что угодно в магазине только для авторизованных пользователей

Код
<?php
$user = JFactory::getUser();
if ($user->get('guest') == '1') { } else { ?>
//тут что-то выводим (например цена для оптовиков)
<?php } ?>

В основном мануал собран из тех решений что уже встречались на форуме, для вашего удобства — всё в одном месте, довольно подробно, с пояснениями, — поэтому не стесняйтесь — экспериментируйте с условиями

Знакомство с Parallax Scrolling

Знакомство с Parallax Scrolling перевод

Любой, кто играл или наблюдал за игрой друзей, либо в принципе видел игры, которые были выпущены в 80-90-х годах, должны быть знакомы с техникой параллакс-скроллинга.

Вспомните такие игры, как Mario Bros, Streets of Rage, Mortal Kombat, Turtles in Time или оригинальную игру Moon Patrol. В этих играх техника параллакса наблюдается в тот момент, когда несколько фоновых слоев с различными текстурами двигаются с разной скоростью, что создает эффект трехмерного пространства.

Почему я начал говорить о ретро-играх в статье о веб-разработке? Самым простым ответом мог бы быть «потому что они клевые», но нет. Параллакс-скроллинг является классным дизайнерским концептом, который прокладывает свой путь в мир веб-дизайна. Nike были одними из первых, кто использовал эту технику с большим успехом, когда они наняли маркетинговых гигантов Weiden and Kennedy для разработки их оригинального сайта Nike Better World. Сайт Nike Better World с того времени был обновлен и заменен на новый, однако есть другой сайт, довольно похожий на то, как выглядел первый параллакс-дизайн от Nike — сайт о спортивных напитках Activate.



Наверное, вы заметили, что во время прокрутки страницы сайта вниз несколько различных элементов, находящихся на этой странице, двигаются с разной скоростью. Давайте для примера возьмем страницу, отображенную на картинке сверху. По мере прокрутки страницы вниз вы увидите, что голубые точки в фоне (те, которые немного размыты), двигаются с той же скоростью, что и скроллбар. Также, вы увидите, что группа голубых точек, которые более сфокусированы и лежат на переднем плане, двигаются с немного большей скоростью, чем скроллбар. Быстрее этих точек двигается текст “0 SUGAR | 0 CALORIES | NATURALLY SWEETENED” и главный заголовок страницы “Products”. И, наконец, есть изображения самого продукта, как маленькие и расфокусированные в фоне, так и большие, сфокусированные и лежащие на переднем плане. Фоновые изображения продуктов двигаются с той же скоростью, что и текст, в то время как изображения продуктов на переднем плане двигаются быстрее этого текста. Это все и является идеальной демонстрацией параллакс-скроллинга, когда разные слои изображений накладываются друг на друга и все движутся с разной скоростью при прокрутке страницы, создавая эффект трехмерности.

Параллакс-скроллинг не ограничивается только вертикальным скроллом страницы или скроллингом по прямой линии. Отдадим право Nintendo для демонстрации идеального примера, подтверждающего это утверждение. Вспомните ранние игры Nintendo, где наши герои обычно двигались горизонтально слева направо вдоль экрана, а не вертикально вниз, как мы видели это на сайте Activate выше. Прокатитесь на MarkioKart Wii и давайте поговорим о некоторых клевых штуках, которые мы там можно увидеть.

Первую вещь, которую вы заметите, это направление скроллинга страницы — оно не вертикальное, а как сказано выше, а изначально горизонтальное. Конечно, это круто, но это также не новый концепт. Также, вы заметите параллакс-эффект с динозавром Йоши и панцирями на фоне, Марио и Луиджи на переднем плане и основным контентом, которые смещаются с разной скоростью при прокрутке. Но как только вы доедете до страниц #highlights и #attack, траектория смещения перестанет быть идеально горизонтальной. То же самое касается перехода между страницами #rediscover и #snes. Изображения не только сохраняют свою разную скорость смещения, но и меняют общее направление с горизонтального на вертикальное.

Стоит также отметить, что использование эффекта параллакса на вашем сайте не должно быть ограничено лишь возможностью создания искусственного 3D-эффекта. Сайт немецкой студии веб-дизайна Webseitenfactory является примером того, как можно использовать параллакс для добавления различных эффектов на страницу сайта, например движение иконок по разным траекториям, их увеличение и уменьшение по мере скроллинга сайта.

Параллакс-скроллинг также может помочь оживить сайт, на котором не особо много контента. Что если весь ваш сайт состоит из mission statement, или раздела about us, плюс контактная информация? Скорее всего, вы бы могли сделать это одной страницей и при определенных условиях у вас бы получился неплохой одностраничный сайт, но запомнится ли он посетителям? Скорее всего, нет. Но что если добавить к нему немного параллакса, как это сделал народ на Spring / Summer ?

Моим первым впечатлением было “О, этот сайт выглядит симпатично”. Но когда я начал его скролить, впечатление сразу же стало “Вау, этот сайт крут!”. Добавление простого параллакс-эффекта как раз делает разницу между неплохим и запоминающимся.

Параллакс-скроллинг — это хороший трюк, который можно держать в рукаве. И его всегда можно применить независимо от того, делаете ли вы сложный мультистраничный сайт, или же простой одностраничный сайт-визитку.

Примеры сайтов с параллаксом

Некоторые из них очень крутые, рекомендую ознакомиться:

Инструменты для создания параллакс-эффектов:

Туториалы по созданию сайтов с параллакс-эффектами (англ.):

Автоматическая HTML/CSS верстка сайта — PSD to HTML Converter

Не хочешь париться с версткой  — плати бабло, да не фрилансеру а сервису. Очень круто, но сколько же дизайнеру отдашь, чтобы по правилам все сделал ?

 

Автоматическая HTML/CSS верстка сайта — PSD to HTML Converter.