Категории

[FAQ] Часто задаваемые вопросы и ответы

Проблемы и решения

Ошибки и исправления

Общие вопросы

Расширения

Установка и обновление

Модули

Шаблоны

Локализация интерфейса

Коммерческие предложения

Учимся бизнесу

Бизнес книги

Поисковая оптимизация (SEO)

Магазины на ShopOS

Хостинг для ShopOS

Предложения и пожелания

Курилка

РЕШЕНО - открывающийся список подкатегорий в блоке

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

Решение может быть не самое лучшее, но рабочее ;D

Такое меню без проблем работает в шаблоне default.
Для остальных шаблонов ковыряйте свои CSS стили. Если, что-то не получается, то подробно описываем проблему тут.

Итак.
Топаем в - themes\ВАШ ШАБЛОН\source\inc\show_category.inc.php
Ищем код

$Aktiv = false;

Заменяем его на
$Aktiv = ' CurrentHide';

Сохраняем.

Далее открываем - themes\ВАШ ШАБЛОН\style.css
Добавляем в него
.CategoryMinus {cursor: pointer;font-weight: bold;color: red;}
.CategoryPlus {cursor: pointer;font-weight: bold;color: green;}


Далее открываем - themes\ВАШ ШАБЛОН\javascript\general.js.php
И ниже ?> вставляем
<script language="javascript" type="text/javascript" src="/jscript/jquery/jquery.js"></script>
<script language="javascript" type="text/javascript">
    var Minus = jQuery('<span onclick="javascript:fspand(this);" class="CategoryMinus">-</span> ');
    var Plus = jQuery('<span onclick="javascript:fspand(this);" class="CategoryPlus">+</span> ');
    function fspand(e) {
        var sp = jQuery(e);
        var obj = sp.parent().find("ul");
        if(obj.is(":hidden")) {
            obj.animate({height: "show"},300);
            sp.removeClass("CategoryPlus");
            sp.text("-").addClass("CategoryMinus");
        }
        else
        {
            obj.animate({height: "hide"},300);
            sp.removeClass("CategoryMinus");
            sp.text("+").addClass("CategoryPlus");
        }
    }
    jQuery(document).ready(
        function() {
                jQuery("ul#CatNavi > li.SubMenue.CurrentHide").prepend(Plus);
                jQuery("ul#CatNavi > li.SubMenue.CurrentHide > ul").hide();
                jQuery("ul#CatNavi > li.SubMenue.Current").prepend(Minus);
                jQuery("ul#CatNavi > li.SubMenue.CurrentParent").prepend(Minus);
            }
        );
</script>


Все.

Еще один вариант в виде аккордеона http://www.shopos.ru/forum/index.php?topic=6266.0

.


А примера работы нет?


Рядом с меню категории появися + , но только у тех категорий где есть подкатегории. При его нажатии выпадут подкатегории


Пытался так сделать,не получилось, крестиков нету и подразделы видны сразу,скрыть их нельзя, то есть они не разворачиваются.



Пытался так сделать,не получилось, крестиков нету и подразделы видны сразу,скрыть их нельзя, то есть они не разворачиваются.

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


Проверил еще раз. Все работает.
У кого не работает, то копируйте файл show_category.inc.php из шаблона default. Ну и CSS стили подстраивайте если нужно.


Спасибо всё получилось! А как зделать что бы не появлялся + а при нажатии на папки откривалась подкатегория ?


Всем здрасти! Спасибо автору, сделал как написано, все работает, есть (+/-) открывается список категорий, но вот только страница все равно перезагружается, и выводит раздел с подкатегориями, что не так? Делал на шаблоне default!


Жать надо не на ссылку категории а на +\-



Жать надо не на ссылку категории а на +\-

Все получается, и работает, спасибо!


NeBox а немогли бы вы написать такое же руководство, куда, что вставлять, только уже для Подкатегории, и можно ли как то увеличить размер (+/-), заранее спасибо!


Для увеличенияя + и - надо добавить в стили

.CategoryMinus, .CategoryPlus {font-size:1.4em;}

1.4em - меняйте на что вам нужно.

для подкатегорий не пробовал, если время будет попробую ;)



Для увеличенияя + и - надо добавить в стили
.CategoryMinus, .CategoryPlus {font-size:1.4em;}

1.4em - меняйте на что вам нужно.

для подкатегорий не пробовал, если время будет попробую ;)

Спасибо NeBox, все получилось! Извиняюсь возможно за глупые вопросы, просто только начинаю осваивать это все, и наглядные примеры очень помогают! :)


Использую єтот скриптик http://jquery.bassistance.de/treeview/demo/



Использую єтот скриптик http://jquery.bassistance.de/treeview/demo/


брать этот код?
и куда этот код добавлять?

