Перейти к содержимому


Рейтинг Контента


#54517 Оптимизируем код, убираем дубли

Написано i001 на 17 December 2014 - 12:58

Пост написан в ознакомительных целях и призван развеять миф что joomla плохой движок, а также помочь в базовой настройке сайта на jbzoo, дабы поисковики его полюбили.

 

Убираем дубли

Открываем .htaccess в корне сайта и добавляем (site.ru меняем на ваш сайт)

RewriteEngine On
RewriteCond %{HTTP_HOST} ^www.site.ru$ [NC]
RewriteRule ^(.*)$ http://site.ru/$1 [R=301,L]

RewriteBase /
RewriteCond %{THE_REQUEST} ^[A-Z]{3,9}\ /index\.php\ HTTP/
RewriteRule ^index\.php$ / [R=301,L]

RewriteCond %{HTTP_HOST} !^site\.ru$
RewriteRule ^(.*)$ http://site.ru/$1 [L,R=301]

RewriteRule ^index.php/(.*)$ http://site.ru/$1 [R=permanent,L]

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

 

2. Закрываем от индексации страницы пагинации

открываем файл 

 

/media/zoo/applications/jbuniversal/framework/helpers/jbdoc.php

после

public function noindex()
    {
        $doc = JFactory::getDocument();

        // set meta
        $doc->setMetadata('robots', 'noindex, nofollow');

        // remove canonical
        unset($doc->_links[array_search(array(
            'relation' => 'canonical',
            'relType'  => 'rel',
            'attribs'  => array()
        ), $doc->_links)]);
    }

вставляем еще одну функцию

 public function noindex1()
    {
        $doc = JFactory::getDocument();

        // set meta
        $doc->setMetadata('robots', 'noindex, follow');

        // remove canonical
        unset($doc->_links[array_search(array(
            'relation' => 'canonical',
            'relType'  => 'rel',
            'attribs'  => array()
        ), $doc->_links)]);
    }

Далее открываем файл

 

/administrator/components/com_zoo/framework/classes/pagination.php

