Jump to content

Recommended Posts

Здравствуйте, не подскажите как сделать многоуровневое меню, что бы было так:

главная категория 1

подкатегория

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

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

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

главная категория 2

главная категория 3

главная категория 4

Share this post


Link to post
Share on other sites

Здравствуйте, не подскажите как сделать многоуровневое меню, что бы было так:

главная категория 1

подкатегория

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

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

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

главная категория 2

главная категория 3

главная категория 4

Разобрался сам)

в общем, что надо делать:

Открываем файл: /catalog/controller/module/category.php и заменяем там все этим

<?php 
class ControllerModuleCategory extends Controller {
protected function index($setting) {
  $this->language->load('module/category');
 
	 $this->data['heading_title'] = $this->language->get('heading_title');
 
  if (isset($this->request->get['path'])) {
   $parts = explode('_', (string)$this->request->get['path']);
  } else {
   $parts = array();
  }
 
  if (isset($parts[0])) {
   $this->data['category_id'] = $parts[0];
  } else {
   $this->data['category_id'] = 0;
  }
 
  if (isset($parts[1])) {
   $this->data['child_id'] = $parts[1];
  } else {
   $this->data['child_id'] = 0;
  }
	  
  $this->load->model('catalog/category');
  $this->load->model('catalog/product');
 
  $this->data['categories'] = array();
	
  $categories_1 = $this->model_catalog_category->getCategories(0);
 
  foreach ($categories_1 as $category_1) {
   $level_2_data = array();
  
   $categories_2 = $this->model_catalog_category->getCategories($category_1['category_id']);
  
   foreach ($categories_2 as $category_2) {
    $level_3_data = array();
   
    $categories_3 = $this->model_catalog_category->getCategories($category_2['category_id']);
   
    foreach ($categories_3 as $category_3) {
	 $level_4_data = array();
	 $categories_4 = $this->model_catalog_category->getCategories($category_3['category_id']);
   

	   foreach ($categories_4 as $category_4) {
	    $level_4_data[] = array(
		 'name' => $category_4['name'],
		 'href' => $this->url->link('product/category', 'path=' . $category_1['category_id'] . '_' . $category_2['category_id'] . '_' . $category_3['category_id']. '_' . $category_4['category_id'])
	    );
	   }
	 
	
	 $level_3_data[] = array(
	  'name'	 => $category_3['name'],
	  'children' => $level_4_data,
	  'href'	 => $this->url->link('product/category', 'path=' . $category_1['category_id'] . '_' . $category_2['category_id'] . '_' . $category_3['category_id'])
	 );	
    }
	  
    $level_2_data[] = array(
	 'name'	 => $category_2['name'],
	 'children' => $level_3_data,
	 'href'	 => $this->url->link('product/category', 'path=' . $category_1['category_id'] . '_' . $category_2['category_id'])
    );	
   }
  
   $this->data['categories'][] = array(
    'name'	 => $category_1['name'],
    'children' => $level_2_data,
    'href'	 => $this->url->link('product/category', 'path=' . $category_1['category_id'])
   );
  }
 
  if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/module/category.tpl')) {
   $this->template = $this->config->get('config_template') . '/template/module/category.tpl';
  } else {
   $this->template = 'default/template/module/category.tpl';
  }
 
  $this->render();
   }
}
?>

Затем открываем файл: /catalog/view/theme/default/template/module/category.tpl и заменяем там все этим

