Независимые категории 2-го и 3-го уровня

Gregar · November 7, 2014

Столкнулся с необходимостью сделать независимые категории 2-го уровня, а затем и 3-го уровня. Много читал на форуме о категориях, но решения для себя не нашел. После того как обратился за помощью, мне ответил: Kors и дал мне пищу для размышлений. По началу не совсем все было понятно, но немного подумав над тем, что и как работает я начал эксперименты.
У меня все получилось и все работает отлично.

На форуме многие решения сделаны на уровнях, но мне они не совсем подошли и я воспользовался методом который мне предложил Kors

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

Задача: необходимо сделать в разных местах шаблона вывод различных уровней категорий. (в моем примере мне нужно было 3 уровня)

1) Для вывода первого уровня, используем стандартный код:

{function name=categories_tree}
{if $categories}
<ul class="menu">
{foreach $categories as $c}
{if $c->visible}
<li>
<a {if $category->id == $c->id}class="selected"{/if} href="catalog/{$c->url}" data-category="{$c->id}">{$c->name|escape}</a>
</li>
{/if}
{/foreach}
</ul>
</li>
{/if}
{/function}
{categories_tree categories=$categories}

2) Для вывода 2-го уровня категорий, используем код:

<ul class="cat-menu-2">
{foreach $categories as $c1}
{if $c1->visible && ($c1->id==$category->id || $c1->id==$category->parent_id)}
{foreach $c1->subcategories as $c2}
{if $c2->visible}
<li><a href="catalog/{$c2->url}" data-category="{$c2->id}">{$c2->name}</a></li>
{/if}
{/foreach}
{/if}
{/foreach}                  
</ul>

3) Для вывода 3-го уровня категорий, используем код:

{foreach $categories as $c1}
{if $c1->visible && ($c1->id==$category->id || $c1->id==$category->parent_id)}
{foreach $c1->subcategories as $c2}
{if $c2->visible}
{if $category->id == $c2->id}
 
{foreach $c2->subcategories as $c3}
{if $c3->visible}
<a href="catalog/{$c3->url}" data-category="{$c3->id}">{$c3->name}</a>
{/if}
{/foreach}

{/if}
{/if}
{/foreach}
{/if}
{/foreach}

Вот таким вот способом можно вывести категории различных уровней в разных местах шаблона.

Пример: В шапке сайта мы выводим родительские категории (категории 1-го уровня - пункт 1), в левом блоке выводим категории 2-го уровня. На самой странице выше товара выводим категории 3-го уровня.

Памятка: категории отображаются только тогда когда они у нас имеются. Если мы перейдем в категорию "Бытовая техника" --> в ней у нас есть 2 категории второго уровня - они у нас будут отображаться в левом блоке, если в родительской категории нет 2-го уровня категорий - в этом случае у нас ничего не покажет. Точно так же и с категориями 3-го уровня.

Надеюсь кому-то это пригодится и облегчит поиски решения на форуме.

yr4ik · November 7, 2014

уже представляю код для вывода категорий 5 уровня :blink:

{function name=categories_tree}
    {if $categories && $level == $need_level}
        <ul class="cat-level-{$level}">
            {foreach $categories as $c}
                {if $c->visible}
                <li>
                    {if $c->image}<img src="{$config->categories_images_dir}{$c->image}" alt="{$c->name|escape}">{/if}
                    <a {if $category->id == $c->id}class="selected"{/if} href="catalog/{$c->url}" data-category="{$c->id}">{$c->name|escape}</a>
                    {categories_tree categories=$c->subcategories level=$level+1}
                </li>
                {/if}
            {/foreach}
        </ul>
    {/if}
{/function}

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

{categories_tree categories=$categories level=0 need_level=2}

Где need_level - нужный уровень.

Если нужны разные шаблоны, то в функции можно сделать проверку.

{if $level==1}

{elsif $level==xx}
и тд
{/if}

simplashop · November 7, 2014

уже представляю код для вывода категорий 5 уровня

согласен, но надо чуток модифицироать код