$(document).ready(function(){

// first example
$("#navigation").treeview({
persist: "location",
collapsed: true,
unique: true
});

// second example
$("#browser").treeview();
$("#add").click(function() {
var branches = $("<li><span class='folder'>New Sublist</span><ul>" +
"<li><span class='file'>Item1</span></li>" +
"<li><span class='file'>Item2</span></li></ul></li>").appendTo("#browser");
$("#browser").treeview({
add: branches
});
branches = $("<li class='closed'><span class='folder'>New Sublist</span><ul><li><span class='file'>Item1</span></li><li><span class='file'>Item2</span></li></ul></li>").prependTo("#folder21");
$("#browser").treeview({
add: branches
});
});

// third example
$("#red").treeview({
animated: "fast",
collapsed: true,
unique: true,
persist: "cookie",
toggle: function() {
window.console && console.log("%o was toggled", this);
}
});

// fourth example
$("#black, #gray").treeview({
control: "#treecontrol",
persist: "cookie",
cookieId: "treeview-black"
});

});


в первом посте же написано

Далее открываем - themes\ВАШ ШАБЛОН\javascript\general.js.php
И ниже ?> вставляем


У кого нибудь получилось? А  то у меня, что то не получается, пробовал заменять и добавлять этот код, но не сростается! 


Стандартно будет работать в шаблоне default. Проверено не однократно.
В остальных шаблона возможно нужно под себя пилить CSS стили.


Вставляю именно в этот шаблон Default, список категорий и подкатегорий получается весь раскрытый!


Правьте пути к Jquery который подключаете через general.js.php. Шопос в отдельной папке установлен, да?


Правьте пути к Jquery который подключаете через general.js.php. Шопос в отдельной папке установлен, да?

делаю все на shopos-portable, в шаблоне defauit, Шопос вроде в отдельной папке! Подскажите, что надо править, ничего не получается, голова уже пухнет!  :o


хочу чтобы подкатегории сразу показывались, расскажите как сделать, в личку!!!


---


Добрый день!

как можно сделать так чтоб при нажатие на Название категорий либо на + открывался список.
Пример:
У меня так:
+ Категория 1 (Пустая Папка без товара)
>ПодКат 1 (10 товаров в папке)
>ПодКат 2 (10 Товаров в Папке)

Хотелось бы при нажатие на Категория 1 открывался список без перезагрузки ст.
А далее как все и должно быть, при нажатие на ПодКат 1 или ПодКат 2 открывалась ст. с товаром.

Спасибо


Код для скрытия/раскрытия каждой категории:

<script language="javascript" type="text/javascript" src="/jscript/jquery/jquery.js"></script>
<script language="javascript" type="text/javascript">
    var Minus = jQuery('<span onclick="javascript:fspand(this);" class="CategoryMinus">-</span> ');
    var Plus = jQuery('<span onclick="javascript:fspand(this);" class="CategoryPlus">+</span> ');
    function fspand(e) {
        var sp = jQuery(e);
var obj = sp.parent().find("ul:first");
        if(obj.is(":hidden")) {
            obj.animate({height: "show"},300);
            sp.removeClass("CategoryPlus");
            sp.text("-").addClass("CategoryMinus");
        }
        else
        {
            obj.animate({height: "hide"},300);
            sp.removeClass("CategoryMinus");
            sp.text("+").addClass("CategoryPlus");
        }
    }


jQuery(document).ready(
        function() {

                jQuery("li.SubMenue.CurrentHide").prepend(Plus);

               

                jQuery("li.SubMenue.CurrentParent").prepend(Minus);

for (z=10; z > 0; z--)
{
jQuery("li.CurrentHide.CatLevel"+z+" > ul").hide();
       
}

jQuery("li.SubMenue.Current").prepend(Plus);

            }
        );

</script>


А можно ли как-то +/- заменить на картинки? стрелки чтоб можно было подставить или картинку категории.


там два стиля
CategoryMinus
CategoryPlus

добавьте в CSS картинки к тим, и все.



Для увеличенияя + и - надо добавить в стили
.CategoryMinus, .CategoryPlus {font-size:1.4em;}

1.4em - меняйте на что вам нужно.


Может подскажите, где в стилях отредактировать параметры, категорий и подкатегорий, а то при выпадающем меню как то грубо получается.
Например "+" и название раздела выставить на одном уровне. И уменьшить шрифт подкатегорий.


попробуйте
.CategoryMinus, .CategoryPlus {float:left;font-size:1.4em;}

И уменьшить шрифт подкатегорий.

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


Спасибо буду копать :)


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


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


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


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


Всем огромное спасибо за скритп очень помог, но пришлось посидеть часика 4. Разобраться что к чему и настроить сворачивание/развёртывание нажатием на название.  ;D