<div class="catalog_menu">
	 
	  <ul>
	    <?php foreach ($categories as $category_1) { ?>
	    <li><a href="<?php echo $category_1['href']; ?>"><?php echo $category_1['name']; ?></a>
		  <?php if ($category_1['children']) { ?>
		  <ul>
		    <?php foreach ($category_1['children'] as $category_2) { ?>
		    <li><a href="<?php echo $category_2['href']; ?>"><?php echo $category_2['name']; ?></a>
			  <?php if ($category_2['children']) { ?>
			  <ul>
			    <?php foreach ($category_2['children'] as $category_3) { ?>
			    <li><a href="<?php echo $category_3['href']; ?>"><?php echo $category_3['name']; ?></a>
				    <?php if ($category_3['children']) { ?>
					  <ul>
					    <?php foreach ($category_3['children'] as $category_4) { ?>
					    <li><a href="<?php echo $category_4['href']; ?>"><?php echo $category_4['name']; ?></a></li>
					    <?php } ?>
					  </ul>
				  <?php } ?>
			    </li>
			    <?php } ?>
			  </ul>
			  <?php } ?>
		    </li>
		    <?php } ?>
		  </ul>
		  <?php } ?>
	    </li>
	    <?php } ?>
	  </ul>
</div>

В Принципе если кому нить надо вывести больше подкатегорий то просто поковыряйтесь в файле

/catalog/controller/module/category.php ничего там сложного нет

  • +1 4

Share this post


Link to post
Share on other sites

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

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

Share this post


Link to post
Share on other sites

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

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

пробовал на версии 1.5.x , но по идее должно работать и на предыдущих версиях

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

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

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

  • +1 1

Share this post


Link to post
Share on other sites

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

Ясно, а кто может подсказать как это в таблице стилей привести потом к каноническому виду? :-D

Share this post


Link to post
Share on other sites

Ясно, а кто может подсказать как это в таблице стилей привести потом к каноническому виду? :-D/>

ну ты у себя на сайте сделай все изменения, и потом сюда ссылку кинь, я напишу тебе стили.

  • +1 1

Share this post


Link to post
Share on other sites
ну ты у себя на сайте сделай все изменения, и потом сюда ссылку кинь, я напишу тебе стили.

Вроде нащупал верный путь, есть подозрения, что могу справиться сам. Хоть бы не сглазить... :-D

Share this post


Link to post
Share on other sites

Получилось, но не все как хотелось.

Вот ссылка на то, что сейчас.

Вот максимум что получилось у меня.

spisok_800.jpgi.gif

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

В файле category.php поменял все полностью

В файле categoty.tpl вместо

<div class="catalog_menu">
...
</div>

Вписал содержимое между

<div class="box">
 <div class="box-heading"><?php echo $heading_title; ?></div>
 <div class="box-content">
   <div class="box-category">
...
...
...
</div>
</div>
</div>

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

Короче говоря хотелось бы обрести контроль над текстом в меню. :-D

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

Наверное лучше не конкретный элемент.

Вот к примеру в оригинальном файле stylesheet есть так называемый блок, который отвечает за вид этого меню. Вот он

/* box category */

.box-category {
margin-top: -10px;
}
.box-category ul {
list-style: none;
margin: 0;
padding: 0;
}
.box-category > ul > li {
padding: 7px 7px 7px 0px;
}
.box-category > ul > li + li {
border-top: 1px dashed #000000;
}
.box-category > ul > li > a a:hover {
text-decoration: none;
color: #000000;
}
.box-category > ul > li ul {
display: block;
}
.box-category > ul > li a.active {
font-weight: bold;
}
.box-category > ul > li a.active + ul {
display: block;
}
.box-category > ul > li ul > li {  
padding: 5px 5px 0px 10px;
}
.box-category > ul > li ul > li > a a:hover {
text-decoration: none;
display: block;
}
.box-category > ul > li ul > li > a.active {
font-weight: bold;
}

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

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

Share this post


Link to post
Share on other sites
Что нужно дописать переписать, чтобы после изменений, которые Вы предлагаете, внешним видом меню так же легко можно было бы управлять?
в файле стилей сделай поправку:

.box-category {
font-weight: bold;
margin-top: -10px;
}

тогда весь текст в менюшке категорий будет жирным. это требовалось?

  • +1 1

Share this post