{function name=categories_tree}
				{if $categories && $level == $need_level}
					<ul class="cat-level-{$level}">
						{foreach $categories as $c}
							{if $c->visible}
							<li>
								{if $c->image}<img src="{$config->categories_images_dir}{$c->image}" alt="{$c->name|escape}">{/if}
								<a {if $category->id == $c->id}class="selected"{/if} href="catalog/{$c->url}" data-category="{$c->id}">{$c->name|escape}</a>
								{categories_tree categories=$c->subcategories level=$level+1}
							</li>
							{/if}
						{/foreach}
					</ul>
				{else}
					{foreach $categories as $c}
						{if $c->visible}
							{categories_tree categories=$c->subcategories level=$level+1}
						{/if}
					{/foreach}
				{/if}
			{/function}
			{categories_tree categories=$categories level=1 need_level=2}

Gregar · November 7, 2014

согласен, но надо чуток модифицироать код

{function name=categories_tree}
				{if $categories && $level == $need_level}
					<ul class="cat-level-{$level}">
						{foreach $categories as $c}
							{if $c->visible}
							<li>
								{if $c->image}<img src="{$config->categories_images_dir}{$c->image}" alt="{$c->name|escape}">{/if}
								<a {if $category->id == $c->id}class="selected"{/if} href="catalog/{$c->url}" data-category="{$c->id}">{$c->name|escape}</a>
								{categories_tree categories=$c->subcategories level=$level+1}
							</li>
							{/if}
						{/foreach}
					</ul>
				{else}
					{foreach $categories as $c}
						{if $c->visible}
							{categories_tree categories=$c->subcategories level=$level+1}
						{/if}
					{/foreach}
				{/if}
			{/function}
			{categories_tree categories=$categories level=1 need_level=2}

А вот как нам тогда сделать так чтобы этот код: {categories_tree categories=$categories level=1 need_level=2} можно было стилизовать в удобной нам форме.

Напрмиер:

<p><a href="#">имя категории</a></p>

</ul>

simplashop · November 7, 2014

А вот как нам тогда сделать так чтобы этот код: {categories_tree categories=$categories level=1 need_level=2} можно было стилизовать в удобной нам форме.

Напрмиер:

<div class="cet-id">
<p><a href="#">имя категории</a></p>
</ul>

можно использовать дополнительную переменную при вызове. $cat_class например

{categories_tree categories=$categories level=1 need_level=2 cat_class="cet-id"}

{function name=categories_tree}
				{if $categories && $level == $need_level}
					<ul class="cat-level-{$level} {$cat_class}">
						{foreach $categories as $c}
							{if $c->visible}
							<li>
								{if $c->image}<img src="{$config->categories_images_dir}{$c->image}" alt="{$c->name|escape}">{/if}
								<a {if $category->id == $c->id}class="selected"{/if} href="catalog/{$c->url}" data-category="{$c->id}">{$c->name|escape}</a>
								{categories_tree categories=$c->subcategories level=$level+1}
							</li>
							{/if}
						{/foreach}
					</ul>
				{else}
					{foreach $categories as $c}
						{if $c->visible}
							{categories_tree categories=$c->subcategories level=$level+1}
						{/if}
					{/foreach}
				{/if}
			{/function}
			{categories_tree categories=$categories level=1 need_level=2 cat_class="cet-id"}

vcontakte · August 9, 2019

Как сделать так то бы при нажатии на ссылки level == 2

в $level == 1 добавлялся class <ul class="submenu On">

а при нажатии на ссылки $level == 1 "On" убирался или писался "Оff" ???

$level == 1 - подкатегория

level == 2 - подподкатегория

{if $categories }


{if $level == 0} 
{foreach item=c from=$categories} {if $c->visible} 

{if $c->subcategories}
<li {if $category->id == $c->id}class="active"{/if} data-category="{$c->id}"><a href="category/{$c->url}">{$c->name}</a> 
	{include file='categories2.tpl' categories=$c->subcategories level=1 }</li>
{else}
<li><a href="category/{$c->url}">{$c->name}</a></li>
{/if}

{/if} 


{/foreach} {/if} 