ищем строку

 if ($this->_current > 1) {

и в начало добавляем

$this->app->jbdoc->noindex1();

должно получится такое условие

 if ($this->_current > 1) {
                $this->app->jbdoc->noindex1();
                $link  = $url;
                $html .= '<a class="start" href="'.JRoute::_($link).'">&lt;&lt;</a>&nbsp;';
                $link  = $this->_current - 1 == 1 ? $url : $this->link($url, $this->_name.'='.($this->_current - 1));
                $html .= '<a class="previous" href="'.JRoute::_($link).'">&lt;</a>&nbsp;';
            }

Проверяем страницы пагинации, на всех кроме первой должно появится

 <meta name="robots" content="noindex, follow" />

3. Меняем меты в альфаиндексе (по мне не очень правильно сделано сейчас)

по умолчанию стоит тег

<meta name="robots" content="noindex, nofollow" />

Считаю более правильно разрешить роботу там шататься но не индексировать

 

открываем файл 

media/zoo/applications/jbuniversal/templates/catalog/alphaindex.php

 и меняем в начале

$this->app->jbdoc->noindex();

на нашу функцию

$this->app->jbdoc->noindex1();

4. Делаем сайт приятнее для роботов и в какой то части более приятные снипеты - добавляем разметку под статьи (подчеркну именно под статьи, если у вас товары рецепты и т.д то все делается по аналогии но с другими атрибутами, подробней здесь http://schema.org/)

 

4.1 Категории

media/zoo/applications/jbuniversal/templates/catalog/renderer/category/_default.php

 

в основной div добавляем обозначение разметки itemscope itemtype=«http://schema.org/Article"

if ((int)$vars['params']->get('template.category_show', 1)) : ?>
    <div class="category rborder alias-<?php echo $category->alias; ?>" itemscope itemtype=«http://schema.org/Article">

ниже для h1 добавляем itemprop="name"

 <h1 itemprop="name" class="title"><?php echo $title; ?></h1>

ниже для картинки также добавляем атрибут itemprop="image"

<div class="image-full align-<?php echo $vars['params']->get('template.category_image_align', 'left'); ?>">
                <img itemprop="image" src="<?php echo $image['src']; ?>" <?php echo $image['width_height']; ?>
                     title="<?php echo $category->name; ?>" alt="<?php echo $category->name; ?>"/>
            </div>

4.2 Главная страница

 

Делаем все по аналогии в файле media/zoo/applications/jbuniversal/templates/catalog/renderer/frontpage/_default.php

 

4.3 Страницы full

 

media/zoo/applications/jbuniversal/templates/catalog/renderer/item/ваш_тип/full.php

 

оборачиваем вывод в 

<div itemscope itemtype=«http://schema.org/Article">
вывод позиций
</div>

Позиция которая выводит текстовую часть добавляем атрибут itemprop="description"

if ($this->checkPosition(‘позиция_текста')) 
{
	echo '<div itemprop="description">'.$this->renderPosition('позиция_текста').'</div>';
}

в файле /media/zoo/applications/jbuniversal/elements/jbimage/tmpl/jbimage-default.php 

 

добавляем атрибут для изображений itemprop=«image"

echo '<img itemprop="image" ' . $imageAttrs . ' /> ' . "\n";

Обратите внимание что данные атрибут добавится всем изображением которые выводятся элементом jbimage в шаблоне default (просто картинка без ссылок и лайтбокса)

 

5. Добавляем разметку в хлебные крошки 

 

modules/mod_breadcrumbs/tmpl/default.php (если не переопределен шаблоном который используется вашим сайтом)

меняем код на этот

<?php
/**
 * @package     Joomla.Site
 * @subpackage  mod_breadcrumbs
 *
 * @copyright   Copyright (C) 2005 - 2013 Open Source Matters, Inc. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 */

defined('_JEXEC') or die;

JHtml::_('bootstrap.tooltip');

?>

<ul class="breadcrumb<?php echo $moduleclass_sfx; ?>">
	<?php
	if ($params->get('showHere', 1))
	{
		echo '<li itemscope itemtype="http://data-vocabulary.org/Breadcrumb" class="active"><span class="divider icon-location hasTooltip" title="' . JText::_('MOD_BREADCRUMBS_HERE') . '"></span></li>';
	}

	// Get rid of duplicated entries on trail including home page when using multilanguage
	for ($i = 0; $i < $count; $i++)
	{
		if ($i == 1 && !empty($list[$i]->link) && !empty($list[$i - 1]->link) && $list[$i]->link == $list[$i - 1]->link)
		{
			unset($list[$i]);
		}
	}

	// Find last and penultimate items in breadcrumbs list
	end($list);
	$last_item_key = key($list);
	prev($list);
	$penult_item_key = key($list);

	// Make a link if not the last item in the breadcrumbs
	$show_last = $params->get('showLast', 1);

	// Generate the trail
	foreach ($list as $key => $item) :
	if ($key != $last_item_key)
	{
		// Render all but last item - along with separator
		echo '<li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">';
		if (!empty($item->link))
		{
			echo '<a href="' . $item->link . '" class="pathway" itemprop="url"><span itemprop="title">' . $item->name . '</span></a>';
		}
		else
		{
			echo '<span itemprop="title">' . $item->name . '</span>';
		}

		if (($key != $penult_item_key) || $show_last)
		{
			echo '<span class="divider">' . $separator . '</span>';
		}

		echo '</li>';
	}
	elseif ($show_last)
	{
		// Render last item if reqd.
		echo '<li itemscope itemtype="http://data-vocabulary.org/Breadcrumb" class="active">';
		echo '<span itemprop="title">' . $item->name . '</span>';
		echo '</li>';
	}
	endforeach; ?>
</ul>

6. robotx.txt

 

Если используется стандартный поиск joomla то закрываем его 

Disallow: /component/search/

и в самом низу прописываем основной хост сайта (site.ru меняем на ваш сайт)

Host: site.ru

По умолчанию от индексации закрыты картинки, я эту строку всегда убираю

Disallow: /images/

При обновлении joomla zoo и jbzoo какие то изменения затрутся в зависимости от того что обновляли

 

7. Карта сайта. По моему мнению полезна при стартовой индексации свежего сайта. На каких то свои сайтах я ее ставил на каких то нет, разницы особой не увидел.

 

PS это всего лишь часть того что можно сделать с сайтом чтобы он стал лучше восприниматься ПС


  • 20


#19240 Новый способ оплаты - Privat24 (liqPay)

Написано werewolfgsm на 11 June 2013 - 19:41

Сделал оплату через Privat24 (liqPay).
Все изменения производились в файле media\zoo\applications\jbuniversal\framework\controllers\payment.php
Делал на основе Робокассы (по сути переделал робокассу, теперь у меня ее нет)
В настройках корзины, в полях Робокассы указываем id мерчанта (login) и сигнатуру (password 1) и включаем робокассу
 
далее файл payment.php
17 строка: const TYPE_ROBOX  = 'Liqpay.com';
далее функция function index()
в ней формируется запрос на платежную систему
// robox замена на Privat24
if ((int)$this->appParams->get('global.jbzoo_cart_config.robox-enabled', 0)) {

    $params               = new stdClass();
    // id мерчанта
    $params->login        = JString::trim($this->appParams->get('global.jbzoo_cart_config.robox-login'));

    // подпись мерчанта
    $params->password1    = JString::trim($this->appParams->get('global.jbzoo_cart_config.robox-password1'));
    
    // берем поле тефефон клиента из формы заказа
    $params->phone        = $this->order->getElement('c1b20e16-3869-40db-95b9-2c8fd0a8649f')->get('value');
    $params->summ         = $totalSumm;
    $params->orderId      = $this->orderId;
    $params->summFormated = $totalSummFormated;

    // формируем xml liqpay
    // поля operation_xml
    $params->xml_operation_xml = '<request>
            <version>1.2</version>
            <merchant_id>'.$params->login.'</merchant_id>
            <result_url>{страница возврата после платежа}</result_url>
            <server_url>{страница на которую приходит callback от платежки}</server_url>
            <order_id>'.$this->orderId.'</order_id>
            <amount>'.$totalSumm.'</amount>
            <currency>UAH</currency>
            <description>OrderID #'.$this->orderId.' Podarochniy sertifikat na summu: '.$totalSumm.' UAH</description>
            <default_phone>'.$params->phone.'</default_phone>
            <pay_way>card</pay_way>
        </request>';

    // Создание подписи signature
    $params->sign = base64_encode(sha1($params->password1.$params->xml_operation_xml.$params->password1,1));

    //Запаковка XML
    $params->xml_encoded = base64_encode($params->xml_operation_xml);

    $this->payments['robox'] = $this->app->data->create($params);
}
После этого правим функцию _init
нам надо получить order_id который приходит от привата в массиве post в закодированном виде (в отличии от робокассы и интеркассы)
строку
if ($invId = (int)$this->_jbreq->get('InvId')) {
меняем на
$this->appParams = $this->application->getParams();

if (isset($_POST['operation_xml']) && isset($_POST['signature'])){
    
    $operation_xml = $_POST['operation_xml'];
    $signature_input = $_POST['signature'];
        
    $merc_sig    = JString::trim($this->appParams->get('global.jbzoo_cart_config.robox-password1'));
    $xml_decoded=base64_decode($operation_xml);
    $my_signature_decoded = base64_encode(sha1($merc_sig . $xml_decoded . $merc_sig, 1)); 
        
    if ($signature_input === $my_signature_decoded) { 
        if ($xml = simplexml_load_string($xml_decoded)) {
            foreach($xml as $xmlRow) {
                if ($xmlRow->getName() == 'order_id') $this->orderId = (int)$xmlRow;
                if ($xmlRow->getName() == 'status')	$status = (string)$xmlRow;
            }
        }
        $this->systemType = self::TYPE_ROBOX;
    }			
} else if ($invId = (int)$this->_jbreq->get('InvId')) {
далее функция  paymentCallback()
 
меняем всю ветку по робокассе:
if ($this->systemType == self::TYPE_ROBOX) {
на:
if ($this->systemType == self::TYPE_ROBOX) {
    if (isset($_POST['operation_xml']) && isset($_POST['signature'])){
        $operation_xml = $_POST['operation_xml'];
        $signature_input = $_POST['signature'];
        
        $merc_sig    = JString::trim($this->appParams->get('global.jbzoo_cart_config.robox-password1'));
        $xml_decoded=base64_decode($operation_xml);
        $my_signature_decoded = base64_encode(sha1($merc_sig . $xml_decoded . $merc_sig, 1)); // формируем свою подпись для проверки
    
        if ($signature_input === $my_signature_decoded) { // подпись аутентична

            if ($xml = simplexml_load_string($xml_decoded)) { // парсим XML
                foreach($xml as $xmlRow) {
                    if ($xmlRow->getName() == 'order_id') $this->orderId = (int)$xmlRow;
                    if ($xmlRow->getName() == 'status') $status = (string)$xmlRow;
                }
            }
            
            // get request vars									
            $args = array(
                'date'            => $this->app->date->create()->toSQL(),
                'system'          => $this->systemType,
                'additionalState' => $status
            );
            
            // execute callback method
            $this->orderDetails->callback('paymentCallback', $args);

            jexit('OK' . $this->orderId);		
        } else {
            throw new PaymentJBUniversalControllerException('No valid hash');
        }	
        
    } else {
        throw new PaymentJBUniversalControllerException('Empty data from liqpay');
    }

} else if ($this->systemType == self::TYPE_IKASSA) {
Все. После 70+ тренеровочных оплат по 3 копейки (ну нет у привата тестового режима) я смог заставить принимать и правильно обрабываться каллбек.
 
Проблема была в том, что после _init функция обрывалась и не возвращалась в callback
Когда я получил id заказа в _init я смог продвинуться дальше.
 
Надеюсь комуто пригодится.
  • 20


#19684 Отправка e-mail покупателю

Написано fiction13 на 20 June 2013 - 06:33

Здравствуйте!
 
Сегодня столкнулся с невозможностью отправки сообщения о заказа на введенный пользователем e-mail. Это касается как гостевого заказа, так и заказа от зарегистрированного пользователя (не у всех пользователей правильные адреса почты из-за регистрации на сайте через соц. сети).
 
Чтобы поправить это (пока разработчики не выпустили свой вариант), нужно сделать несколько простых шагов.
 
1. Создать элемент E-mail в форму подачи заказа Order form.
2. Посмотреть ID созданного элемента (я делал это через базу данных).
3. Поправить файл jbevent.basket.php:
вместо e-mail, которое берется из профиля зарегистрированного пользователя
$userEmail  = JFactory::getUser()->email;
указать, откуда мы хотим брать этот e-mail
$userEmail = $item->elements['ID созданного элемента E-mail'][0]['value'];
Все, должно работать. У меня работает  ;D
 
Может кому пригодится.
  • 19


#31963 AJAX фильтр

Написано Cheren-dow на 26 November 2013 - 10:43

Модификация модуля mod_jbzoo_search. Отправка данных с формы фильтра и подгрузка материалов без перезагрузки страницы.

 

Есть в модуле фильтра опция авто-отправки формы

aa633d_200x0.png
 
Все хорошо, НО при каждом действии перезагружается(отправляются данные) страница, а мне этого не надо было. Вот и решил я немного изменить скрипт авто-отправки и сделать это на AJAX.

 

-= 1. Создаем маленький jQuery плагин =-

Переходим в папку

сайт\modules\mod_jbzoo_search

Создадим папку js, а в ней файл default.js

091c23_200x0.png

 

В default.js добавляем следующий код

jQuery(function($){
    $.fn.JBZooAjaxUpdateContent = function(options){

        var settings = $.extend( {
            'url'    : '',
            'params' : '',
            'formId' : '',
            'updateBlock' : '#yoo-zoo'
        }, options);

        $('body').append( "<div id='fancybox-loading'><div></div></div>");
        $.ajax({
            url : settings.url + settings.params + '&tmpl=raw',
            type: 'get',
            dataType: 'html',
            success: function(data){
                $('#fancybox-loading').remove();
                $(settings.updateBlock).html($(data).html());
            }
        });

    };
}); 

 
-= 2. Подключаем наш jQuery плагин =-

В файле шаблона

сайт\modules\mod_jbzoo_search\tmpl\default.php 

находим строку

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

после нее вставляем(подключаем js который мы создали) следующий код

$zoo->document->addScript('mod_jbzoo_search:js/default.js');

-= 3. Инициализация плагина =-

Ниже находим следующий код и меняем его

<?php if ((int)$params->get('autosubmit', 0)) : ?>
    <script type="text/javascript">
        jQuery(function ($) {
            $('#<?php echo $formId;?> select, #<?php echo $formId;?> input[type=radio], #<?php echo $formId;?> input[type=checkbox]').change(function () {
                $(this).closest("form").submit();
            });
        });
    </script>
<?php endif; ?>

на

<?php if ((int)$params->get('autosubmit', 0)) : ?>
    <script type="text/javascript">
        jQuery(function ($) {
            $('#<?php echo $formId;?> select, #<?php echo $formId;?> input[type=radio], #<?php echo $formId;?> input[type=checkbox]').change(function () {
                $.fn.JBZooAjaxUpdateContent({
                    'url'   : '<?php echo JRoute::_('index.php?Itemid=' . $params->get('menuitem', JRequest::getVar('Itemid'))); ?>?',
                    'params': $('#<?php echo $formId;?>').serialize(),
                    'formId': '<?php echo $formId;?>'
                });
            });
        });
    </script>
<?php endif; ?>

И радуемся. Форма отправляется через AJAX, пока сервер думает мы любуемся анимацией, а как данные пришли в указанный блок(в примере это корневой блок контента ZOO) подгружаются найденные материалы.

 

Что нового?

1. По большому счету изменения не такие уж и большие js код переделан в маленький jQuery плагин и теперь находится в отдельном файле.

 

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

 

3. Подгрузка контента происходит теперь быстрее, за счет того что не подгружается лишний контент с сайта.

 

По умолчанию обновляется блок с id yoo-zoo

6d3bab_200x0.png

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

8e8495_200x0.png

Теперь будет искаться и производиться загрузка контента в блок с id yoo-zoo-my-block

 

Подводные камни?

Наверно самый большой камень - это то что ни какие кнопки(добавить в корзину,избранное,сравнение , то же самое касается кнопок удаления и увеличения картинок FancyBox) на которые повешены JS скрипты работать внутри подгруженного контента не будут.

 

 

 

Измененные и добавленные файлы:

сайт\modules\mod_jbzoo_search\tmpl\default.php // изменен
сайт\modules\mod_jbzoo_search\js\default.js    // добавлен

Для тех кто ленится что то сделать руками сделал патч:

Прикрепленный файл  mod_jbzoo_search_patch_for_v2.1.2.pro.zip   3.57К   397 Количество загрузок:

 

 

 

ВНИМАНИЕ!!!

  • Будьте внимательны при замене файлов.
  • Проверьте с начало на тестовом сайте а уже потом загружайте на рабочий сайт.
  • Это решение(модификация) тестировалось на 
    Joomla: 3.1.5
    JBZoo: 2.1.2 Pro
    Zoo: 3.0.13,

    подойдут так же ранние версии начиная с v 2.0.X.
  • Не забывайте - это решение(модификация) и при следующих обновлениях эти изменения могут пострадать.
  • При появлении проблем Тех.Поддержка ответственности не несет. 

Изменено: 02.05.2014


  • 18


#88259 Доработка фильтра - AJAX подгрузка количества результатов и сортировка

Написано fiction13 на 14 June 2016 - 09:38

Привет, читатель.

 

Сегодня мы поговорим о фильтре и немного его доработаем. Дорабатывать будем фильтр в части AJAX подгрузки количества результатов, как в лучших магазинах Лондона, а также немного доработаем сортировку (уберем чексбокс обратный порядок и добавим в селекс выбор по возрастанию и убыванию).

 

Сразу скриншот, чтобы Вы поняли, о чем идет речь.

 

1.jpg

 

В обоих случаях править будем хелпер модуля фильтра, расположенный по адресу: г. Москва /modules/mod_jbzoo_search/helper.php.

 

От слов к делу.

 

AJAX подгрузка количества результатов

 

За подгрузку количества результатов будет отвечать следующий кусок кода

JFactory::getDocument()->addScriptDeclaration("
            jQuery(document).ready(function($){
                $('.jbfilter input, .jbfilter select').on('change', function (event) {
                    var el = $(event.target);
                    flQuickResult(el);
                });

                $('.jbslider').on('change.JBZooSlider', function (event) {
                    var el = $(event.target);
                    flQuickResult(el);
                });

                function flQuickResult (el) {
                    $('.flQuickResult').remove();
                    $.get(window.location.href.split('?')[0] + '?' + $('.jbfilter').serialize() + '&tmpl=component', function(data) {
                        $('.flQuickResult').remove();
                        var count = $(data).find('p').first().text().replace( /^\D+/g, '');

                        if (count) {
                            var title = flNumToStr(count, ['товар', ' товара', 'товаров']);
                            var text = 'Найдено ' + count + ' ' + title;
                            var button = '<input type=\"submit\" name=\"send-form\" value=\"Показать\" class=\"jsSubmit uk-button\">';
                        } else {
                            var text = 'Ничего не найдено';
                            var button = '<input type=\"reset\" name=\"reset-form\" value=\"Сбросить\" class=\"jsReset uk-button\">';
                        }

                        elPosition = el.position();
                        topPosition = elPosition.top - 49 + el.height()/2;

                        el.parent().append('<div class=\"flQuickResult\" style=\"top: ' + topPosition + 'px;\"><p>' + text + '</p>' + button + '</div>');
                    });
                }

                function flNumToStr(number, titles) {  
                    cases = [2, 0, 1, 1, 1, 2];  
                    return titles[ (number%100>4 && number%100<20)? 2 : cases[(number%10<5)?number%10:5] ];  
                }
            });
        ");

Его мы добавляем в конец функции _loadAssets(). Знающие люди смогут добавить его куда угодно, например, выцепить отсюда скрипт и добавить в свой js файл.

 

Немного CSS. Для фильтра, расположенного в левом сайдбаре

.flQuickResult {
  position: absolute;
  left: 180px;
  width: 180px;
  background: #333333;
  text-align: center;
  padding: 14px 18px;
  z-index: 100;
}
.flQuickResult:before {
    border: 7px solid;
    border-color: transparent #333 transparent transparent;
    display: block;
    left: -14px;
}
.flQuickResult:after, .flQuickResult:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    top: 40px;
}
.flQuickResult:after {
    left: -13px;
    border: 7px solid;
    border-color: transparent #333 transparent transparent;
}

И для фильтра, расположенного в правом сайдбаре

.flQuickResult {
  position: absolute;
  left: -210px;
  width: 180px;
  background: #333333;
  text-align: center;
  padding: 14px 18px;
  z-index: 100;
  box-sizing: border-box;

}
.flQuickResult:before {
    border: 7px solid;
    border-color: transparent transparent transparent #333;
    display: block;
    left: -14px;
}
.flQuickResult:after, .flQuickResult:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    top: 40px;
}
.flQuickResult:after {
    left: -13px;
    border: 7px solid;
    border-color: transparent transparent transparent #333;
}

Стили можно (нужно) поправить под себя, Вы уже не маленькие ;-) Да и куда добавлять стили, объяснять не буду. Я в Вас верю!

 

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

 

Очень простая магия.

 

Сортировка

 

За доработку сортировки отвечает другой код, вот такой

$optionsSorting = array();
            foreach ($options as $key => $value) {
                $optionsSorting[$key.'____asc'] = $value.' по возр.';
                $optionsSorting[$key.'____desc'] = $value.' по убыв.';
            }

            JFactory::getDocument()->addScriptDeclaration("
                jQuery(document).ready(function($){
                    $('#jbfilter-id-order').hide();
                    $('input[name=\"order[reverse]\"]').parent().hide();

                    $('#flFilterSortingSelect').on('change', function () {
                        var select = $(this);
                        var selectValue = select.val();
                        var orderOptions = selectValue.split('____');
                        var ordering = orderOptions[0];
                        var reverse = orderOptions[1];

                        console.info(ordering);
                        console.info(reverse);

                        $('#jbfilter-id-order').val(ordering);
                        if (reverse == 'desc') {
                            $('input[name=\"order[reverse]\"]').attr('checked', true);
                        } else {
                            $('input[name=\"order[reverse]\"]').attr('checked', false);
                        }

                        return false;
                    });
                });
            ");

            $html[] = $this->_jbhtml->select($optionsSorting, 'order[flSorting]', array(), $values->get('flSorting'), 'flFilterSortingSelect', true);

Его вставляем в функции getOrderings() перед

            html[] = $this->_jbhtml->select($options, 'order[field]', array(), $values->get('field'), 'jbfilter-id-order', true);

После этого селект со списком сортировок и чекбоксом превращается в селект с выбором сортировок по возрастанию и убыванию, а сами сортировки по прежнему добавляются из админки модуля фильтра.

 

Прикрепляю измененный файл хелпера, на всякий случай.

 

Прикрепленный файл  helper.zip   2.6К   381 Количество загрузок:

 

 

*************************************

 

Все это дело тестировалось на

Joomla 3+

JBZoo 2.2.7

 

Демо


  • 16


#57782 Что где лежит или файловая система

Написано Евгения на 10 February 2015 - 18:37

Вместо предисловия.
Это моя попытка несколько структурировать почерпнутые из форумных бдений пути к файлам. Данный пост будет редактироваться, дополняться и стремиться стать расширением официальной документации :) Прошу тапками не кидать.
 
В теме приветствуются КОНСТРУКТИВНЫЕ посты. Тут бесполезно спрашивать "где лежит". Создайте отдельную тему, вам ответят. И вот ответ, можно и нужно написать сюда с кратким описанием. Как вариант кинуть мне в личку.
 
На всякий случай, если кто не знает:
 

administrator/components/com_akeeba/backup

  - тут лежат ваши бэкапы, при наличии приложения Akeeba (https://www.akeebabackup.com/)

/templates/template_name

 - тут лежит ваш шаблон
 
 
Везде далее * - это /media/zoo/applications/jbuniversal
 

Шаблоны

*/templates/catalog/renderer/item

 - тут создаются новые шаблоны (или редактируются уже существующие) для типов материала (Product, blog, news etc.), такие как favorite, teaser, full и т.п.
Пошаговый урок
Ссылка на доку 
 

/modules/mod_jbzoo_search/renderer/item/

 - тут создаются новые шаблоны фильтров (или редактируются уже существующие), такие как Inline, Table, 2columns etc.

 

Полезная статья про:
Настройка фильтров для существующего каталога JBZoo
Доки:
Описание JBZoo Search
Основные параметры элементов фильтра
Документация по настройке полей и элементов от ZOO
Переиндексация базы данных

*\templates\catalog\renderer\category\

- шаблон вывода категорий

*/templates/catalog/renderer/comment/

 - шаблоны комментариев

*/templates/catalog/renderer/basket/_default.php

 - шаблон вывода таблицы с товарами в корзине

*/templates/catalog/renderer/item_columns/_default.php

 - формирование колонок товаров 

*\templates\*_TEMPLATE_*\renderer\basket-success\index.php

- шаблон страницы создания заказа. "Ваш заказ успешно создан" - это оттуда. ver 2.2

*/templates/*_TEMPLATE_*/renderer/payment_success/_default.php 

- шаблон успешной оплаты ver 2.2

*/templates/*_TEMPLATE_*/renderer/payment_fail/_default.php 

- шаблон ошибки при оплате ver 2.2

  
Письма

*/templates/catalog/renderer/item/order/

 - шаблон письма заказа

*/templates/catalog/mail.comment.admin.php

- письмо админу о добавлении нового / редактировании существующего комментария

*/templates/catalog/mail.comment.reply.php

- письмо подписавшемуся на свой комментарий

*/templates/catalog/mail.submission.new.php

- письмо о добавлении нового материала

/administrator/components/com_zoo/helpers/submission.php

- тема письма о новом материале "New submission notification"

/administrator/components/com_zoo/helpers/comment.php

- тема письма о добавлении комментария"Topic reply notification"
 
Письма для 2.2
 

media\zoo\applications\jbuniversal\templates-system\renderer\email\*Ваш шаблон*

- шаблон письма, если не переопределено.

media\zoo\applications\jbuniversal\framework\render

В шаблоне почты $this ссылается на объект класса EmailRenderer. Рендереры JBZoo лежат в этой папке.

Цепочка такова - элемент sendemail нотификации(notificiation) создает renderer.
Renderer парсит шаблон(Позиции), обращаясь к нашим элементам - 

media\zoo\applications\jbuniversal\cart-elements\email

В свою очередь, от полученных данных они отображают или не отображают контент.

Все остальное :)

*/jbuniversal/language/ru-RU

 - языковые константы (т.е. Цена (за 1шт.) меняется тут)

/language/ru-RU/ru-RU.com_zoo.ini 

- языковые константы Zoo (если вы что-то не смогли найти в JBZoo, посмотрите тут)

/components/com_zoo/renderer/element

 - шаблоны стилей позиций:
block.php — элементы внутри блока div, блоку можно указать class.
comma.php — внутри тега span, так же можно указать класс.
default.php — без форматирования — в строку.
hyphen.php — строку, разделяя дефисом «-».
inline.php — строку, разделяя запятой «,».
list.php — списком — li.
paragraph.php — элементы абзацами.
pipe.php — строку, разделяя «|».
Ссылка на доку
 

Файлы из 2.2

 

 

  1. Блок "таблица с товарами"
    */templates/catalog/renderer/basket/_form.php
    Стили:
    media/zoo/applications/jbuniversal/templates/uikit/assets/less 
  2. Блок "поля заказа"
    */templates/catalog/renderer/basket/_shipping.php
  3. Блок "сервис доставки"
    */templates/catalog/renderer/basket/_shipping.php

Блок "кнопки"

*/templates/catalog/renderer/basket/_buttons.php

Ошибка при создании заказа

*/templates/*_TEMPLATE_*/renderer/payment_fail/_default.php

Стили

*/assets/css/jbzoo.css

 - основные стили каталога ver. 2.1.5

*/assets/less

 - стили каталога для ver. 2.2
 

/modules/mod_jbzoo_category/assets/styles.less

 - стили категорий ver. 2.2
 

*/framework/helpers/jbmoney.php

 - валюты ver. 2.2

\media\zoo\applications\jbuniversal\templates\catalog\renderer\basket\_buttons.php

- тут важна единственная строка: 

<input type="submit" name="create" value="<?php echo JText::_('JBZOO_CART_SUBMIT'); ?>"class="jbbutton green big" />

Переопределяем класс стилей кнопки намертво. ver. 2.2

 

Изменение tab`ов в v.220-1

media/zoo/applications/jbuniversal/templates/uikit/renderer/item/full.php

Менять в двух местах в файле!!! :) До кучи, если вставляем новый таб, не забудьте прописать его тут:  

media/zoo/applications/jbuniversal/templates/uikit/renderer/item/positions.xml

Стили по аналогии с существующими.

 
 
 
Полезно

 

ОЧЕНЬ очень полезный урок по настройке, верстке, uikitи вообще полезно для общего развития. Еще на эту же тему можно почитать тут
 
Чтобы у вас заработал фильтр по категориям (запомни, блин Женя!!) нужно вставить в шаблон фильтра поле Item Category (Текущая категория (скрытое поле), Простой) и включить в модуле "Зависимость от категории"
 
Импорт на сайт проходит ТОЛЬКО в кодировке utf-8 без BOM. Такое умеет Open Office
Дока по Импорту (очень хорошая дока, между прочим)
 
Очень-очень полезная тема про:
CSS-фреймворки, гриды, скрипты, утилиты... и за Pure Дмитрию огроменное спасибо, да :) Мои пять копеек http://css-tricks.com/snippets/- всяко\разно фишки для html,javascript, css отобранные с демками. Прелесть в общем.
 
Сервера, apache, php5 - полезно читать тем, у кого планируются большие нагрузки, большие выгрузки и т.п.
 
Изменение стандартного профиля Joomla-пользователя - инструкция по добавлению к профилю своих полей, которые будут работать с 
JBZoo Userfields
 
Увеличение количества дополнительных параметров в Jbpriceadvance для версии 2.1.5

 

 

УСПЕШНАЯ ОПЛАТА И СОЗДАНИЕ заказа ver. 2.2

 
 
На правах рекламы:
В русском языке слова аккордЕон и инжЕнер пишутся с буквой Е.
 
Тут будут находиться разнообразные полезные темы, по настройке, шаблонизации и т.п. (Постараюсь выкладывать сразу с кодом)

 

В версии 2.1.5 есть такая штука, что номера заказов идут не по порядку. То есть он может в общем списке выкинуть штук 20-30. Это нормально. :) "Четкая нумерация появилась в версии 2.2.0+" (с) SmetDenis


  • 16


#19956 Ajax загрузка страниц

Написано fiction13 на 24 June 2013 - 13:49

Сразу дам линк на закрытую тему: линк
 
Решил создать тему, так как считаю, что это будет кому-нибудь полезно.
 
Сегодня решив сделать подгрузку товаров, увидел вышеупомянутую тему, сделав все по инструкции, конечно все получилось, но начались косяки, а именно: при включенном JS фиксе высоты колонок подгружаемые товары не были выровнены по высоте, никакая магия мне не помогла.
 
Именно поэтому в интернете нашелся другой скрипт, который выравнивает высоту колонок, и с которым не возникло проблем при подгрузке товаров.
 
Теперь обо всем по порядку.
 
1. Скрипт, который будет выравнивать высоту колонок:
<script type="text/javascript"> 
jQuery.fn.equalHeights = function(minHeight, maxHeight) {
		tallest = (minHeight) ? minHeight : 0;
		this.each(function() {
			if(jQuery(this).height() > tallest) {
				tallest = jQuery(this).height();
			}
		});
		if((maxHeight) && tallest > maxHeight) tallest = maxHeight;
		return this.each(function() {
			jQuery(this).height(tallest).css("overflow","auto");
		});
	}
</script>
Его я подключил head (на случай, если буду пользоваться им не только в zoo).
 
2. Вызываем скрипт выравнивания высоты
<script type="text/javascript"> 
jQuery(document).ready(function() { 
 jQuery(".jbzoo .items .column").equalHeights(); 
 jQuery(".jbzoo .subcategories .column").equalHeights(); 
 jQuery(".jbzoo .related-items .column").equalHeights(); 
}); 
</script> 
3 строчки с классами означают, какие блоки будут выравниваться. Первый - это товары в категории, второе - сами блоки субкатегорий, третье - похожие товары.
 
3. Скрипт, ссылку на который дал Sliappy в предыдущей теме, - ТЫК. Скрипт подключается просто:
<script type="text/javascript" src="jquery-ias.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/jquery.ias.css" />
4. Вызываем скрипт подгрузки
<script>
  jQuery.ias({
    container   : ".items",
    item    : ".width25",  
    pagination  : ".pagination",
    next    : "a.next",
    loader  : "<img src='images/loader.gif'/>",
    triggerPageThreshold : 1,
    trigger : "Показать больше товаров",
    onRenderComplete: function(items) {
	jQuery(".jbzoo .items .column").equalHeights(); 
    },
    history : false
  });
  </script> 
Здесь самое главное - это onRenderComplete, где мы вызываем скрипт выравнивания высоты.
 
- pagination - идентификатор пагинации, который исчезнет при подгрузке
- item - идентификатор подгружаемых товаров (у меня он .width25)
- history отвечает за сохранение истории подгрузки (при прокрутке к адресу будет прибавляться якорь #/page/)[/size]
- [/size]triggerPageThreshold отвечает за номер страницы, с которой товары будут подгружаться при нажатии на кнопку.
- trigger - надпись на кнопке, которая отвечает за дальнейшую подгрузку
 
5. Убираем галочку в настройках каталога "JS фикс высоты"
 
Вроде все, должно работать.
 
Надеюсь я сэкономил кому-нибудь время, которое потратил сам.
  • 16


#92554 [Рецепт] Вид Модуля Корзины - Basket

Написано CB9TOIIIA на 12 October 2016 - 13:22

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

Uikit частично.

 

 
GIFsdf324234.gif

 

 

Создаем файл в: modules\mod_jbzoo_basket\tmpl

 

Назвал: topheadbasket

<?php
/**
 * JBZoo App is universal Joomla CCK, application for YooTheme Zoo component
 * @package     jbzoo
 * @version     2.x Pro
 * @author      JBZoo App http://jbzoo.com
 * @copyright   Copyright (C) JBZoo.com,  All rights reserved.
 * @license     http://jbzoo.com/license-pro.php JBZoo Licence
 * @coder       Denis Smetannikov <denis@jbzoo.com>
 */

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

$cart     = JBCart::getInstance();
$order    = $modHelper->getOrder();
$currency = $modHelper->getCurrency();
$items    = $modHelper->getBasketItems(array(
    'class' => array(
        'image' => 'uk-thumbnail'
    )
));

?>
<div class="jbzoo jbcart-module jsJBZooCartModule" id="<?php echo $modHelper->getModuleId(); ?>">

<div class="cartmodtop"><i class="uk-icon-shopping-cart"></i></div>

    <?php if (empty($items)) : ?>
        <div class="jbcart-module-empty clearfix"> <span class="yourcarisemptypllles"><?php echo JText::_('JBZOO_CART_MODULE_EMPTY'); ?></span> </div>
    <?php else: ?>

        <?php if ((int)$params->get('jbcart_items', 1)) : ?>
            <div class="jbcart-module-items">

                <?php foreach ($items as $itemKey => $cartItem) :
                    $attrs = array(
                        'data-key'     => $itemKey,
                        'data-jbprice' => $cart->get($itemKey . '.element_id') . '-' . $cart->get($itemKey . '.item_id'),
                        'class'        => array(
                            $itemKey,
                            'jsCartItem',
                            'jbcart-module-item',
                            'clearfix'
                        ),
                    );
                    ?>

                    <div <?php echo $modHelper->attrs($attrs);?>>

                        <?php if ((int)$params->get('jbcart_item_delete', 1)) : ?>
                            <span class="uk-button uk-button-danger uk-button-small round jsDelete jbcart-item-delete">
                            <i class="uk-icon-trash-o"></i>
                        </span>
                        <?php endif; ?>

                        <?php if ((int)$params->get('jbcart_item_image', 1)) {
                            echo $cartItem['image'];
                        } ?>

                        <?php echo $cartItem['name']; ?>

                        <?php if ((int)$params->get('jbcart_item_price', 1)) : ?>
                            <div class="jbcart-item-price">
                                <?php echo $cartItem['price4one']; ?>

                                <?php if ((int)$params->get('jbcart_item_quantity', 1)) : ?>
                                    <span class="jbcart-item-price-multiple">x</span>
                                    <?php echo $cartItem['quantity']; ?>
                                <?php endif; ?>

                            </div>

                        <?php elseif ((int)$params->get('jbcart_item_quantity', 1)): ?>
                            <?php echo $cartItem['quantity']; ?>
                        <?php endif; ?>

                        <?php if ((int)$params->get('jbcart_item_total', 1)) {
                            echo $cartItem['totalsum'];
                        } ?>

                        <?php if ((int)$params->get('jbcart_item_params', 1)) {
                            echo $cartItem['params'];
                        } ?>
                    </div>
                <?php endforeach; ?>

            </div>
        <?php endif; ?>

        <?php if ((int)$params->get('jbcart_count_items', 1)) : ?>
            <div class="jbcart-module-line">
                <span class="jbcart-module-total-items circle">
                    <?php echo $order->getTotalCount(); ?>
                </span>
            </div>
        <?php endif ?>


        <?php if ((int)$params->get('jbcart_count_sku', 1)) : ?>
            <div class="jbcart-module-line">
                <?php echo JText::_('JBZOO_CART_MODULE_TOTAL_SKU'); ?>:
                <span class="jbcart-module-total-items">
                    <?php echo $order->getTotalCountSku() . ' ' . JText::_('JBZOO_CART_COUNT_ABR'); ?>
                </span>
            </div>
        <?php endif ?>


        <?php if ((int)$params->get('jbcart_totalsum', 1)) : ?>
            <div class="jbcart-module-line">

                <span class="jbcart-module-total-value"><?php echo $order->getTotalSum()->html($currency); ?> руб.</span>
            </div>
        <?php endif ?>


        <?php if ((int)$params->get('jbcart_button_empty', 1) || (int)$params->get('jbcart_button_gotocart', 1)) : ?>

            <div class="jbcart-module-buttons clearfix">

                <?php if ((int)$params->get('jbcart_button_empty', 1)): ?>
                    <span class="uk-button uk-button-danger jbcart-module-empty jsEmptyCart">
                      <i class="uk-icon-shopping-cart"></i>
                      <span class="yourcarisemptypllles"> <?php echo JText::_('JBZOO_CART_MODULE_EMPTY_BUTTON'); ?> </span>
                    </span>
                <?php endif ?>

                <?php if ((int)$params->get('jbcart_button_gotocart', 1)): ?>
                    <a rel="nofollow" class="gocartgogreenmodtop jbcart-module-gotocart"
                       href="<?php echo $modHelper->getBasketUrl(); ?>">

                       <span>Оформить заказ</span>
                    </a>
                <?php endif ?>

            </div>
        <?php endif ?>

    <?php endif; ?>

</div>


.korzina {
  line-height: 1;
  margin-top: 12px;
  position: relative;
}

.korzina .jbcart-module-buttons.clearfix {
    float: left;
}

.korzina .jbcart-module {
    background-color: #455674;
    display: inline-block;
    min-width: 200px;
    padding: 10px 15px;
}


.frontpage.alias-table-app {
    margin: 0px;
    padding: 0px;
}

span.jbcart-module-total-items.circle {
    position: absolute;
    background-color: #DA314B;
    padding: 10px;
    border-radius: 100%;
    min-width: 12px;
    display: inline-block;
    top: 0px;
    text-align: center;
    font-size: 0.7em;
    ;
}

.cartmodtop i.uk-icon-shopping-cart {
    transform: scale(-1, 1);
    font-size: 4em;
    color: #8CC14C;
}
.yourcarisemptypllles {
  line-height: 2;
}
.cartmodtop {
    float: left;
    margin-right: 15px;
}


a.gocartgogreenmodtop {
    color: #8cc14c;
    border-bottom: 1px dashed #8cc14c;
    line-height: 1.5;
    margin-top: -5px;
}

a.gocartgogreenmodtop:hover {
  border: 0px;
  text-decoration: none;
}

.yourcarisemptypllles {
    line-height: 1;
    position: absolute;
    top: 30px;
    ;
}

14489769.gif


  • 15


#88201 Произвольная сортировка каталога с фронта. ХАК. Делаем сами.

Написано Ёшкин Кот на 12 June 2016 - 14:55

Разберемся как сделать произвольную быструю сортировку для каталога. Примерно такую как на картинках. (Стили и вывод можно настроить самому).

 

1b652db1f9.jpg fe708569db.jpg

 

Прежде всего определяемся какие сортировки будут нужны

 

в нашем случае:

 

по возрастанию цены
по убыванию цены
по популярности
по дате добавления (сначала новые)
по дате добавления (сначала старые)
 
Первым делом будем править файлы в темплейте JBZoo (В моем случае это темплейт по умолчанию Default (Catalog))
 
media\zoo\applications\jbuniversal\templates\catalog\category.php - для вывода сортировки каталога
media\zoo\applications\jbuniversal\templates\catalog\filter.php - для вывода сортировки результатов поиска
 
media\zoo\applications\jbuniversal\templates\catalog\category.php 
 
В место, где надо вывести сортировку вставляем блок:
 
//Шаблон для сортировок в каталоге ======================================================================
if ($this->app->zoo->getApplication()->id == 1) { //проверяем в каком приложении мы находимся

// Получаем URL где находимся

$myuri = JFactory::getURI();
$myurl = $myuri->toString(array('path', '', 'fragment'));

$currentorder = $_SESSION['orderkit'];
if (!$currentorder) {$currentorder = 'price_asc';} //устанавливаем значение сортировки по умолчанию.

//Вывод сортировки
?>
    <div class="orderblock">
<span class="ordertitle">Сортировать</span>
        <span class="searchsel">
<ul>
<li <?php if ($currentorder == "price_asc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=price_asc" class="price asc">c начала дешевые</a></li>
<li <?php if ($currentorder == "price_desc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=price_desc" class="price desc">c начала дорогие</a></li>
<li <?php if ($currentorder == "popular_desc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=popular_desc" class="popular desc">c начала популярные</a></li>
<li <?php if ($currentorder == "date_desc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=date_desc" class="date desc">c начала новые</a></li>
<li <?php if ($currentorder == "date_asc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=date_asc" class="date asc">c начала старые</a></li>
</ul>
        </span>
</div>
    <?php

}
//Шаблон для сортировок в каталоге ======================================================================
 

У меня это 55 строчка. 

 

сразу же после строк:

    // category items render
    if ($this->params->get('config.items_show', 1) && count($this->items)) {

Далее правим media\zoo\applications\jbuniversal\templates\catalog\filter.php

 

В место где необходимо вывести сортировку вставляем этот блок:

	//Шаблон для сортировок в фильтре ======================================================================

	if ($this->app->zoo->getApplication()->id == 1) { //проверяем в каком приложении мы находимся

	// Получаем URL где находимся
	$myuri = JFactory::getURI();
	$myurl = $myuri->toString(array('path', 'query', 'fragment'));
	
	$currentorder = $_SESSION['orderkit'];
	if (!$currentorder) {$currentorder = 'price_asc';} //устанавливаем значение сортировки по умолчанию.
	
	//Вывод сортировки	
	?>
    <div class="orderblock">
		<span class="ordertitle">Сортировать</span>
		<span class="searchsel">
        <ul>
			<li <?php if ($currentorder == "price_asc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>&orderkit=price_asc" class="price asc">c начала дешевые</a></li>
			<li <?php if ($currentorder == "price_desc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>&orderkit=price_desc" class="price desc">c начала дорогие</a></li>
			<li <?php if ($currentorder == "popular_desc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>&orderkit=popular_desc" class="popular desc">c начала популярные</a></li>
			<li <?php if ($currentorder == "date_desc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>&orderkit=date_desc" class="date desc">c начала новые</a></li>
			<li <?php if ($currentorder == "date_asc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>&orderkit=date_asc" class="date asc">c начала старые</a></li>
		</ul>	
        </span>
	</div>
    <?php
	}

	//Шаблон для сортировок в каталоге ======================================================================

У меня по условиям дизайна блок выводится над заголовком (24 строка).

 

заголовок:

?><h1 class="title"><?php echo JText::_('JBZOO_SEARCH_RESULT'); ?></h1><?php

Эти блоки отличаются друг от друга. Они не взаимозаменяемые. Основное отличие в формировании ссылок и изначального адреса ссылки.

 

В первом случае ?orderkit=price_asc для категории и &orderkit=price_asc для поиска. 

 

Данные правки позволят вывести необходимые наборы сортировок в нужных нам местах с уникальными значениями ссылок.

    <div class="orderblock">
		<span class="ordertitle">Сортировать</span>
        <span class="searchsel">
		<ul>
			<li <?php if ($currentorder == "price_asc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=price_asc" class="price asc">c начала дешевые</a></li>
			<li <?php if ($currentorder == "price_desc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=price_desc" class="price desc">c начала дорогие</a></li>
			<li <?php if ($currentorder == "popular_desc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=popular_desc" class="popular desc">c начала популярные</a></li>
			<li <?php if ($currentorder == "date_desc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=date_desc" class="date desc">c начала новые</a></li>
			<li <?php if ($currentorder == "date_asc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=date_asc" class="date asc">c начала старые</a></li>
		</ul>
        </span>	
	</div>

Данные блоки надо редактировать под себя перечисляя в них свои сортировки. Я делал через ul li список. Вы форматируйте как вам угодно.

 

Так выглядит строка:

 

<li <?php if ($currentorder == "price_asc") {print 'class="active"';} ?>><a href="<?php print $myurl; ?>?orderkit=price_asc" class="price asc">c начала дешевые</a></li>

 

Я выделил цветом ключевые переменные. В данном случае price_asc

 

Эта переменная будет передана в адресе при клике на соответствующий пункт сортировки c начала дешевые

 

Вы создаете любой набор сортировок со своими переменными. У меня:

 

по возрастанию ценыprice_asc
по убыванию цены price_desc
по популярностиpopular_desc
по дате добавления (сначала новые)date_desc
по дате добавления (сначала старые)date_asc

 

Стили внешнего вида пока не настраиваем. Для начала запустим, чтобы все это дело заработало.

 

Переходим к правке файлов отвечающих за сортировку. Это:

 

components\com_zoo\controllers\default.php - отвечает за сортировку категории

media\zoo\applications\jbuniversal\framework\controllers\search.php - сортировка результатов поиска

 

components\com_zoo\controllers\default.php открываем данный файл.

 

ищем строку:

$this->item_order = $params->get('config.item_order');

У меня это оказалась 228 строка. После нее вставляем следующий код:

		//Блок сортировок для каталога---------------------------------------------
		if ($this->app->zoo->getApplication()->id == 1) { //проверяем в каком приложении мы находимся
		//jbdump ($this->item_order,0); //Используйте эту строку, если у вас подключен JBdump
		//echo '<pre>';print_r ($this->item_order);echo '</pre>'; //Используйте эту строку, если у вас не подключен JBdump покажет значения выбраной сортировки
		//print 'Текущее значение сессии сортировки: '.$_SESSION['orderkit']; //Посмотреть текущее значение сессии для сортировки
		if ($_SESSION['orderkit'] == "") {$_SESSION['orderkit'] = 'price_asc';} //устанавливаем значение сортировки по умолчанию.
		//Получаем переменную для направления сортировки 
		if (isset($_GET['orderkit'])) { $_SESSION['orderkit'] = $_GET['orderkit'];} //Меняем сортировку, если есть ключ в URL

			if (isset($_SESSION['orderkit'])) {
				
				switch ($_SESSION['orderkit']) {
					case 'price_asc':
						$this->item_order = array(
						'_jbzoo_0_field_01ab859d-e9ce-42a3-b24b-4d11422bba90___value',
						'_jbzoo_0_mode_n',
						'_jbzoo_0_order_asc'
						);	
					break;
					case 'price_desc':
						$this->item_order = array(
						'_jbzoo_0_field_01ab859d-e9ce-42a3-b24b-4d11422bba90___value',
						'_jbzoo_0_mode_n',
						'_jbzoo_0_order_desc'
						);		
					break;
					case 'popular_desc':
						$this->item_order = array(
						'_jbzoo_0_field_corehits',
						'_jbzoo_0_mode_n',
						'_jbzoo_0_order_desc'
						);		
					break;
					case 'date_asc':
						$this->item_order = array(
						'_jbzoo_0_field_corecreated',
						'_jbzoo_0_mode_d',
						'_jbzoo_0_order_asc'
						);		
					break;
					case 'date_desc':
						$this->item_order = array(
						'_jbzoo_0_field_corecreated',
						'_jbzoo_0_mode_d',
						'_jbzoo_0_order_desc'
						);	
					break;						
					}
			}
			}
			
		//jbdump ($this->item_order,0); //Используйте эту строку, если у вас подключен JBdump
		//echo '<pre>';print_r ($this->item_order);echo '</pre>'; //Используйте эту строку, если у вас не подключен JBdump покажет значения выбраной сортировки						
		
		//Блок сортировок для каталога---------------------------------------------	

Здесь видим следующие блоки:

case 'price_asc':
	$this->item_order = array(
	'_jbzoo_0_field_01ab859d-e9ce-42a3-b24b-4d11422bba90___value',
	'_jbzoo_0_mode_n',
	'_jbzoo_0_order_asc'
	);	
break;

Именно они отвечают за обработку созданных нами переменных в шаблонах. Разберу по частям что за что отвечает.

 

case 'price_asc': - Определяет какую переменную будет обрабатывать данный блок. В нашем случае price_asc то есть по возрастанию цены

 

Следовательно нам нвдо заставить каталог сортироваться по нужному элементу цены в нужном порядке. Как его найти?

 

Для этого в блоке я сделал несколько строчек. Они по умолчанию закомментированы.

//jbdump ($this->item_order,0); //Используйте эту строку, если у вас подключен JBdump
//echo '<pre>';print_r ($this->item_order);echo '</pre>'; //Используйте эту строку, если у вас не подключен JBdump покажет значения выбраной сортировки
//print 'Текущее значение сессии сортировки: '.$_SESSION['orderkit']; //Посмотреть текущее значение сессии для сортировки

Будем считать, что JBdump нам не доступен. Раскомментируем вторую строку убрав // перед ней

//jbdump ($this->item_order,0); //Используйте эту строку, если у вас подключен JBdump
echo '<pre>';print_r ($this->item_order);echo '</pre>'; //Используйте эту строку, если у вас не подключен JBdump покажет значения выбраной сортировки
//print 'Текущее значение сессии сортировки: '.$_SESSION['orderkit']; //Посмотреть текущее значение сессии для сортировки

сохраняем все это дело

Идем в административную панель и в настройках каталога выбираем элемент соответствующий нужной нм сортировке. Если в данном случае идет речь о цене по возрастанию то  ищем нужный нам элемент цены выбираем сортировку по умолчанию по нему. 

867833d6cb.jpg

Сохраняем. Обновляем страницу каталога и получаем нечто такое:

085316a3cb.jpg

 

Это сортировка выбранная нами в админке. Мы видим ID элемента, тип сортировки и ее направление:

[0] => _jbzoo_0_field_433a0a0e-30e8-4e71-92ab-4b9eb0d678f7___value
[1] => _jbzoo_0_mode_n
[2] => _jbzoo_0_order_asc

переносим значения сортировкив наш блок
case 'price_asc':
    $this->item_order = array(
        '_jbzoo_0_field_433a0a0e-30e8-4e71-92ab-4b9eb0d678f7___value',
        '_jbzoo_0_mode_n',
        '_jbzoo_0_order_asc'
);
break;

Таким образом создаем все блоки обработки наших сортировок. 

То есть столько блоков сколько мы создали в шаблонах столько делаем в данном месте и настраиваем их изменяя сортировки в админке для каталога для вывода необходимых нам данных для блоков.

 

Параллельно проверяем работоспособность соответствующих сортировок используя созданные нами ссылки в каталоге.

 

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

 

Открываем файл media\zoo\applications\jbuniversal\framework\controllers\search.php

 

находим строку:

$appId    = $this->_jbrequest->get('app_id');

и после нее вставляем следующий блок:

		//Блок сортировок для фильтра---------------------------------------------
		//jbdump ($order,0); //Используйте эту строку, если у вас подключен JBdump
		//echo '<pre>';print_r ($order);echo '</pre>'; //Используйте эту строку, если у вас не подключен JBdump покажет значения выбраной сортировки
		//print 'Текущее значение сессии сортировки: '.$_SESSION['orderkit']; //Посмотреть текущее значение сессии для сортировки

		if ($this->app->zoo->getApplication()->id == 1) { //проверяем в каком приложении мы находимся
		
		if ($_SESSION['orderkit'] == "") {$_SESSION['orderkit'] = 'price_asc';} //устанавливаем значение сортировки по умолчанию.
		//Получаем переменную для направления сортировки 
		if (isset($_GET['orderkit'])) { $_SESSION['orderkit'] = $_GET['orderkit'];} //Меняем сортировку, если есть ключ в URL
		
			if (isset($_SESSION['orderkit'])) {
					switch ($_SESSION['orderkit']) {
					case 'price_asc':
						$order[field] = '01ab859d-e9ce-42a3-b24b-4d11422bba90___value';
						$order[mode] = 'n';
						$order[order] = 'asc';
						break;
					case 'price_desc':
						$order[field] = '01ab859d-e9ce-42a3-b24b-4d11422bba90___value';
						$order[mode] = 'n';
						$order[order] = 'desc';	
						break;
					case 'popular_desc':
						$order[field] = '_jbzoo_0_field_corehits';
						$order[mode] = 'n';
						$order[order] = 'desc';	
						break;
					case 'date_asc':
						$order[field] = 'corecreated';
						$order[mode] = 'd';
						$order[order] = 'asc';
						break;
					case 'date_desc':
						$order[field] = 'corecreated';
						$order[mode] = 'd';
						$order[order] = 'desc';
						break;						
					}
			}
		}

Здесь блоки обработки сортировок выглядят иначе:

case 'price_asc':
     $order[field] = '01ab859d-e9ce-42a3-b24b-4d11422bba90___value'; 
     $order[mode] = 'n'; 
     $order[order] = 'asc'; 
break;

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

 
для каталога:
 
case 'price_asc':
    $this->item_order = array(
        '_jbzoo_0_field_433a0a0e-30e8-4e71-92ab-4b9eb0d678f7___value',
        '_jbzoo_0_mode_n',
        '_jbzoo_0_order_asc'
);
break;

Для поиска

:

case 'price_asc':
        $order[field] = '01ab859d-e9ce-42a3-b24b-4d11422bba90___value';
        $order[mode] = 'n';
        $order[order] = 'asc';
break;

 

То есть здесь просто иначе формируется массив и обрезаны префиксы для элементов.

Можно изменить уже готовые блоки.

 

После этого можно настроить стили для фильтра. На картинках стили представлены ниже:

.orderblock {
    border-top: 1px solid #c7c7c7;
    float: left;
    width: 100%;
    padding: 10px 0;
	text-align:right;
}
.orderblock .searchsel {
    display: inline-block;
    float: right;
    margin: 0;
    padding: 5px 15px;
    border: 1px solid #c7c7c7;
    height: 35px;
    position: relative;
    overflow: hidden;
    border-radius: 20px;
	text-align:left;
	background: url("../images/drop.png") no-repeat right;	
	width: 200px;
}
.orderblock .searchsel:hover {
    overflow: visible;
	border-radius:20px 20px 0 0;	
}
span.searchsel ul {
    position: absolute;
    top: 33px;
    right: -1px;
    left: -1px;
    border: 1px solid #c7c7c7;
    border-top: none;
    z-index: 50;
    background: #fff;
    padding: 15px;
    border-radius: 0 0 20px 20px;
}
.orderblock ul li {
    list-style: none;
    padding: 5px;
}
.orderblock ul li:hover a {
    color: #999;
}
.orderblock li.active {
	position:absolute;
    top: -34px;
}
.orderblock li a {
	color:#000;
}
span.ordertitle {
    display: inline-block;
    padding: 5px 20px;
}
#yoo-zoo > div.category {
    margin: 0;
    padding: 0;
}

Обратите внимание на следующие строки в коде:

if ($this->app->zoo->getApplication()->id == 1) { //проверяем в каком приложении мы находимся

Этим условием обернут весь код блоков сортировок и определяет в каком приложении выводится работает это все дело. Иначе сортировки будут выводится везде и работать например в блоге если он отдельным приложением сделан. Так же в данном месте можно поставить условие по категориям или иные условия для ограничения работы сортировок.. 

 
Файлы: Прикрепленный файл  files-sotr.zip   12.22К   411 Количество загрузок:

Прикрепленные изображения

  • e0cf56e9a1.jpg

  • 15


#84803 Бесконечный скролл (подгрузка айтемов вместо пагинации)

Написано isay777 на 24 March 2016 - 10:44

Есть давний вопрос на форуме, его задавали довольно часто и некоторые элементы изменились, по этому напишу еще один пример. 

По мотивам решения от Sliapy http://forum.jbzoo.c...uery-podgruzku/

 

Делаем подгрузку айтемов вместо пагинации 

 

Первое что делаем это скачиваем знаменитый скрипт http://infiniteajaxscroll.com/

И так скаченный файл jquery-ias.min.js кладем в папку вашего шаблона, я это сделал в подпапку js

<script src="/templates/ВАШ_ШАБЛОН/js/jquery-ias.min.js" type="text/javascript"></script>

подключаем в index вашего шаблона скрипт. Думаю в этом пункте проблем возникнуть не должно. 

 

Далее буду писать пример на основе шаблона bootsrap для JBZOO 

Если вы используете другой шаблон, то просто измените классы на свои и измените стандартный pagination 

 

Вызываем вот такой скрипт в вашем шаблоне 

    var ias = jQuery.ias({
      container:  '.items', //класс где выводятся все айтемы
      item:       '.item-column', //класс одного айтема или строки с айтемами (у меня например row)
      pagination: '.pagination', //класс пагинации для того чтоб скрыть её
      next:       '.next', // класс ссылки в пагинации для загрузки след страницы
      delay: 500
});
    
    
ias.extension(new IASSpinnerExtension({
    src: '/images/squares.gif', // адрес лоадера для красоты
}));
     ias.extension(new IASNoneLeftExtension({html: '<div class="ias-noneleft" style="text-align:center"><p><em>Это конец </em></p></div>'}));
    //текст когда айтемы закончатся по желанию 

Так самое главное сделали, теперь меняем pagination. У меня шаблон bootsrap по этому идём по адресу 

/media/zoo/applications/jbuniversal/templates/bootstrap/helpers/jbbootstrap.php

 

находим там код пагинации 

if ($pagination->current() < $pagination->pages()) {
                $link = $pagination->link($url, $pagination->name() . '=' . ($pagination->current() + 1));
                $html .= '<li><a href="' . JRoute::_($link) . '">&raquo;</a></li>';
                $link = $pagination->link($url, $pagination->name() . '=' . ($pagination->pages()));
                $html .= '<li><a href="' . JRoute::_($link) . '">' . JText::_('JBZOO_BOOTSTRAP_PAGINATE_LAST') . '</a></li>';
            }

Добавляем класс next для ссылки на след страницу 

if ($pagination->current() < $pagination->pages()) {
                $link = $pagination->link($url, $pagination->name() . '=' . ($pagination->current() + 1));
                $html .= '<li><a class="next" href="' . JRoute::_($link) . '">&raquo;</a></li>';
                $link = $pagination->link($url, $pagination->name() . '=' . ($pagination->pages()));
                $html .= '<li><a href="' . JRoute::_($link) . '">' . JText::_('JBZOO_BOOTSTRAP_PAGINATE_LAST') . '</a></li>';
            }

Теперь загружаем лоадер по тому пути что мы написали в скрипте. Я кинул просто в папку images. 

Лоадер можно скачать тут http://loading.io/или тут http://preloaders.net/ru

 

Вот теперь всё. Наши айтемы подгружаются автоматом. 

 

 

ПРИМИЧАНИЕ: Скрипт скрывает класс пагинации который мы указали .pagination он может совпадать со стандартным joomla и ваша пагинация в новостях будет скрыта имейте ввиду! 


  • 15


#27455 Пожелания для корзины

Написано Grizli на 21 September 2013 - 22:25

Я представляю развитие корзины по следующим направлениям:

- управлять способами/стоимостью доставки и чтобы от этого зависела общая цена в корзине (например, "самовывоз" ничего не прибавляется, доставка по городу прибавляется 5 долл., доставка по стране + 10 долл. И соответственно возможность установить сумму заказ, после которой стоимость доставки бесплатная

- описание/комментарии под выбранным способом оплаты

- иметь возможность повторять заказ в личном кабинете (не совсем корзина, но около нее)

- отдельную интеграцию с популярными платежными системами: WebMoney, Яндекс Деньги, Privat 24 (API), Liqpay (API), VISA/Mactercard (API), PayPal (может не совсем востребованный в СНГ, но нужный нашим заграничгым коллегам)

- другие дизайны для формы корзины

ssm58aa4444_200x0.png ssm677e72e4_200x0.png

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

- чтобы по желанию можно было включать/выключать сообщение о регистрации для тех, кому важно чтобы пользователи могли заходить и отслеживать состояние своего заказа

- использование скидки при оформлении заказа для зарегистрированных покупателей и/или систему купонов

- пользовательское соглашение во всплывающем окне


  • 15


#70194 Добавление полей в профиль пользователя Joomla и настройка автозаполнения пол...

Написано DMTR3000S на 31 July 2015 - 20:24

Я очень долго собирался оформить этот рецепт, но врождённая лень работа отнимала всё время. Сегодня мне в личку напомнили, дескать, "где рецепт деньги, Лебовски?" и я понял - пора! :)
 
Пролог и он же лирическое отступление.
 
Интернет-магазин обязан быть удобным и должен учитывать пожелания любимого ленивого клиента.

Несомненно, одной из удобнейших фишек является автозаполнение форм для зарегистрированных пользователей: зарегистрировался, заполнил поля с ФИО и адресом, и при дальнейших покупках всё это подставляется автоматом.

 

Передо мной встала задача реализовать такую штуку, и несмотря на то, что в JBZoo 220 есть в настройках опция "Брать значение из профиля пользователя", я упёрся в непонимание и несправедливость со стороны стандартного профиля Joomla, в котором полей для заполнения - два с половиной. Вот как он выглядит:

screen01.png

 

Меня такой расклад совершенно не устраивал. Погуглив и полазив по форуму я нашёл решение, где подключался плагин "Профиль", который добавляет-таки поля к стандартному набору:

screen02.png

 

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

 

Перейдём к решению:

Как настоящие джедаи мы будем допиливать стандартный джумловский профиль. С преферансом и куртизанками, да.

 

Шаг первый

Итак, первоочередная задача - попасть в phpmyadmin, чаще всего на хостингах юзается именно он (а если нет - то вы бородатый одмин и инструкции вам не нужны). Находим таблицу t_users, щёлкаем по ней, видим примерно следующую картину:

screen03.png

 

Это не что иное, как таблица, в которой Joomla хранит профили пользователей. Имя, логин, пароль, статус, дата последнего входа и т.п. информация пишется именно сюда. Всего-то и нужно добавить свои поля.

Важно: у вас префикс t_ будет какой-то свой, не суть, ключевое слово - users

 

Шаг второй

Добавим в таблицу свои параметры. Точнее, не сами параметры, а места в базе данных под них, чтобы было где хранить :)

Я буду добавлять поля 3 поля -"Имя", "Фамилия" и "Адрес".

Под табличкой видим область для добавления новых записей. У меня их 3, поэтому я ставлю 3 (ваш Кэп), отмечаю "В конец таблицы" и щёлкаем кнопку "Вперёд":

screen04.png

 

После этого, в открывшемся поле для редактирования задаём в колонке "Имя" - названия параметров латинскими буквами, "Тип" выставляем в VARCHAR, "Длину" - по своему усмотрению: к примеру, если у вас есть будет в профиле поле "Возраст" - логично, чтобы его длина была двум символам. Для имени и фамилии я задал длину в 50 символов, а для адреса отвёл 200. Остальные поля от греха подальше можно не трогать. Вот как это выглядит у меня:

screen05.png

 

Жмём справа внизу кнопку "Сохранить", снова зайдём в таблицу users и увидим следующую картину:

screen06.png

 

Поздравляю, мы подготовили в базе места для новых полей в профиле :)

 

Шаг третий

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

 

Давайте откроем конфигурационный файл, который отвечает непосредственно за вывод полей в форме - registration.xml, который лежит по адресу  /components/com_users/models/forms, и найдём в нём вот такой кусок кода:

<field
	name="name"
	type="text"
	description="COM_USERS_REGISTER_NAME_DESC"
	filter="string"
	label="COM_USERS_REGISTER_NAME_LABEL"
	required="true"
	size="30"
/>

Немножко разберёмся. Эта запись отвечает за выведение поля "Имя" в форме регистрации пользователя и подсказывает джумле, в какую таблицу базы класть введённое значение. Расскажу что тут для чего:

  • name - это название ячейки базы данных, в которую будут закидываться данные из формы.Помните, я делал три поля в SQL и называл их firstname, family и address? Вот, name говорит джумле, в какую ячейку класть данные.
  • type - тип данных
  • description - подсказка
  • filter - валидация введённого значения
  • label - подпись к полю формы
  • required - обязательность заполнения данного поля. true - обязательно, false - нет. Если выставлено тру - около поля появится звёздочка и форма не отправится, пока не будет заполнено поле (Ваш Кэп)
  • size - ширина поля формы

Итак, берём этот кусок кода и копируем его столько раз, сколько полей вы хотите получить. В моём случае - три, и правим так, как нам нужно. Вот так получилось у меня:

<field
	name="name"
	type="text"
	description="COM_USERS_REGISTER_NAME_DESC"
	filter="string"
	label="COM_USERS_REGISTER_NAME_LABEL"
	required="true"
	size="30"
/>
		
<field
	name="firstname"
	type="text"
	description="Введите имя"
	filter="string"
	label="Имя"
	required="true"
	size="30"
/>
		
<field
	name="family"
	type="text"
	description="Введите фамилию"
	filter="string"
	label="Фамилия"
	required="true"
	size="30"
/>
		
<field
	name="address"
	type="text"
	description="Введите адрес"
	filter="string"
	label="Адрес"
	required="true"
	size="30"
/>

Сохраним файл и перейдём на сайт туда, где у вас осуществляется регистрация пользователей. Я делаю всё это на демке JBZoo, поэтому форма входа коряво гордо висит посередине страницы, но не суть. А главное, что мы видим - в форме появились вожделенные поля!

screen07.png

 

Порядок их выведения вы можете настроить прям в xml файле. Просто расставьте поля в нужном порядке.

Примечание: я сделал не совсем корректно - у меня было стандартное поле с именем, а я прикрутил ещё одно, поторопился :(

 

Шаг четвёртый

Теперь добавим отображение этих полей в админке, в менеджере пользователей. Для этого идём в  /administrator/components/com_users/models/forms и берём за жабры файл user.xml. Действуем там по старой схеме, не забываем сохранить файл с изменениями, и после манипуляций у нас получится вот так:

screen08.png

 

Шаг пятый

Но и это ещё не всё! (с)

Чтобы данные из профиля Joomla подхватывались в JBZoo, нужно зайти в  /media/zoo/applications/jbuniversal/framework/helpers и файле jbfields.php добавить в массив $whiteList через запятую названия наших ячеек в SQL. В моём случае это firstname, family и address:

$whiteList  = array('name', 'username', 'email', 'registerDate', 'lastvisitDate', 'firstname', 'family', 'address');

Теперь, чтобы настроить автозаполнение формы, нужно зайти в админке в настройки шаблона формы и выставить из каких полей профиля что брать, ибо поля появились у нас в списке:

screen10.png

 

Как-то так. Да, кстати - не забывайте про бэкапы и помните, что всё это вы делаете на свой страх и риск, и всё такое.

 

Также учтите, что при обновлении движка файлы registration.xml и user.xml могут потереться в дефолтное состояние, но поскольку они отвечают только за отображение информации и вывод полей в форме - данные в базе никак не пострадают. Достаточно будет восстановить два вышеназванных файла и всё придёт в норму.


  • 14


#63770 Модальное окно добавления товара в корзину (заменяем полёт)

Написано isay777 на 29 April 2015 - 10:59

Уже давно пользователи привыкли, что что-то происходит после нажатия кнопки в корзину, но не все видят изменение в корзине. 

 

Всякие "приблуды" типа полета в корзину довольно трудоёмки и иногда работают криво, особенно на мобильных устройствах. 

Но теперь у нас есть вшитый sweet alert и нам теперь легко можно сделать всплывающие окно с сообщением о попадании товара в корзину.

 

Приступим

==============================================

Идем в js отвечающий за кнопки 

jbuniversal/cart-elements/price/buttons/assets/js/buttons.js

нам нужна эта строка 

5coc.png

 

Пишем свой код для окна по образцам на сайте свит алерт, я сделал так 

swal( {title: "Товар добвлен в корзину!",type:"success", timer: 2000,   showConfirmButton: false });

Теперь вставляем его в js 

должно получиться примерно так 

'click .jsAddToCart': function (e, $this) {

                var jbPrice = $this.price.data('JBZooPrice'),
                    quantity = $this.get('quantity', 1),
                    input = $(this);
                swal( {title: "Товар добвлен в корзину!",type:"success", timer: 2000,   showConfirmButton: false });

И вот что у нас выходит. 

 

l2qhxh13vxyx.gif

 


  • 13


#11071 Добавление собственных полей в корзину и форму заказа

Написано Vital на 22 February 2013 - 10:47

По многочисленным просьбам телезрителей! ;D
подробности реализации этого топика http://forum.jbzoo.com/topic/1946-
Вот архив с измененными мною файлами. Делал для магазина женской одежды.
Помимо размера можно еще указывать цвет в корзине(если такие поля есть в товаре).
Думаю что разобраться не составит труда!

P.S. + в карму еще никто не отменял ;)

 

 

 

Прикрепленный файл  my_cart.zip   17.61К   399 Количество загрузок:

 


  • 13


#102094 AJAX фильтр (v220)

Написано fiction13 на 08 December 2017 - 07:20

Привет, читатель.

 

Сегодня мы поговорим об ajax фильтре для последних версий JBZoo.

 

Фильтр будет уметь:

  • подгружать результаты в нужное место на сайте
  • переключать страницы фильтра (пагинация) без перезагрузки
  • в момент подгрузки затемнять экран с изображением лоадера
  • менять историю браузера
  • готовить

В прикрепленном архиве Вы найдете файлы, которые правились для этой реализации

  • /modules/mod_jbzoo_search/assets/js/filter.js (правка)
  • /modules/mod_jbzoo_search/assets/less/filter-ajax.less (новый файл)
  • /modules/mod_jbzoo_search/assets/img/loader.svg (новый файл)
  • /modules/mod_jbzoo_search/helper.php (правка)

Как Вы видите я поправил хелпер модуля. В нем подключается не только новый стиль для фильтра, но и добавляются параметры для виджета.

$this->_jbassets->widget('#' . $this->getModuleId(), 'JBZoo.Filter', array(
    'url'               => JRoute::_('index.php?Itemid=' . $this->modParams->get('menuitem', JFactory::getApplication()->input->getInt('Itemid'))).'?',
    'updateBlock'       => '#yoo-zoo',
    'autosubmit'        => (int)$this->_params->get('autosubmit', 0),
    'ajaxPagination'    => 1,
    'pagination'        => '.uk-pagination',
 ));

Добавленные параметры:

  • updateBlock - селектор блока, куда будут подгружаться результаты фильтра
  • ajaxPagination - влючение или отключение ajax пагинации
  • pagination - селектор контейнера Вашей пагинации

Правьте эти параметры под себя и обретете счастье.

 

Влючение ajax фильтра производится из админки чекбоксом "Авто-отправка формы". Установка - распаковкой в корень сайта.

 

Демо - http://jbzoo.fictionlabs.ru/

 
Бэкапьтесь, не разрабатывайте на продакшене и изучайте css (хотя бы). Аминь.

Прикрепленные файлы


  • 13


#90976 Что такое MyJBZooStat и с чем его едят? (Обзор, Видео, Скачать)

Написано CB9TOIIIA на 31 August 2016 - 02:26

Всем привет. Сегодня последний день лета и Я хочу зарелизить свой компонент - MyJBZooStat.



Возможности:

MyJBZooStat - это компонент статистики и менеджер системы комментирования Disqus.

  • Яндекс.Метрика - получение по API многих данных и их обработка. Накладываение статистики JBZoo или стандартных (com_content) поверх данных посещаемости.
  • JBZoo - статистика товаров/статей, тегов, авторов и их профилей.
  • А также менеджер комментариев системы комментирования - Disqus.

1. Я.Метрика - работает и на проектах - где JBZoo не используется. Вбейте API данные в настройки и будут красивые графики и блоки. Динамика посещаемости по дням, демография, популярное и многое другое.
0_a7256_db44e8f6_orig.png

Spoiler


2. Теги - отображает график использования тегов + подробную информацию по кол-ву и их использованию.

0_a7259_9d8f1b07_orig.png
Spoiler



3. Товары/Статьи - красивый график за месяц отображает кол-во заполненных позиций в этот день. Для менеджеров подсвечивает статьи - которые не содержат теги (tags) и имеется глобальная статистика публикаций.

0_a725b_d63fb48c_orig.png



4. Авторы - отображает список всех авторов.

0_a725c_4ad22faf_orig.png


5. Статистика авторов - отображает таблицу с продуктивностью авторов (сколько товаров/статей загрузили в этом месяце).

0_a725d_ac757f28_orig.png


6. Профиль автора - вся информация об авторе - какие товары/статьи загрузил, какие теги использует - кол-во share и комментариев и т.д.

0_a725e_3c8cae5c_orig.png


0_a725f_1b90f123_orig.png



7. Disqus - система комментирования.

0_a7260_26b776bb_orig.png
Spoiler


На мой взгляд мне удалось создать по настоящему менеджер комментариев - т.к. на мой взгляд я использовал почти все API Disqus - которое полезное для сайта.

  • Вы можете сразу видеть статьи за текущий день - кол-во комментарив - share - автора.
  • Далее Вы можете войти в статьи - посмотреть какие пользователи и что написали.
  • Можете поставить Лайк/Дизлайк, отправить в спам, удалить, предупредить - в общем все возможное с комментарием.
  • Вы также можете войти в профиль комментатора - и увидеть внимание: его комментарии на др. сайтах (это позволяет Disqus) - его рейтинг, карму - его все сообщения - в общем всю подноготную.
  • Также можете видеть ID и забанить пользователя или например ID комментария встроить в статью (embed).

Советую у кого есть Disqus на проекте - опробовать!


P.S. В планах еще есть сделать кнопку - по которой все сообщения содержащие (flag) дизлайки и прочее отобразятся - так проще банить будет.


Немного о проекте:

Я его начал делать в самом начале лета , примерно пару месяцев у меня ушло на написание функционала и еще примерно месяц, а то и больше, чтобы "причесать" его для сообщества и сделать универсальным (его можно ставить, не только на JBZoo проекты) - тогда будут активны только некоторые вкладки.



СПАСИБО КОМАНДЕ JBZOO:

Я хочу выразить огромное СПАСИБО Сереге и Денису, без Вас я бы точно не справился. Серега мне дал огромный пинок в изучение sql и php функций. Написал нес-ко готовых sql запросов, благодаря которым - я наконец-то изучаю подробно API и языки. Денис вообще красавчик - поделился своими вундер-приложениями , на пальцах показал как ими управлять, ввел в мир Composer, а также дебагером на симфони. Ребят, Вы лучшие!

Лицензия:
В общем лицензия MIT (как есть). Проект открытый и есть на GitHub - прошу PR кидайте :)


О ценообразовании:

Мне многие говорили - бесплатно его выкладывай, ты что... да и судя по прошлым расширениям (из 25 расширений - мне задонатили наверное 3,5 человека - вот и все) Но! Я решился, что если кто-то по настоящему проникнется компонентом - сможет оценит мой труд в течение всего лета и поддержит меня донатом (пожертвование) . Поэтому большая просьба - если понравился или пользуетесь, отправьте столько на сколько оценили его (fingers) это мотивирует меня для написание доп. функций и др. расширений. --> https://oplata.cb9t.ru/

 

 

Нажмите здесь, чтобы скачать файл


  • 12


#87825 JoomlaDay 2016 в Москве - CAMRip (@CB9TOIIIA)

Написано CB9TOIIIA на 03 June 2016 - 10:29

Всем привет! Пока нет проф. видео и наверное в скором времени будет, решил недельку подождать вдруг появятся... но увы) Вот вам CAMRip  :) снят на polaroid cube - поэтому не сердчайте за качество (это маленький кубик как пара 10рублевых монет). Можете заценить как мы выступали и вообще наши доклады) Видео в Full-HD (1080p) - поэтому дождитесь обработки ютубом.
 
JBZoo - это element'арно! ... и atom'арно
 

 
Разгоняем мобильный сайт до максимума - Google AMP в Joomla!
 

 
P.S. Можно в открытый раздел перенести.
 
Пишите комментарии - как Вам? мы очень волновались
 
P.S. Скоро готовлю бооооольшую статью - как я ездил на JD с фото / видео / шутками за кадром.

Читать тут: http://joomlaportal....y-2016-v-rossii


  • 12


#45194 Импорт 300 000 материалов и оптимизация работы JBZoo для работы с большими об...

Написано tapakan на 20 June 2014 - 08:19

Мы специально провели почти неделю издеваясь (в буквальном смысле) над импортом, Zoo и сервером, чтобы найти узкие места в производительности и узнать сможет ли JBZoo работать с большим объемов материалов.
 
Почему JBZoo может тормозить при больших объемах?

  • Во-первых, изначально Zoo и JBZoo  не были предусмотрены под большие нагрузки и объемы, в основном из-за самого Zoo и структурой базы данных Zoo. Разработчики Zoo (YOOtheme) сами наверное не рассчитывали, что подобные объемы будут использоваться на их платформе. Но, у нас есть пару вариантов, которые смогут помочь при работе с большими объемами.
  • Во вторых, чудес не бывает и производительность не берется из неоткуда.
  • В третьих, сотни тысяч материалов - это реально очень много. Пожалуйста, не утверждайте обратное без серьезных обоснований.
  • Будьте реалистами а не сказочниками  ;)

Некоторые из решений ниже, при определенных условиях, можно использовать на обычных сайтах. Только не нужно слепо все копировать - сломаете сайт! Думаем…
и бекапимся...
 
Условия тестирования
 
Сначала определимся, что мы подразумеваем под “большим объемом” ?

  • Если количество материалов превосходит 100 000.
  • Количество категорий для этих(!) материалов от 500 и выше. Тут большую роль играет количество взаимосвязей между категориями и материалами.

Сервер у нас отдельный, “железный” и полностью наш - FastVPS (EX-4)

  • Процессор: 8 ядер, 3,4Гц, Intel
  • Память: 16 GB
  • HDD: RAID, почти 3000 Gb
  • Тест произв-ти JBZoo (116 попугаев): http://llfl.ru/d6uoj

Софт

  • Debian 7
  • Apache 2.4 + Nginx 1.0
  • MySQL 5.5
  • PHP 5.4 + xCache 2.x
  • Joomla: 3.3.1
  • JBZoo: 2.1.4 Pro
  • Zoo: 3.1.6

Сразу же оговорюсь. Сервер наш - это далеко не обычная VPS-ка и  тестировали на нем из соображений:

Серьезный сервер = Серьезный сайт + Серьезные объемы

 
Если вы решили на виртуальном хостинге в 300-500 рублей делать что-то подобное, то я могу только слезами на глазах пожелать вам лишь... “удачи”  ;)
 
К слову, VPS за 500 рублей будет по определению медленнее, чем шаред за те же деньги.

 

 

Импорт 300к+ материалов и 500 категорий
 
Мы тестировали следующий вариант контента

  • Всего порядка 320 000 материалов
  • Примерно 510 категорий
  • Примерно у 30 000 материалов привязка к 10 категорий одновременно. Остальные материалы - только 1 категория.
  • В типе материала - 9 текстовых элементов (Text) и элемент цены (JBPriceAdvance).
  • У элементов разные значения - числовые, строковые и дата.
  • Уникальность простых повторяемых значений элементов в пределах 30 штук.
  • В каждом сотом материале элементы повторяемые, примерно 4.
  • Размер импортируемого файла примерно 74мб.
  • Категории создавались “на лету”.

Условия тестирования скорости импорта

  • 100 000 разных материалов.
  • Файл примерно 74 мегабайта.
  • Шаг импорта - 100 материалов за раз (т.е 1 000 шагов).
  • Без оптимизации - Чуть больше полутора часов.
  • Со всеми оптимизациями (ниже) - примерно 50 минут

Дополнительные тесты показали, что размер файла большой роли не играет. Выигрыш (или проигрыш) “смазывается” когда дело идет к концу. Я грузил одним большим, чтобы не отрываться от чая.
 
Несколько ускоряет манипуляция с размером шага. Тут все зависит от ваших данных. Только экспериментами можно найти истину… У нас это было 100 за раз.

 

Как выглядит база после импорта?

 

94u.png

 

* особое внимание стоит обратите на выделенные колонки 

Способы разгона импорта
 
Помним! Код, который мы будем удалять, написан там не от хорошей жизни, потому что программисты скучали. Комментирование кода сказывается на функционале вашей системы!

Убираем проверку алиаса на уникальность
(Только если вы уверены в уникальности алиасов в csv файле!)
 
Файл - /administrator/components/com_zoo/tables/item.php  метод save()
Комментируем следующие участки кода.

// Проверка уникальности
if ($this->app->alias->item->checkAliasExists($object->alias, $object->id)) {
     throw new ItemTableException('Alias already exists, please choose a unique alias');
}

Файл - media\zoo\applications\jbuniversal\framework\helpers\jbimport.php
примерно на 382 строке комментируем

$item = $this->_checkItemAlias($item);

Последствие: Фатальная ошибка при совпадении alias’ов. Придется перезапускать импорт.
 
 
Отключаем индекс Zoo
Файл - /administrator/components/com_zoo/tables/item.php метод save()

//Zoo index
foreach ($object->getElements() as $id => $element) {
// get search data
    if ($data = $element->getSearchData()) {
        $search_data[] = "(".$object->id.", ".$db->quote($id).", ".$db->quote($data).")";
    }
}

// delete old search data
$query = "DELETE FROM ".ZOO_TABLE_SEARCH
." WHERE item_id = ".(int) $object->id;
$db->query($query);

// insert new search data
if (count($search_data)) {
$query = "INSERT INTO ".ZOO_TABLE_SEARCH
." VALUES ".implode(", ", $search_data);
$db->query($query);
}

Последствие: Теряется возможность поиска фильтра по textarea и стандартного поиска Joomla.

 

Отказываемся от индекса JBZoo во время импорта
Файл - /media/zoo/applications/jbuniversal/framework/events/jbevent.item.php метод saved()
Комментируем весь код

// vars
$app      = self::app();
$item     = $event->getSubject();
$itemType = $item->getType()->id;

        // hack for JBZoo import optimization
if ($item->getParams()->get('jbzoo.no_index', 0) == 1) {
    return null;
}

// update index data
$app->jbtables->checkSku(true);

$indexTableName = $app->jbtables->getIndexTable($itemType);
if ($app->jbtables->isTableExists($indexTableName, true)) {
    JBModelSearchindex::model()->updateByItem($item);
}

Последствие: Сохранение и редактирование материалов не будет наполнять индекс. Придется после импорта (и любых изменений материалов) запускать переиндексацию вручную.
 
 

 
Играемся с шагом импорта
Файл media\zoo\applications\jbuniversal\framework\helpers\jbimport.php константа 

STEP_SIZE = 50

Попробуйте ее увеличить до 100-200. Очень большие значения сделают только хуже. Все зависит от "однородности" ваших данных параметров вашего сервера.
 

 
Оптимизация JBZoo Некоторые советы

  • Нет никакого смысла импортировать большие объемы под windows. Проблемы NTFS и мелких файлов PHP “съедят” ваш сайт при любом процессоре и даже на SSD дисках.
  • Как показали результаты тестов, при большом количестве импортируемой информации,  переиндексация пройдет быстрее отдельным процессом после создания материалов.
  • От модуля JBZoo Search List по возможности лучше отказаться т.к он использует наиболее тяжелые запросы в базу для такого количества.
  • Отключаем все лишние плагины Joomla. Особенно плагины finder и search. Они генерируют дополнительную нагрузку на базу и сайт в целом.
  • В фильтре меньше использовать элементы с уникальными значениями - radio, select и т.д.
  • Используйте точный поиск. Полнотекстовый очень требовательный по определению.
  • НЕ используйте множественные сортировки. Сортировка - это всегда тяжелая операция.
  • НЕ используйте сортировку от Zoo (она кривая, особенно алфавитная)
  • НЕ используйте альфаиндекс (поиск по букве и выборка уникальный букв для блока - очень тяжелые операции)

 

Ускорение сайта

  • Обязательно включаем кеширование (для JBZoo большой разницы нет между стастический и динамический)
  • Желательно НЕ использовать файловый кеш. Хорошо справляется модуль php memcache.
  • Если у вас статический контент, то можно включить плагин кеширования. Он полностью сохраняет html страницы. Осторожно плагин никак не проверяет, обновились ли данные.
  • Если вам не важны данные о начале и окончании публикации материала, можно изменить sql запрос. На 100 000 материалов это помогло выиграть ~5 секунд из 17

 

Изменить запрос необходимо для категории в самом Zoo и в JBZoo
 
1. Файл - administrator\components\com_zoo\tables\item.php . Метод getByCategory.
Удаляем из него следующие строки

." AND a.".$this->app->user->getDBAccessString($user)
." AND (a.publish_up = ".$null." OR a.publish_up <= ".$now.")"
." AND (a.publish_down = ".$null." OR a.publish_down >= ".$now.")": "")

2. Файл - media\zoo\applications\jbuniversal\framework\models\jbmodel.php . Метод _getItemSelect
Избавляемся от кода

->where('tItem.' . $this->app->user->getDBAccessString())
->where('(tItem.publish_up = ' . $this->_dbNull . ' OR tItem.publish_up <= ' . $this->_dbNow . ')')
->where('(tItem.publish_down = ' . $this->_dbNull . ' OR tItem.publish_down >= ' . $this->_dbNow . ')')

 

 
Еще полезная информация о базе и фильтре от SmetDenis ...
Источник http://forum.jbzoo.c...udet-bystree-e/

  • Скорость работы фильтра не зависит от настройки тизеров. Как понимаю, скорость фильтра - это непосредственно скорость поиска, т.е сопутствующих запросов в БД. Не путайте с выводом результата и генерацией HTML
  • Если у вас одновременно на странице выводится несколько десятков (а то и сотен) тизеров, тогда конечно, вывести данные напрямую из объекта материала будет быстрее, минуя проверку полей на доступ и рендеры шаблонов самих элементов. Тут можно выиграть только если используются заведомо сложные элементы (цена, каскадные селекты например), где нужно не просто вывести значение, а еще вычислить что-нибудь или показать виджет.
  • Если говорить о поиске, то опять же зависит от того, по каким полям вы ищите, какой поиск и какого рода данные там хранятся. Лучше смотреть на конкретные примеры. Однозначно нельзя сказать. Запросы в базу собираются динамически + умеют частично и эффективно кешироваться на уровне MySQL.

Вот несколько мыслей по поводу фильтров

  • Фильтр оперативнее ищет по числам, т.е оптимизация на уровне MySQL. На втором месте будут даты и самый медленный - это текст.
  • Точный поиск всегда работает в разы быстрее полнотекстового (учите SQL).
  • Поиск по textarea - самый медленный (причин много, основы программирования).
  • Если вы ищите по категориям и у вас используется множественная привязка одного материал ко многих (и таких привязок оооочень много), то это снижает скорость. Например, у нас 100 категорий и 2000 материалов. Максимально привязано все ко всему. Получается, что 2000 * 100 ~ 200 000 будет участвовать в запросе. Но я лично не представляю логическое обоснование таким сайтам =)
  • 300 категорий - это много только для человека. MySQL легко орудует десятками тысячами записей. Для него это рутина и бытовуха =).
  • Множественные поля конечно усложняют поиск, но не критично. Конечно если у вас на одно поле не приходится 10+ значений и подобных полей в материале 5-10. Т.е получается что на 1 материал индекс будет хранить как минимум 10 и более записей.
  • Большое количество полей в одном типе материала проявит себя только после ~20-30 штук (считаю только те, которые содержат полезные(!) данные для поиска). Просто в этом случае можно упереться в некоторые ограничения MySQL. Не критично и зависит от пунктов выше.
  • Количество приложений и типов сильной роли не играет, т.к на уровне базы данных типы имеют физически разные таблицы, а каталоги - это простейшее индексируемое поле.
  • … ищите хороший хостинг (в JBZoo есть система тестирования скорости)

---
 
В силу невероятно тупых (нет других слов) мнений о базах данных, их размерах и кол-ве запросов в популярных очерках незадачливых, не побоюсь этого слова, "web-мастеров" - у людей складываются не правильные понятия о принципе работы сайта в целом.
 
Сразу вспоминаю мой Joomla-Book.ru, главная страницы. ArtioSEF добавляет 250 запросов. И че?)) Летает =)
 
Скажу вам как человек, который делал даже такие вещи как автодополнение на лету по 8 миллионной базе весом в 35Гб. Все зависит от конкретного запроса и индексов в базе. Можно сделать 300 запросов, при этом сайт будет грузится 0,5 сек или 10 запросов в туже самую базу за теми же данными, но уже все будет грузится в 10 раз дольше.
 
Поэтому лучше рассматривать конкретные примеры, конкретный хостинг, конкретные данные.

 
 

В заключение от автора
Работу Zoo и JBZoo проверили на 320 тысячах материалах и 500 категориях.
До оптимизации загрузка страницы категории длилась ~17 секунд - 20 материалов на странице, у каждого по 10 элементов + заведомо тяжелые модули.
 
После всех выше описанных оптимизаций скорость загрузки категории увеличилась до ~3 секунд, из которых 2 занял рендеринг шаблона (Список материалов), ~0.5 секунд на вывод JBZoo Module search(Очень много опций), ~0,5 секунды для модуля JBZoo Module Search List.
 
Это только базовая оптимизация (а ускорение уже в 6 раз), дальше нужно смотреть каждый сайт индивидуально.
 
Оперативной памяти понадобилось 90мб (очень много HTML и Zoo начинает течь по памяти, причину не искали).
 
Сами видите, какие потребовались ресурсы и силы, что бы при больших объемах работоспособность сайта сохранилась.
Согласитесь, не каждый дешевый хостинг может себе это позволить.
 
Если вы решили делать сайт на JBZoo под большие объемы информации приготовьтесь раскошелиться на хороший сервер, хотя, это обязательное условие для нормальной работы сайта.
 
Считаю, что JBZoo вполне справилось с объемом 100к+ и уж тем более справится с типичными 3000 из магазина.
Главное - не отключайте голову ;)

PS С нетерпением жду ваших комментов, замечаний и наблюдений. Открыт для срача холивара.

 

Прикрепленный файл  patch.zip   20.18К   382 Количество загрузок:

  • administrator\components\com_zoo\tables\item.php - убрана индексация зуу, проверка alias на уникальность, проверка по диапазону дат, доступу пользователя.
  • components\com_zoo\controllers\default.php - отключаем подсчет количества материалов для категорий. Бережем оперативную память.
  • media\zoo\applications\jbuniversal\framework\events\jbevent.item.php - выключаем индексацию зуу.
  • media\zoo\applications\jbuniversal\framework\helpers\jbimport.php - убираем проверка alias на уникальность.
  • media\zoo\applications\jbuniversal\framework\models\jbmodel.php - Изменяем sql запрос. Нет проверка по диапазону дат, доступу пользователя.

  • 12


#28607 Анимация добавления товара в корзину

Написано Cheren-dow на 07 October 2013 - 09:41

Как и обещал , делаем добавление товара(изображение "летящее" в корзину) как на приведенном примере сайта.

 

1. Добавляем кнопке id нашего item-a

Открываем файл _buttons.php

сайт\media\zoo\applications\jbuniversal\elements\jbpriceadvance\tmpl\_buttons.php

Для ссылки с атрибутом href="#add-to-cart" дописываем id="<?php echo $this->getItem()->id;?>"

d6fc1e_200x0.png

Теперь в исходном коде у кнопки(ссылке) на добавление в корзину мы увидим id которое равно id элементу

e3e946_200x0.png

 

2. Дописываем стиль блоку teaser - a

В jbzoo.css или же в стилях шаблона дописываем:

.jbzoo-item-teaser{
    position: relative;
}

3. Добавляем блок JS кода в head шаблона

Я использую стандартный шаблон joomla

<script>
	jQuery(function($){
		$("a.jsAddToCart").click(function(){

			var itemID          = $(this).attr('id');
			var basketPosition  = $(".jsJBZooModuleBasket").offset();
			var imagePosition   = $('a[rel=jbimage-gallery-'+ itemID +'] .jbimage').offset();
			var image           = $('a[rel=jbimage-gallery-'+ itemID +'] .jbimage');
			var posit           = basketPosition.left - imagePosition.left;
			var top             = basketPosition.top - imagePosition.top;

			$(image).clone().css({
				'top'       : '10px',
				'left'      : '20px',
				'position'  : 'absolute'
			}).prependTo($('a[rel=jbimage-gallery-'+ itemID +']')).animate({
					opacity : 0.6,
					zIndex  : 9999,
					top     : "-100px",
					left    : "50px"
				}, 300).animate({
					width   : "100px",
					height  : "100px",
					left    : posit + "px",
					top     : top + 'px'
				}, 1000).hide(300,function(){jQuery(this).remove();});

		});
	});
</script>

122edf_200x0.png

 

В js коде можно увидеть 2 функции animate() - именно с помощью них происходит анимация "перелета" картинки в корзину.

 

Первая функция animate задет прозрачность и немного поднимает изображение, а вторая функция анимации с помощью переменных posit и top(эти 2 переменные обязательны) перемещает картинку к корзине.

 

Все готово.

 

ВНИМАНИЕ!!!

 

1.   Тестировалось на JBZoo 2.0.2, подойдут так же ранние версии начиная с v 2.0.X.

2.   При следующих обновлениях эти изменения могут пострадать.

3.   При появлении проблем Тех.Поддержка ответственности не несет. 


  • 12


#27600 Шаблон Cloud Zoom для элемента JBImage

Написано Cheren-dow на 24 September 2013 - 07:26

Cloud Zoom - jQuery плагин который создает эффект лупы для изображений. Во многих интернет магазинах кто то уже видел что то подобное, а сейчас мы сделаем интеграцию Cloud  Zoom jQuery Plugin с элементом JBImage.
 
1. Скачиваем плагин Cloud Zoom и раскладываем файлы по папкам
Так как последние версии этого плагина платные мы будем использовать более раннюю версию (1.0.2) и она ни чем не хуже.
Скачиваем архив с файлами.Прикрепленный файл  cloud-zoom.zip   7.12К   380 Количество загрузок:
 
В архиве находятся 2 js файла и файл css стилей. Из них нам потребуются:

  • cloud-zoom.1.0.2.js
  • cloud-zoom.css

Распаковываем архив в папку.
 
Т.к мы будем следовать логике JBZoo давайте переименуем файлы следующим образом:

  • cloud-zoom.1.0.2.js в jquery.cloud-zoom.js
  • cloud-zoom.css в jbzoo.cloud-zoom.css

Теперь переместим jquery.cloud-zoom.js в папку

сайт\media\zoo\applications\jbuniversal\assets\js\

а jbzoo.cloud-zoom.css в

сайт\media\zoo\applications\jbuniversal\assets\css\

Файлы в нужных местах.
 
 
 
2. Создаем шаблон для Cloud Zoom в файле jbimage.xml
Переходим в папку и открываем фал jbimage.xml

сайт\media\zoo\applications\jbuniversal\elements\jbimage\

Находим блок параметров template

<param name="template" type="list" default="default" label="JBZOO_JBIMAGE_TEMPLATE"
      description="JBZOO_JBIMAGE_TEMPLATE_DESC">
      <option value="default">JBZOO_DEFAULT</option>
      <option value="link">JBZOO_LINK</option>
      <option value="itemlink">JBZOO_ITEM_LINK</option>
      <option value="popup">JBZOO_POPUP</option>
 </param>

и добавляем option

<param name="template" type="list" default="default" label="JBZOO_JBIMAGE_TEMPLATE"
    description="JBZOO_JBIMAGE_TEMPLATE_DESC">
    <option value="default">JBZOO_DEFAULT</option>
    <option value="link">JBZOO_LINK</option>
    <option value="itemlink">JBZOO_ITEM_LINK</option>
    <option value="popup">JBZOO_POPUP</option>
    <option value="cloud">JBZOO_CLOUD_ZOOOM</option>
</param>

Теперь добавим константу JBZOO_CLOUD_ZOOOM в файл русской локализации. Открываем файл ru-RU.ini

сайт\media\zoo\applications\jbuniversal\language\ru-RU\ru-RU.com_jbzoo.ini

И в самом низу добавляем строку

JBZOO_CLOUD_ZOOOM = "Cloud Zoom"

Перейдем в тип, например шаблон FULL и в элементе jbimage выберем только что созданный шаблон Cloud Zoom.
ssm5a761c2a_200x0.png
Сохраняем.
 
 
 
3. Вывод шаблона Cloud для нашего изображения
Первым делом переходим в папку 

сайт\media\zoo\applications\jbuniversal\elements\jbimage\tmpl

и создаем фал jbimage-cloud.php - этот файл будет шаблоном.
 
Теперь нужно добавить немного кода в функции _render в файле:

сайт\media\zoo\applications\jbuniversal\elements\jbimage\jbimage.php

Нам нужен последний elseif - конкретно этот:

} elseif ($template == 'popup') {

	$appendClass = 'jbimage-gallery';
	if ((int)$params->get('group_popup', 1)) {
		$rel = 'jbimage-gallery-' . $this->getItem()->id;
	}

	$target      = '_blank';
	$widthPopup  = (int)$params->get('width_popup', 0);
	$heightPopup = (int)$params->get('height_popup', 0);

	if ($image) {
		$url = $this->_jbimage->getUrl($this->get('file'));
		if ($widthPopup || $heightPopup) {
			$newImg = $this->_jbimage->resize($image->orig, $widthPopup, $heightPopup);
			$url    = $newImg->url;
		}
	}
}

После этой проверки добавляем ещё одну. Должно быть так:

} elseif ($template == 'popup') {

	$appendClass = 'jbimage-gallery';
	if ((int)$params->get('group_popup', 1)) {
		$rel = 'jbimage-gallery-' . $this->getItem()->id;
	}

	$target      = '_blank';
	$widthPopup  = (int)$params->get('width_popup', 0);
	$heightPopup = (int)$params->get('height_popup', 0);

	if ($image) {
		$url = $this->_jbimage->getUrl($this->get('file'));
		if ($widthPopup || $heightPopup) {
			$newImg = $this->_jbimage->resize($image->orig, $widthPopup, $heightPopup);
			$url    = $newImg->url;
		}
	}
} elseif($template == 'cloud'){ // если выбранный шаблон есть наш cloud

	$appendClass = 'cloud-zoom'; // устанавливаем необходимы class
/**
*       $rel - это атрибут rel для ссылки которая ссылается на большое изображение.
*       Именно в нем будут находится все настройки для плагина.
*       Чуть ниже в статье мы сделаем 3 основных параметра(настройки)
*       для нашего шаблона которыми будем управлять из админки. А пока оставим так. 
*       Обо всех параметрах в атрибуте rel будет написано ниже.
*/
	$rel = 'adjustX: 10 , adjustY: -4, softFocus: true';

	$target      = '_blank';
	$widthPopup  = (int)$params->get('width_popup', 0);
	$heightPopup = (int)$params->get('height_popup', 0);

	if ($image) {
		$url = $this->_jbimage->getUrl($this->get('file'));
		if ($widthPopup || $heightPopup) {
			$newImg = $this->_jbimage->resize($image->orig, $widthPopup, $heightPopup);
			$url    = $newImg->url;
		}
	}
}

Сохраним файл.
 
Теперь открываем недавно созданный шаблон(вид) - это файл jbimage-cloud.php находится по адресу:

сайт\media\zoo\applications\jbuniversal\elements\jbimage\tmpl\jbimage-cloud.php

И вставляем в него следующие строки:

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

echo '<a ' . $linkAttrs . '><img ' . $imageAttrs . ' /></a> ' . "\n";

Сохраним и посмотрим на сайте что  у нас получилось. Сейчас видно что наш шаблон cloud для JBImage работает. 
ssmf87b187f_200x0.jpg
Но ни какой "лупы" мы не наблюдаем. Все потому что мы не подключили jquery.cloud-zoom.js и jbzoo.cloud-zoom.css.
 
 
 
4. Подключаем jquery.cloud-zoom.js и jbzoo.cloud-zoom.css
Эти файлы можно на прямую подключить в файле:

сайт\media\zoo\applications\jbuniversal\elements\jbimage\tmpl\jbimage-cloud.php

Но так как мы придерживаемся логике JBZoo мы сделаем немножко по другому.
 
Открываем файл jbassets.php. Он располагается тут:

сайт\media\zoo\applications\jbuniversal\framework\helpers\jbassets.php

Добавляем следующий код(функцию подключения файлов) где нибудь после функции public function fancybox() (не принципиально)

/**
* Include Cloud Zoom
*/
public function cloudzoom(){
	$this->jQuery();
	$this->_include(array('jbassets:css/libraries.css'), 'css');
	$this->_include(array('jbassets:js/jquery.cloud-zoom.js',), 'js');
}
public function jbimageCloudZoom(){
    $this->jQuery();
    $this->cloudzoom();
}

Сохраняем. Переходим на страницу сайта с изображением, обновим и опять ничего не работает. А не работает потому что не вызвали функцию jbimageCloudZoom в файле шаблона(вида) jbimage-cloud.php. Перейдем в файл jbimage-cloud.php и вызовем эту функцию. Теперь файл должен иметь следующий вид:

<?php
defined('_JEXEC') or die('Restricted access');
/**
* Подключаем css и js файлы
*/
App::getInstance('zoo')->jbassets->jbimageCloudZoom();

echo '<a ' . $linkAttrs . '><img ' . $imageAttrs . ' /></a> ' . "\n";

Теперь "Лупа" должна работать. Проверяем и видим:
ssme2abb0e1_200x0.jpg
 
Все работает.
 
 
 
5. Совершенствуем 
Сейчас добавим несколько параметров для управления элементом из админ панели.
1. Открываем файл локализации:

сайт\media\zoo\applications\jbuniversal\language\ru-RU\ru-RU.com_jbzoo.ini

Добавляем вниз:

JBZOO_RESIZE_CLOUD_X = "Положение по X"
JBZOO_RESIZE_CLOUD_X_DESCRIPTION = "Позволяет точно установить положение окна в px большого изображение по оси Х"
JBZOO_RESIZE_CLOUD_Y = "Положение по Y"
JBZOO_RESIZE_CLOUD_Y_DESCRIPTION = "Позволяет точно установить положение окна в px большого изображение по оси Y"
JBZOO_JBIMAGE_CLOUD_POSITION = "Позиция"
JBZOO_JBIMAGE_CLOUD_POSITION_DESCRIPTION = "Определяет положение окна большого изображения по отношению к уменьшенной копии. Возможные занчения: 'left', 'right', 'top', 'bottom', 'inside' или можно задать ID элемента HTML, например, position: 'element1'"
JBZOO_JBIMAGE_CLOUD_LEFT = "Слева"
JBZOO_JBIMAGE_CLOUD_RIGHT = "Справа"
JBZOO_JBIMAGE_CLOUD_TOP = "Сверху"
JBZOO_JBIMAGE_CLOUD_BOTTOM = "Снизу"
JBZOO_JBIMAGE_CLOUD_INSIDE = "Внутри"
JBZOO_RESIZE_CLOUD_TITLE = "Показать заголовок"
JBZOO_RESIZE_CLOUD_TITLE_DESCRIPTION = "Выводить содержание тега title. True или false."

2. Открываем файл jbimage.xml и заменяем все его содержание эти листингом


<?xml version="1.0" encoding="utf-8"?>
<!--
    JBZoo App is universal Joomla CCK, application for YooTheme Zoo component

    @package     jbzoo
    @version     2.x Pro
    @author      JBZoo App http://jbzoo.com
    @copyright   Copyright (C) JBZoo.com,  All rights reserved.
    @license     http://jbzoo.com/license-pro.php JBZoo Licence
    @coder       Denis Smetannikov <denis@jbzoo.com>
-->
<element type="jbimage" group="JBZoo">
    <name>JBZoo Image</name>
    <description>JBZoo image element</description>
    <author>JBZoo.com</author>
    <creationDate>2013 07</creationDate>
    <copyright>Copyright (C) JBZoo.com,  All rights reserved.</copyright>
    <authorEmail>admin@jbzoo.com</authorEmail>
    <authorUrl>http://jbzoo.com</authorUrl>
    <version>1.0</version>
    <params>
        <param name="upload_directory" type="text" default="images/uploads/" label="JBZOO_UPLOAD_DIRECTORY"
               description="JBZOO_UPLOAD_DIRECTORY_DESC"/>

        <param name="max_upload_size" type="text" default="512" label="JBZOO_MAX_UPLOAD_SIZE"
               description="JBZOO_MAX_UPLOAD_SIZE_DESC"/>

        <param name="upload_by_user" type="jbbool" default="0" label="JBZOO_JBIMAGE_UPLOAD_BY_USER"
               description="JBZOO_JBIMAGE_UPLOAD_BY_USER_DESC"/>

        <param name="default_enable" type="jbbool" default="0" label="JBZOO_JBIMAGE_DEFAULT_ENABLE"
               description="JBZOO_JBIMAGE_DEFAULT_ENABLE_DESC"/>

        <param name="default_image" type="text" default="" label="JBZOO_JBIMAGE_DEFAULT"
               description="JBZOO_JBIMAGE_DEFAULT_DESC"/>

    </params>
    <params group="render">
        <param name="separated_by" type="zoolist" default="Space" label="Separated by"
               description="CHOOSE_SEPARATOR_REPEATED_ELEMENTS">
            <option name="Space"><![CDATA[separator=[ ]]]></option>
            <option name="Break"><![CDATA[separator=[<br />]]]></option>
            <option name="Span"><![CDATA[tag=[<span>%s</span>]]]></option>
            <option name="Paragraph"><![CDATA[tag=[<p>%s</p>]]]></option>
            <option name="Div"><![CDATA[tag=[<div>%s</div>]]]></option>
            <option name="List Item"><![CDATA[tag=[<li>%s</li>]]]></option>
            <option name="Unordered List"><![CDATA[tag=[<li>%s</li>] enclosing_tag=[<ul>%s</ul>]]]></option>
            <option name="Ordered List"><![CDATA[tag=[<li>%s</li>] enclosing_tag=[<ol>%s</ol>]]]></option>
            <option name="Warp Item"><![CDATA[tag=[<article class="item">%s</article>]]]></option>
        </param>

        <param name="display" type="list" default="all" label="Display"
               description="CHOOSE_RENDERING_MODE_ELEMENT_POSITION">
            <option value="all">all</option>
            <option value="first">first</option>
            <option value="all_without_first">all without first</option>
        </param>

        <param name="template" type="list" default="default" label="JBZOO_JBIMAGE_TEMPLATE"
               description="JBZOO_JBIMAGE_TEMPLATE_DESC">
            <option value="default">JBZOO_DEFAULT</option>
            <option value="link">JBZOO_LINK</option>
            <option value="itemlink">JBZOO_ITEM_LINK</option>
            <option value="popup">JBZOO_POPUP</option>
            <option value="cloud">JBZOO_CLOUD_ZOOOM</option>
        </param>

        <param name="group_popup" type="jbbool" default="1" label="JBZOO_GROUP_POPUP"
               description="JBZOO_GROUP_POPUP_DESC"/>

        <param name="width" type="text" default="400" label="JBZOO_RESIZE_WIDTH"
               description="JBZOO_RESIZE_WIDTH_DESC"/>

        <param name="height" type="text" default="300" label="JBZOO_RESIZE_HEIGHT"
               description="JBZOO_RESIZE_WIDTH_DESC"/>

        <param name="@advanced_label" type="jbspacer" default="JBZOO_JBPRICE_FOR_POPUP_TEMPLATE"/>

        <param name="width_popup" type="text" default="1280" label="JBZOO_RESIZE_POPUP_WIDTH"
               description="JBZOO_RESIZE_WIDTH_POPUP_DESC"/>

        <param name="height_popup" type="text" default="800" label="JBZOO_RESIZE_POPUP_HEIGHT"
               description="JBZOO_RESIZE_WIDTH_POPUP_DESC"/>

        <param name="@advanced_label2" type="jbspacer" default="JBZOO_JBPRICE_FOR_CLOUD_ZOOM_TEMPLATE"/>

        <param name="cloud_width" type="text" default="400" label="JBZOO_RESIZE_WIDTH"
               description="JBZOO_RESIZE_WIDTH_DESC"/>

        <param name="cloud_height" type="text" default="300" label="JBZOO_RESIZE_HEIGHT"
               description="JBZOO_RESIZE_WIDTH_DESC"/>

        <param name="show_cloud_title" type="radio" default="1" label="JBZOO_RESIZE_CLOUD_TITLE"
               description="JBZOO_RESIZE_CLOUD_TITLE_DESCRIPTION">
            <option value="0">JNO</option>
            <option value="1">JYES</option>
        </param>

        <param name="x_cloud" type="text" default="10" label="JBZOO_RESIZE_CLOUD_X"
               description="JBZOO_RESIZE_CLOUD_X_DESCRIPTION"/>

        <param name="y_cloud" type="text" default="-4" label="JBZOO_RESIZE_CLOUD_Y"
               description="JBZOO_RESIZE_CLOUD_Y_DESCRIPTION"/>

        <param name="cloud_position" type="list" default="default" label="JBZOO_JBIMAGE_CLOUD_POSITION"
               description="JBZOO_JBIMAGE_CLOUD_POSITION_DESCRIPTION">
            <option value="left">JBZOO_JBIMAGE_CLOUD_LEFT</option>
            <option value="right">JBZOO_JBIMAGE_CLOUD_RIGHT</option>
            <option value="top">JBZOO_JBIMAGE_CLOUD_TOP</option>
            <option value="bottom">JBZOO_JBIMAGE_CLOUD_BOTTOM</option>
            <option value="inside">JBZOO_JBIMAGE_CLOUD_INSIDE</option>
        </param>

    </params>
</element>
 

Были добавлены параметры, увидеть разницу с начальным вариантом не составит труда.
 
3. Открываем файл:

сайт\media\zoo\applications\jbuniversal\elements\jbimage\jbimage.php

и ищем наше условие elseif($template == 'cloud'). Тут у нас есть переменная $rel замените ее на следующею строку:

 $rel = 'position:\''.$params->get('cloud_position', 'right').'\' , zoomWidth: '.$params->get('cloud_width', 400).' , zoomHeight: '.$params->get('cloud_height', 300).' , showTitle: '.$params->get('show_cloud_title', 1).', adjustX: '.$params->get('x_cloud', 10).' , adjustY: '.$params->get('y_cloud', -4).', softFocus: true';

Тут мы принимаем и выводим установленные значения. 
 
Теперь перейдем в админку и посмотрим что у нам появилось в настройках элемента.
ssmbbc575d5_200x0.png
 
Как видите настройки разделены на 2 "блока" и элемент дополнился дополнительными настройками для Cloud Zoom. Это основные параметры плагина, а если кому то нужно больше(из всех возможных в плагине) вы можете добавить свои параметры по аналогии.
 
Для самых ленивых прикрепляю архив со всеми изменениями.Прикрепленный файл  jbimage+cloud_zoom.zip   16.91К   336 Количество загрузок:
Распаковать в корень сайта с заменой файлов.
 
ВНИМАНИЕ!!!

  • Будьте внимательны при замене файлов.
  • Проверьте с начало на тестовом сайте а уже потом загружайте на рабочий сайт.
  • Хак тестировался на JBZoo 2.0.2, подойдут так же ранние версии начиная с v 2.0.X.
  • Не забывайте - это хак и при следующих обновлениях эти изменения могут пострадать.
  • При появлении проблем Тех.Поддержка ответственности не несет. 

  • 12


Click to return to top of page in style!