настроить сворачивание/развёртывание нажатием на название.  ;D

Поделитесь?


Автору спасибо, все заработало сразу...

Присоединяюсь к просьбе!
Пробовал сам +/- названием сделать, но так и не получилось :( Поделитесь плиз кто как решил?


аккордеон-меню пойдет?



Пробовал сам +/- названием сделать, но так и не получилось :( Поделитесь плиз кто как решил?

Символы меняются в двух местах, посмотрите внимательнее.


аккордеон-меню пойдет?

Для удобства, аккордеон должен открываться по щелчку (а не по наведению курсора) и страница не должна самопроизвольно подстраиваться под раскрывшийся список.


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




Пробовал сам +/- названием сделать, но так и не получилось :( Поделитесь плиз кто как решил?

Символы меняются в двух местах, посмотрите внимательнее.

Всмысле смена + и - на что-то другое? Это-то понятно, но это не то что требуется...


аккордеон-меню пойдет?

Пойдет  :)



а по поводу - страница не должна самопроизвольно подстраиваться под раскрывшийся список
не очень понял.


Это, типа, когда большой список уезжает вниз, за пределы экрана, страничка подстраивается, чтобы было видно всё.


Всмысле смена + и - на что-то другое? Это-то понятно, но это не то что требуется...


Понял :) да, не то посоветовал




а по поводу - страница не должна самопроизвольно подстраиваться под раскрывшийся список
не очень понял.


Это, типа, когда большой список уезжает вниз, за пределы экрана, страничка подстраивается, чтобы было видно всё.

а причем тут это, если меню будет в боковой колонке?


Аккордион-меню отменяется?  :)


Пробовал подключить 4 разных аккордион-меню, и вроде как и получается, но страница все равно перезагружается когда на главную кат. нажимаешь (( Где копать?  ???


Никто не подскажет?  :'(


Все замечательно работает.
Только возникла необходимость сделать так, чтобы при нажатии на родительскую категорию также раскрывался список, как при нажатии на знак "+" (чтобы не закгружалась страница родительской категории). Так было бы очень удобно.

Не могли бы подсказать, где нужно менять код?


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


раскрывает менюшку без перезагрузки страницы,


а не могли бы вы ткнуть на решение второй проблемы, а то поиском всё перекопал - готового ответа нет.



При нажатии на родительскую категорию также раскрывается список, как и при нажатии на знак "+"


themes\ВАШ ШАБЛОН\source\inc\show_category.inc.php

Ищем код

$Aktiv = false;

Заменить  его на
$Aktiv = true;

Сохраняем.

Далее открываем - themes\ВАШ ШАБЛОН\style.css
Добавляем
ul.sample-menu { padding:0;margin:10px 15px; }
ul.sample-menu li { padding:2px 0;margin:0;list-style:none; }
ul.sample-menu li ul { padding:0;margin:0 0 0 15px; }
ul#my-menu a { padding-left:8px; }
ul#my-menu a.collapsed { background:url('img/collapsed.gif') left 6px no-repeat; }
ul#my-menu a.expanded { background:url('img/expanded.gif') left 6px no-repeat; }


Далее открываем - themes\ВАШ ШАБЛОН\source\boxes\categories.php
меняем
// NaviListe bekommt die ID "CatNavi"
$CatNaviStart = "\n<ul id=\"CatNavi\">\n";
на
// NaviListe bekommt die ID "CatNavi"
$CatNaviStart = "\n<ul id=\"my-menu\">\n";

Далее открываем - themes\ВАШ ШАБЛОН\javascript\general.js
Добавляем
<script type="text/javascript" src="<?php echo _HTTP_THEMES_C; ?>javascript/jquery.cookie.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('ul#my-menu ul').each(function(i) { // Check each submenu:
        if ($.cookie('submenuMark-' + i)) {  // If index of submenu is marked in cookies:
            $(this).show().prev().removeClass('collapsed').addClass('expanded'); // Show it (add apropriate classes)
        }else {
            $(this).hide().prev().removeClass('expanded').addClass('collapsed'); // Hide it
        }
        $(this).prev().addClass('collapsible').click(function() { // Attach an event listener
            var this_i = $('ul#my-menu ul').index($(this).next()); // The index of the submenu of the clicked link
            if ($(this).next().css('display') == 'none') {
                $(this).next().slideDown(200, function () { // Show submenu:
                    $(this).prev().removeClass('collapsed').addClass('expanded');
                    cookieSet(this_i);
                });
            }else {
                $(this).next().slideUp(200, function () { // Hide submenu:
                    $(this).prev().removeClass('expanded').addClass('collapsed');
                    cookieDel(this_i);
                    $(this).find('ul').each(function() {
                        $(this).hide(0, cookieDel($('ul#my-menu ul').index($(this)))).prev().removeClass('expanded').addClass('collapsed');
                    });
                });
            }
        return false; // Prohibit the browser to follow the link address
        });
    });
});
function cookieSet(index) {
    $.cookie('submenuMark-' + index, 'opened', {expires: null, path: '/'}); // Set mark to cookie (submenu is shown):
}
function cookieDel(index) {
    $.cookie('submenuMark-' + index, null, {expires: null, path: '/'}); // Delete mark from cookie (submenu is hidden):
}
</script>
Осталось box_categories

Открываем - themes\ВАШ ШАБЛОН\boxes\box_categories.html

и {$BOX_CONTENT}  прописываем <ul id="my-menu" class="sample-menu">

{config_load file="$language/lang.conf" section="boxes"}
{if $BOX_CONTENT}
<!-- Бокс разделы -->
<table class="adn"><tr><td class="hd bf">{#heading_categories#}</td></tr></table>
<table class="adn"><tr><td class="hdb">

<ul id="my-menu" class="sample-menu">
{$BOX_CONTENT}


</td></tr></table>
<!-- /Бокс разделы -->

{/if}

Вот и все, не забудьте подключить jquery! архив с демкой прикрепил!
при нажатии на родительскую категорию также раскрывается список, как и при нажатии на знак "+"

Должно работать))) У меня работает! ;)


http://www.shopos.ru/forum/index.php?topic=6266.0


Подскажите, можно изменить смещение (типа - табуляция): Строчка - Категория,
                                                                                                      строчка - Подкатегория????
А то ширины бокса не хватает!


А можно в  файле general.js.php  в самом коде 
вот сдесьvar Minus = jQuery('<span onclick="javascript:fspand(this);" class="CategoryMinus">-</span> ');
  var Plus = jQuery('<span onclick="javascript:fspand(this);" class="CategoryPlus">+</span> ');
и вот сдесь
if(obj.is(":hidden")) {
            obj.animate({height: "show"},400);
            sp.removeClass("CategoryPlus");
          sp.text("-").addClass("CategoryMinus");
        }
        else
        {
            obj.animate({height: "hide"},300);
            sp.removeClass("CategoryMinus");
            sp.text("+").addClass("CategoryPlus");

переписать так чтоб на страницу сайта вставлялись не текстовые символы "+" и "-", а иконки,  т.е. по сути  изображения, только маленькие?


Кто нить делал на шаблоне silver открывающийся список ? Отпишитесь плиз 621-405-119



Кто нить делал на шаблоне silver открывающийся список ? Отпишитесь плиз 621-405-119

узнал как? тоже интересует...


а вот у меня нет фала show_category.inc.php, есть только show_category.php

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

$Aktiv = false;


вот что у меня в show_category.php
<?php
/*
#####################################
# ShopOS: Скрипты интернет-магазина
#  Copyright (c) 2008-2009
# http://shopos.ru
# Ver. 1.0.1
#####################################
*/

function os_show_category($counter)
{

global $foo, $categories_string, $id;


//start the loop
for ($a=0; $a<$foo['level']; $a++)
{}


if ($foo['level']=='') //maincat
{
if (strlen($categories_string)=='0')
{
$categories_string .='<ul class="navilist">';
}
$categories_string .='
<li class="maincat';
$categories_string .= '"><a class="';
if ( ($id) && (in_array($counter, $id)) )
{
$categories_string .= 'gewaehlt';
    }
$categories_string .= '" href="';
}

else //subcat
{
$categories_string .= '
<li class="subcatlevel'.$foo['level'];
$categories_string .= '"><a class="';
if ( ($id) && (in_array($counter, $id)) )
{
$categories_string .= 'gewaehlt';
    }
$categories_string .= '" href="';
}

$cPath_new=os_category_link($counter,$foo['name']);

$categories_string .= os_href_link(FILENAME_DEFAULT, $cPath_new);
$categories_string .= '">';

$categories_string .= $foo['name'];

if (SHOW_COUNTS == 'true')
{
$products_in_category = os_count_products_in_category($counter);
if ($products_in_category > 0)
{
$categories_string .= ' <span class="catcount">(' . $products_in_category . ')</span>';
}
}

$categories_string .= '</a></li>';

if ($foo['next_id'])
{
os_show_category($foo['next_id']);
}
else
{
$categories_string .= '</ul>';
}
}

?>



а вот у меня нет фала show_category.inc.php, есть только show_category.php

следовательно у меня нет строчки
$Aktiv = false;




Посмотрите по адресу themes\ВАШ ШАБЛОН\source\inc у меня в этой папке есть всего 1 файл show_category.inc.php


Источник



Copyright ShopOS