{if $level == 1 }
<ul class="submenu">{foreach item=c from=$categories} {* Показываем только видимые категории *} {if $c->visible} {if $c->subcategories}
	<li {if $category->id == $c->id}class="active"{/if} data-category="{$c->id}"><a href="category/{$c->url}">{$c->name}</a>
		{include file='categories2.tpl' categories=$c->subcategories level=2 }</li>{else}
	<li {if $category->id == $c->id}class="active"{/if} data-category="{$c->id}"><a href="category/{$c->url}">{$c->name}</a></li>{/if} {/if} {/foreach}</ul>
{/if}



{if $level == 2}
<ul class="submenu">{foreach item=c from=$categories  }   {if $c->visible} 
	{if $c->subcategories }
	<li {if $category->id == $c->id}class="active"{/if} data-category="{$c->id}"><a href="category/{$c->url}">{$c->name}</a></li>{else}
	<li {if $category->id == $c->id}class="active"{/if} data-category="{$c->id}"><a href="category/{$c->url}">{$c->name}</a></li>{/if} {/if} {/foreach}</ul>
{/if}

{/if}

shooroop · August 9, 2019

Как сделать так то бы при нажатии на ссылки level == 2
в $level == 1 добавлялся class <ul class="submenu On">
а при нажатии на ссылки $level == 1 "On" убирался или писался "Оff" ???

https://jquery-docs.ru/addClass/

n1c · July 11, 2020

Подскажите пожалуйста, как сделать вывод 4го уровня подкатегории, чтобы 4й уровень показывался на странице той категории которой принадлежит а не на всех?

Типа:

- Женская

-- Обувь

--- Кроссовки (тут отображается 4й уровень)

---- Летние (4 уровень)

n1c · July 11, 2020

Подскажите пожалуйста, как сделать вывод 4го уровня подкатегории, чтобы 4й уровень показывался на странице той категории которой принадлежит а не на всех?
Типа:
- Женская
-- Обувь
--- Кроссовки (тут отображается 4й уровень)
---- Летние (4 уровень)

сделал. кому надо в products.tpl:

{if $categories} 

{if $category->subcategories}
{foreach from=$category->subcategories item=n}
	<a href="catalog/{$n->url}" category_id="{$n->id}">
		{$n->name}
	</a>
{/foreach}
{/if} 

{/if}

Edited July 11, 2020 by n1c

get31 · September 28

Добрый день.

Хочу сделать выводи сверху главных категорий

- Одежда
- Обувь

а под ними чтобы выводилось подкатегории главной категории (если находимся в категории "Обувь")

-- Кроссовки
-- Туфли
...

и соответственно если в "Одежда"

-- Футболки
-- Кофты
...

Сейчас вывожу вот так подкатегории 2 уровня:

  
	{if $categories}
	{if $category->subcategories}
	<div class="w3-bar">
		<div class="wrap">
			<div class="w3-bar-max">
				{foreach $categories as $c1}
					{if $c1->visible && ($c1->id==$category->id || $c1->id==$category->parent_id)}
						{foreach $c1->subcategories as $c2}
							{if $c2->visible}
								<a href="{$c2->url}" data-category="{$c2->id}">{$c2->name}</a>
							{/if}
						{/foreach}
					{/if}
				{/foreach} 

			</div>
		</div>
	</div>
	{/if}
	{/if}

И если зайти в карточку товара, то пропадает вывод подкатегорий.

Третий и дальше уровни не нужно выводить, только чтобы выводился второй уровень, а в первом уровне было сlass="selected".

Подскажите, как сделать чтобы правильно выводилось?

Пример как на https://farfetch.com/

Sign In

Независимые категории 2-го и 3-го уровня

Recommended Posts

Gregar

Link to post

Share on other sites

yr4ik

Link to post

Share on other sites

simplashop

Link to post

Share on other sites

Gregar

Link to post

Share on other sites

simplashop

Link to post

Share on other sites

vcontakte

Link to post

Share on other sites

shooroop

Link to post

Share on other sites

n1c

Link to post

Share on other sites

n1c

Link to post

Share on other sites

get31

Link to post

Share on other sites

Join the conversation

Сайт

Активность

Support