Link to post
Share on other sites

	  <ul>
	    <?php foreach ($categories as $category_1) { ?>
	    <li><a href="<?php echo $category_1['href']; ?>"><?php echo $category_1['name']; ?></a>
			  <?php if ($category_1['children']) { ?>
			  <ul>
			    <?php foreach ($category_1['children'] as $category_2) { ?>
			    <li><a href="<?php echo $category_2['href']; ?>"><?php echo $category_2['name']; ?></a>
					  <?php if ($category_2['children']) { ?>
					  <ul>
					    <?php foreach ($category_2['children'] as $category_3) { ?>
					    <li><a href="<?php echo $category_3['href']; ?>"><?php echo $category_3['name']; ?></a>
							    <?php if ($category_3['children']) { ?>
									  <ul>
									    <?php foreach ($category_3['children'] as $category_4) { ?>
									    <li><a href="<?php echo $category_4['href']; ?>"><?php echo $category_4['name']; ?></a></li>
									    <?php } ?>
									  </ul>
							  <?php } ?>
					    </li>
					    <?php } ?>
					  </ul>
					  <?php } ?>
			    </li>
			    <?php } ?>
			  </ul>
			  <?php } ?>
	    </li>
	    <?php } ?>
	  </ul>

вот этот код поставь, а то у тебя только 2 подуровня отображается

  • +1 2

Share this post


Link to post
Share on other sites

а что касается стилей которые ты перед этим написал

.box-category - отвечает за весь блок меню
.box-category  ul  li - отвечает за пункты первого уровня
.box-category  ul  li ul  li - второй под_уровень
.box-category  ul  li ul  li ul  li - третий
ну и т.д.
там где в конце подставляется a.active - это отвечает за активный пункт меню(активная ссылка), если в конце будешь подставлять a:hover за место a.active, то этот стиль будет срабатывать при наведении на ссылку

ну надеюсь понятно расписал?

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

  • +1 2

Share this post


Link to post
Share on other sites

Блин... как бы так объяснить... :ugeek:

Ну вот к примеру:

.box-category > ul > li a.active {
font-weight: bold;

Пункт, который делает текст активной ссылки жирным. После замены дефолтного кода в файлах на ваш - не работает. Различные отступы сдвиги и т.д. все норм, а вот форматирование текста и маркировка списка т.е.

1. категория

2. категория

3. категория

или

- категория

- категория

- категория

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

Share this post


Link to post
Share on other sites

Блин... как бы так объяснить... :ugeek:

Ну вот к примеру:

.box-category > ul > li a.active {
font-weight: bold;

Пункт, который делает текст активной ссылки жирным. После замены дефолтного кода в файлах на ваш - не работает. Различные отступы сдвиги и т.д. все норм, а вот форматирование текста и маркировка списка т.е.

1. категория

2. категория

3. категория

или

- категория

- категория

- категория

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

попробуй в футер перед тегами

 </body> 
</html>

вставить

<script>
$(document).ready(function(){ 
var url=document.location.href; 
 $.each($(".box-category a"),function(){ 
 if(this.href==url){$(this).addClass('active');}; 
 }); 
});
</script>

  • +1 2

Share this post


Link to post
Share on other sites

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

.box-category > ul > li a.active

, а что бы форматировать текст и расставлять маркировку

я уже писал, используйте это

.box-category - отвечает за весь блок меню
.box-category  ul  li - отвечает за пункты первого уровня
.box-category  ul  li ul  li - второй под_уровень
.box-category  ul  li ul  li ul  li - третий
ну и т.д.
там где в конце подставляется a.active - это отвечает за активный пункт меню(активная ссылка), если в конце будешь подставлять a:hover за место a.active, то этот стиль будет срабатывать при наведении на ссылку

  • +1 2

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

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

ну напиши сам, и тут повесь, и будет всем счастье

Share this post


Link to post
Share on other sites

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

Надо не говорить "надо", а показывать как надо. :-D

Share this post


Link to post
Share on other sites

smy, ну так что получилось сделать меню, и управлять им?))

