Да, конечно же можно, для этого понадобится подправить код в разделе "Сайт" > "Редактор тем", взяв например Jquery JsTree:
http://code.google.c.../downloads/list
или jquery menuTree
http://plugins.jquer...roject/menuTree
Я для простоты примера выберу втрой плагин, он добавляется проще, поэтому приступим:
1) Скачиваем архив плагина отсюда:
https://github.com/p...enuTree-Plugin/
jstree-download-page.png
и закачиваем файл в редактор тем.
jstree-upload.png
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) Если всё делалось по инструкции получается примерно так:
jstree-view-1.png
jstree-view-2.png
А вообще изменять отображение дерева категорий можно как угодно, здесь Вы ничем не ограничены, в сочетании с волшебными функциями
{print_vars}
,
{print_arrays}
и
этой веткой форума Вы получите в подарок счастье