Перейти к содержанию

Рекомендуемые сообщения

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

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

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

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

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

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

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

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

главная категория 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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

  • +1 1

Поделиться сообщением


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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Вот к примеру в оригинальном файле 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:

Поделиться сообщением


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

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

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

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

	  <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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

.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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

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

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

1. категория

2. категория

3. категория

или

- категория

- категория

- категория

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Блин... как бы так объяснить... :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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

.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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

 

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

 

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

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

 

 

<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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Похожий контент

    • От iDiy
      675.00 руб
      Скачать/Купить дополнение


      YUMenu (расширенный модуль меню)
      YUMenu 1.0.7 (расширенный модуль меню)
       
      Надежный и функциональный модуль расширенного произвольного меню, включает в себя витрину категорий, горизонтальное, вертикальное меню и меню для мобильных устройств.
      Модуль позволяет создавать многоуровневое меню из произвольных элементов (наименования, ссылки, изображения - произвольные) и/или из элементов каталога (категории, товары, бренды, статьи), создавая из них абсолютно любую структуру.
       
      Особенности модуля:
      неограниченный уровень вложенности меню; выборочные элементы меню (категории, производители, статьи, товары); произвольные ссылки с собственными параметрами (наименования, ссылки, классы, иконки); популярное адаптивное меню "Amazon"; три стиля вертикального меню: "Accordion", меню "Flyout" и меню "Push"; отображение меню для конкретной категории/производителя/товара; экспорт/импорт настроек модуля и структуры элементов меню; функция скрытия пустых (без товара) категорий и производителей; количество товаров категории и производителя без потери производительности; поддержка мульти-магазинов и групп пользователей; подключение произвольных макетов, стилей и скриптов; поддержка мобильных устройств; модуль оптимизирован для наилучшей производительности; модуль не заменяет системных файлов; простая установка в меню дополнений...  
      Совместимость: OpenCart, ocStore, ocShop и прочие сборки версий OC 2.1 - 3.0
      Системные требования: php 5.6, 7.2, IonCube Loader 10+
       
      Демонстрация работы модуля на примере:
      Витрины категорий, Категории, Товара, Бренда
      Админ демо (логин/пароль: demo/demo)
       
      Добавил iDiy Добавлено 29.06.2017 Категория Меню, дизайн, внешний вид Системные требования php 5.6 - 7.2, IonCube Loader 6+ Сайт разработчика Старая цена Метод активации По запросу на почту Ioncube Loader Требуется OpenCart 3.0
      2.3
      2.2
      2.1 ocStore 3.0
      2.3
      2.2
      2.1 OpenCart.Pro, ocShop Opencart.pro 2.3
      Opencart.pro 2.1  
    • От iDiy
      YUMenu 1.0.7 (расширенный модуль меню)
       
      Надежный и функциональный модуль расширенного произвольного меню, включает в себя витрину категорий, горизонтальное, вертикальное меню и меню для мобильных устройств.
      Модуль позволяет создавать многоуровневое меню из произвольных элементов (наименования, ссылки, изображения - произвольные) и/или из элементов каталога (категории, товары, бренды, статьи), создавая из них абсолютно любую структуру.
       
      Особенности модуля:
      неограниченный уровень вложенности меню; выборочные элементы меню (категории, производители, статьи, товары); произвольные ссылки с собственными параметрами (наименования, ссылки, классы, иконки); популярное адаптивное меню "Amazon"; три стиля вертикального меню: "Accordion", меню "Flyout" и меню "Push"; отображение меню для конкретной категории/производителя/товара; экспорт/импорт настроек модуля и структуры элементов меню; функция скрытия пустых (без товара) категорий и производителей; количество товаров категории и производителя без потери производительности; поддержка мульти-магазинов и групп пользователей; подключение произвольных макетов, стилей и скриптов; поддержка мобильных устройств; модуль оптимизирован для наилучшей производительности; модуль не заменяет системных файлов; простая установка в меню дополнений...  
      Совместимость: OpenCart, ocStore, ocShop и прочие сборки версий OC 2.1 - 3.0
      Системные требования: php 5.6, 7.2, IonCube Loader 10+
       
      Демонстрация работы модуля на примере:
      Витрины категорий, Категории, Товара, Бренда
      Админ демо (логин/пароль: demo/demo)
       
    • От 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/ - С горизонтальным выпадом
       
       
      Добавил 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.х  
  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.