Share this post


Link to post
Share on other sites

smy, ну так что получилось сделать меню, и управлять им?))

Вечером сделаю, отпишу. Еще не вступал в очередной бой :-D

Share this post


Link to post
Share on other sites

Спасибо, всё отлично работает.

Но вот попробовал перелопатить таким же образом верхнее меню - и не взлетело((

Share this post


Link to post
Share on other sites

Здравствуйте!

 

Помогите, пожалуйста, решить проблему.

 

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

Что нужно изменить в таблице стилей? 

 

 

<style>
    ul.dropmenu{
position: relative;
margin: 0px;
padding: 1px 0px 0px 0px;
display:block;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size: 12px;
 
}
.dropmenu li{
position: relative;
list-style: none;
margin: 0px;
boder:1px so
display: block;
cursor: point;
    padding-bottom: 1px;
 
}
.dropmenu li a{
padding: 10px 30px 9px 15px;
display: block;
cursor: point;
color: #FFF;
text-decoration: none;
background-color: #333;
font-weight: bold;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
}
.dropmenu li a:hover{
background-color: #666;
color: #CCC;
 
}
.dropmenu li span{
display: block;
float: right;
height: 10px;
width: 10px;
background:transparent url(catalog/view/javascript/jquery/dropmenu/plus.png) repeat-x scroll 0 0;
position: absolute;
top: 13px;
right: 10px;
}
.dropmenu li:hover ul, .dropmenu li:hover div{
display: block;
}
.dropmenu ul, .dropmenu div{
position: absolute;
display: none;
width: 162px;
left: 155px;
top: 0px;
margin: 0px;
padding: 0px;
    box-shadow: 1px 1px 1px #000;
}
.dropmenu li div ul{
border: none;
background: none;
position: relative;
display: block;
left: 0px;
}
.dropmenu ul li{
border: 0;
float: none;
}
 
.dropmenu div ul{
position: relative;
display: block;
}
.dropmenu li div{
background-color: #cccccc;
padding: 5px;
display: none;
position: absolute;
}
</style>
<script type="text/javascript" src="catalog/view/javascript/jquery/dropmenu/dropmenu.js"></script>

post-3549-0-21819200-1403116367_thumb.jpg

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
You are posting as a guest. If you have an account, please sign in.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Similar Content

    • By legioner26
      Разработан многофункциональный модификатор меню категорий товаров, который позволяет прям из админ панели решать массу задач без участия программиста. Очень простая и легкая установка.
      Так же внедрена мобильная версия модуля.
      Модификатор создан для изменения и добавления функционала в стандартный модуль категорий всех версий веток ОС начиная от 2.0 и заканчивая 3.0
      Обновление модификатора до версии ОС 3.0
      ПРИМЕЧАНИЕ !!!
      Для корректной установки и работы модификатора настоятельно рекомендую проверить были ли изменены файлы стандартного модуля категорий, 
      либо удостовериться что нет сторонних модификаторов которые бы меняли функционал.
      В случае если файлы изменены, можете добавить к ним префикс к примеру (category_1.tpl) и залить файлы из коробки ОС. 
       
       
       
       
      Установка:
      1. Папку Admin закинуть на хостинг в корень сайта 
      2. Устанавливаете модификатор согласно вашей версии ОС через "Установка расширений", далее в модификаторах чистим кешь и обновляем.
      ИНСТРУКЦИЯ во вложении
      DEMO Логин: demo Пароль: demo
      https://siacosmetics.ru/lico1/dlya-lica/krem-dlya-lica  - С вертикальным выпадом
      https://teplomir77.ru - С горизонтальным выпадом
       
      https://opencartforum.com/profile/723002-legioner26/?tab=field_core_pfield_13 ->> Собственный программный модуль по парсингу товаров под управлением OpenCart
    • By legioner26
      399.00 руб
      Скачать/Купить дополнение


      Многофункциональный модуль меню Категорий
      Разработан многофункциональный модификатор меню категорий товаров, который позволяет прям из админ панели решать массу задач без участия программиста. Очень простая и легкая установка.
      Так же внедрена мобильная версия модуля.
      Модификатор создан для изменения и добавления функционала в стандартный модуль категорий всех версий веток ОС начиная от 2.0 и заканчивая 3.0
      Обновление модификатора до версии ОС 3.0
      ПРИМЕЧАНИЕ !!!
      Для корректной установки и работы модификатора настоятельно рекомендую проверить были ли изменены файлы стандартного модуля категорий, 
      либо удостовериться что нет сторонних модификаторов которые бы меняли функционал.
      В случае если файлы изменены, можете добавить к ним префикс к примеру (category_1.tpl) и залить файлы из коробки ОС. 
       
       
       
       
      Установка:
      1. Папку Admin закинуть на хостинг в корень сайта 
      2. Устанавливаете модификатор согласно вашей версии ОС через "Установка расширений", далее в модификаторах чистим кешь и обновляем.
      ИНСТРУКЦИЯ во вложении
      DEMO Логин: demo Пароль: demo
      https://siacosmetics.ru/lico1/dlya-lica/krem-dlya-lica  - С вертикальным выпадом
      https://teplomir77.ru - С горизонтальным выпадом
       
      https://opencartforum.com/profile/723002-legioner26/?tab=field_core_pfield_13 ->> Собственный программный модуль по парсингу товаров под управлением OpenCart
      Добавил legioner26 Добавлено 12.02.2018 Категория Меню, дизайн, внешний вид Системные требования Сайт разработчика Старая цена 700 Метод активации Без активации Ioncube Loader Нет OpenCart 3.0
      2.3
      2.2
      2.1
      2.0 ocStore 3.0
      2.3
      2.2
      2.1 OpenCart.Pro, ocShop Opencart.pro 2.3
      Opencart.pro 2.1
      OcShop 2.0.3.х Обращение к серверу разработчика Нет  
    • By axaxaxa
      Здравствуйте,
      Нужны ваши советы!! Нужно создать меню с кучей уровней... 
      СКРИН
      Если правильно поймете то тут очень много "пунктов", суть этого меню что человек переходя с любой стороны попадет на нужную категорию(одну и ту же...), то есть сами ссылки дублируются(ведут в одну и ту же категорию).... кольца > обручальные кольца > для мужчин > золотые == Золотые > кольца > обручальные > для мужчин.... и таких вариаций еще несколько и все они ведут в ОДНО и ту же категорию....
      Начал делать все вручную списками но получается очень много кода, думаю будет тяжело для сайта... сделал все проходы для колец получилось 5600 строк кода..... если у меня таких 10, то будет около 60000 строк кода, многовато для меню))))
      Вот посоветуйте как лучше реализовать, может есть модули какие то...... или же это вообще бред и не стоит так делать(что это плохая идея), как сделать лучше?!
       
      5 уровней вложенностей  1-й уровень 2-й уровень до 10-ти подпунктов 3-5-й уровень до 6-ти подпунктов....
       
      еще скрины
       
       
    • By weterglass
      ДВС, ребята, подскажите, можно где найти модуль для отображения категорий не в колонке, а в поле сайта. Что бы 3-4 окна с категориями от родительской и далее, т.е. В первой колонке родительская категория, или та категория, которую назначишь (в идеале), вторая колонка это следующая подкатегория и т.д. Такое как на фото (за качество извините, на планшет фотографировал).
      И в идеале, модуль отображения товара таблицей бы еще.

    • By DarthOlolo
      Добрый день. Подскажите, пожалуйста, имеются ли для ocstore 2.3 модули меню для отображения вместе с категориями связанных брэндов, на примере данного сайта тыц. Буду очень признателен за подсказку.
  • Recently Browsing   0 members

    No registered users viewing this page.

×

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.