Каталог Товаров
#1
Отправлено 16 Апрель 2011 - 22:55
Скажите, пожалуйста,в разворачиваемом меню кат. товаров слева, можно сделать так чтобы:
по клику на знак + или стрелочка меню разворачивается без смены страницы
по клику на пункт меню — меню разворачивается и происходит переход на
новую страницу
#2
Отправлено 19 Апрель 2011 - 21:24
http://code.google.c.../downloads/list
или jquery menuTree
http://plugins.jquer...roject/menuTree
Я для простоты примера выберу втрой плагин, он добавляется проще, поэтому приступим:
1) Скачиваем архив плагина отсюда:
https://github.com/p...enuTree-Plugin/
и закачиваем файл в редактор тем.
2) Вставляем загрузку плагина в шаблоне "html", после загрузки основного списка скриптов как написано в документации, путь берём из картинки выше:
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.plugin.menuTree.pack.js"></script>
У меня получилось так:
<!-- Скрипты которые не нужно менять, грузятся из папки общих файлов --> <!-- Это собранные в один файл скрипты из файлов: {FORALL_JS_PATH}jquery-1.4.2.min.js {FORALL_JS_PATH}jquery.nyroModal-1.6.2.min.js {FORALL_JS_PATH}jquery-ui-1.8.4.custom.min.js {FORALL_JS_PATH}jquery.validate.min.js {FORALL_JS_PATH}jquery.capslock.min.js --> <script type="text/javascript" src="{FORALL_JS_PATH}jquery-1.4.2_nyroModal-1.6.2_validate_capslock_jquery-ui-1.8.4.custom.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js" type="text/javascript" charset="utf-8"></script>
3) В том же шаблоне "html" вместо старого массива категорий выдаём полный список категорий. Было:
{%IFNOT catalog_empty %} {% FOR catalog %} {% IFNOT catalog.HIDE %} {% IF catalog.FIRST %}<ul>{% ENDIF %} <li> <a href="{catalog.URL}" {% IF catalog.CURRENT %} class="contentTbodyCatalogCurent" {% ELSEIF catalog.CURRENT_PARENT %} class="contentTbodyCatalogCurentBranch" {% ENDIF %} > {catalog.NAME} <!-- Отображение количества товаров в категории --> {% IF catalog.GOODS_COUNT>0 %} ({catalog.GOODS_COUNT}) {% ENDIF %} </a> {% IF catalog.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog.LAST %} {% FOR out %}</ul>{%IFNOT catalog.out.LAST %}</li>{% ENDIF %}{% ENDFOR %} {% ENDIF %} {% ENDIF %} {% ENDFOR %} {% ENDIF %}
Стало:
{%IFNOT catalog_full_empty %} {% FOR catalog_full %} {% IFNOT catalog_full.HIDE %} {% IF catalog_full.FIRST %}<ul id="myTree">{% ENDIF %} <li> <a href="{catalog_full.URL}" {% IF catalog_full.CURRENT %} class="contentTbodycatalog_fullCurent" {% ELSEIF catalog_full.CURRENT_PARENT %} class="contentTbodycatalog_fullCurentBranch" {% ENDIF %} {% IF catalog_full.ISSET_SUB %}rel="withchild"{% ENDIF %} > {catalog_full.NAME} <!-- Отображение количества товаров в категории --> {% IF catalog_full.GOODS_COUNT>0 %} ({catalog_full.GOODS_COUNT}) {% ENDIF %} </a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %} {% FOR out %}</ul>{%IFNOT catalog_full.out.LAST %}</li>{% ENDIF %}{% ENDFOR %} {% ENDIF %} {% ENDIF %} {% ENDFOR %} {% ENDIF %}
4) Как просят в документации, добавляем простенькие стили в конец файла "main.csstemplate":
#myTree .menuTree:before { content: "[+] "; } #myTree .expanded:before { content: "[-] "; } #myTree .collapsed { display: none; }
5) В файле main.js допишем код который нас просят добавить в документации:
$(document).ready(function() { $('#myTree').menuTree({ animation: true, handler: 'slideToggle', anchor: 'a[rel="withchild"]', trace: false }); });
6) Если всё делалось по инструкции получается примерно так:
А вообще изменять отображение дерева категорий можно как угодно, здесь Вы ничем не ограничены, в сочетании с волшебными функциями
{print_vars},
{print_arrays}и этой веткой форума Вы получите в подарок счастье
#3
Отправлено 21 Апрель 2011 - 21:39
<script src="http://ajax.googleap.../jquery.min.js" type="text/javascript" charset="utf-8"></script>
#4
Отправлено 22 Апрель 2011 - 00:25
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.plugin.menuTree.pack.js"></script>предполагает - что вы перешли по адресу http://plugins.jquer...roject/menuTree
далее там скачали библиотеку menuTree, после нашли файл jquery.plugin.menuTree.pack.js
Затем залили его в разделе редактора темы.
#5
Отправлено 23 Апрель 2011 - 13:29
1)Скачал архив jQuery-MenuTree-Plugin-v0.7, распаковал, добавил файл jquery.plugin.menuTree.pack.js в стили и скрипты
2)в html шаблон добавил строчку <script type="text/javascript" src="{ASSETS_JS_PATH}jquery.plugin.menuTree.pack.js"></script> получилось:
<!-- Скрипты которые не нужно менять, грузятся из папки общих файлов --> <!-- Это собранные в один файл скрипты из файлов: {FORALL_JS_PATH}jquery-1.4.2.min.js {FORALL_JS_PATH}jquery.nyroModal-1.6.2.min.js {FORALL_JS_PATH}jquery-ui-1.8.4.custom.min.js {FORALL_JS_PATH}jquery.validate.min.js {FORALL_JS_PATH}jquery.capslock.min.js --> <script type="text/javascript" src="{FORALL_JS_PATH}jquery-1.4.2_nyroModal-1.6.2_validate_capslock_jquery-ui-1.8.4.custom.min.js"></script> <script type="text/javascript" src="{ASSETS_JS_PATH}jquery.plugin.menuTree.pack.js"></script>
3) заменил старый код <!-- Каталог товаров --> на:
{%IFNOT catalog_full_empty %} {% FOR catalog_full %} {% IFNOT catalog_full.HIDE %} {% IF catalog_full.FIRST %}<ul id="myTree">{% ENDIF %} <li> <a href="{catalog_full.URL}" {% IF catalog_full.CURRENT %} class="contentTbodycatalog_fullCurent" {% ELSEIF catalog_full.CURRENT_PARENT %} class="contentTbodycatalog_fullCurentBranch" {% ENDIF %} {% IF catalog_full.ISSET_SUB %}rel="withchild"{% ENDIF %} > {catalog_full.NAME} <!-- Отображение количества товаров в категории --> {% IF catalog_full.GOODS_COUNT>0 %} ({catalog_full.GOODS_COUNT}) {% ENDIF %} </a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %} {% FOR out %}</ul>{%IFNOT catalog_full.out.LAST %}</li>{% ENDIF %}{% ENDFOR %} {% ENDIF %} {% ENDIF %} {% ENDFOR %} {% ENDIF %}
все подкаталоги открылись, их уже нельзя свернуть
4) добавил как указанно в конец файла
5) вставил в файл main.js в $(document).ready(function() { указанный код
В результате все подкаталоги открылись(в меню каталога товаров), закрыть их нельзя знак + и - не появились
где я допустил ошибку подскажите
#6
Отправлено 23 Апрель 2011 - 20:04
#8
Отправлено 25 Апрель 2011 - 12:49
http://menutree.pixe...gin.menuTree.js
закачав файл по выше данной ссылку, а так же изменить путь в шаблоне "html"
c этого
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.plugin.menuTree.pack.js"></script>
на
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.plugin.menuTree.js"></script>
#9
Отправлено 26 Апрель 2011 - 07:24
#10
Отправлено 08 Июнь 2011 - 00:30
#11
Отправлено 08 Июнь 2011 - 08:58
#12
Отправлено 08 Июнь 2011 - 12:14
Попробуйте заменить свой файл jquery.plugin.menuTree.pack.js на этот
http://menutree.pixe...gin.menuTree.js
закачав файл по выше данной ссылку, а так же изменить путь в шаблоне "html"
c этого
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.plugin.menuTree.pack.js"></script>
на
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.plugin.menuTree.js"></script>
но ничего не изменяется.
Я просто хочу сделать меню каталога товаров выпадающим.
#13
Отправлено 09 Июнь 2011 - 08:23
#15
Отправлено 14 Июнь 2011 - 17:16
#16
Отправлено 29 Сентябрь 2011 - 20:28
#17
Отправлено 01 Октябрь 2011 - 09:46
http://forum.storela...ndpost__p__3063
попробуйте еще раз внимательнее прочитать данную тему. Вы упустили несколько моментов.
#18
Отправлено 26 Октябрь 2011 - 12:48
Только как теперь мне можно чуть изменить фон выпадающих категорий? чтобы они хоть немного отличались. Заранее благодарю.
Мой сайт для примера
#19
Отправлено 27 Октябрь 2011 - 19:10
#myTree li ul li a:link, #myTree li ul li a:visited { color: #222; }
и далее изменить свойство color на любой цвет.
#20
Отправлено 27 Октябрь 2011 - 21:35
Vaccina (01 Октябрь 2011 - 09:46) писал:
http://forum.storela...ndpost__p__3063
попробуйте еще раз внимательнее прочитать данную тему. Вы упустили несколько моментов.
Сделал как описано, но без результата.
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных