2013-09-25 57 views
5

Jestem obecnie tworzących moduł menu Joomla, ale Ive natknąć niektórych kwestiach ..PHP podzielić ul równomiernie na 3 kolumnach Module Joomla Menu

próbuję rozdzielić elementy menu sub na 3 kolumny, aktualnie jestem za pomocą tego:

$counter = 0; 

if($item->level == 2): 
    $counter += count($item); 
endif; 

if($item->level == 1): 
    $counter = 0; 
endif; 

if($counter%3 == 0 && $item->level == 2){ 
     echo '</ul><ul class="col-lg-3">'; 
    } 

ale to tylko ich do grup 3 na

Oto cała default.php:

<?php 

// No direct access 
defined('_JEXEC') or die; 

// Note. It is important to remove spaces between elements. 
$counter = 0; 

?> 

<ul class="nav navbar-nav <?php echo $class_sfx; ?> nav-mega"<?php 
$tag = ''; 
if ($params->get('tag_id') != null) 
{ 
    $tag = $params->get('tag_id') . ''; 
    echo ' id="' . $tag . '"'; 
} 
?>> 

<?php 
    foreach ($list as $i => &$item) { 

     if($item->level == 2): 
      $counter += count($item); 
     endif; 

     if($item->level == 1): 
      $counter = 0; 
     endif; 

     $class = 'item-' . $item->id; 
     if ($item->id == $active_id) { 
      $class .= ' current'; 
     } 

     if (in_array($item->id, $path)){ 
      $class .= ' active'; 
     }elseif ($item->type == 'alias'){ 
      $aliasToId = $item->params->get('aliasoptions'); 
      if (count($path) > 0 && $aliasToId == $path[count($path) - 1]) { 
       $class .= ' active'; 
      }elseif (in_array($aliasToId, $path)){ 
       $class .= ' alias-parent-active'; 
      } 
     } 

     if ($item->deeper){ 
      $class .= ' deeper dropdown'; 
     } 

     if ($item->parent){ 
      $class .= ' parent'; 
     } 

     if (!empty($class)){ 
      $class = ' class="' . trim($class) . '"'; 
     } 

     echo '<li' . $class . '>'; 

     // Render the menu item. 
     switch ($item->type){ 
      case 'separator': 
      case 'url': 
      case 'component': 
       require JModuleHelper::getLayoutPath('mod_blogmenu', 'default_' . $item->type); 
      break; 

      default: 
       require JModuleHelper::getLayoutPath('mod_blogmenu', 'default_url'); 
      break; 
     } 

     // The next item is deeper. 
     if($counter%3 == 0 && $item->level == 2){ 
      echo '</ul><ul class="col-lg-3">'; 
     } 

     if ($item->deeper){ 
      echo '<div class="dropdown-menu mega-dropdown">'; 
      echo '<div class="mega-image col-lg-3 thumbnail visible-md visible-lg"><img src="'.$item->menu_image.'" /></div>'; 
      echo '<ul class="col-lg-3">'; 
     } 
       // The next item is shallower. 
     elseif ($item->shallower){ 

      echo str_repeat('</ul><div class="mega-caption"></div></div>', $item->level_diff); 
     } 
       // The next item is on the same level. 
     else { 
      //echo '</li>'; 
     } 
    } 

?> 
</ul> 

Przepraszamy za dużo kodu; Wciąż próbuję nauczyć się PHP i próbować zrozumieć sposób działania Joomli, to nie jest dla mnie zbyt łatwe.

+0

nie nurkować zbyt głęboko w kodzie, ale dlaczego wstawiasz fragment kodu zamykający 'ul' między tymi, które otwierają i zamykają' li', które powinien zawierać 'ul', jeśli dobrze rozumiem projekt? – MasterAM

+0

ponieważ nie wiem co robię? .. Naprawiłem większość tego, to tylko dzieląc je na 3 kolumny teraz .. źle zaktualizować moje pytanie .. Dzięki za odpowiedź –

+0

Jak masz hierarchiczną listę, nie jest to możliwe w HTML (sposób, w jaki robisz to w dość ogólnym znaczeniu), aby utworzyć z niego wiele kolumn. Poszedłbym z 'RecursiveIterator', ponieważ może on śledzić poziomy, ponieważ musiałbyś zamknąć całą hierarchię UL/LI, kiedy jedna kolumna się kończy i ponownie otworzyć ją po rozpoczęciu następnej kolumny. Nie jest to łatwe do wytłumaczenia, ani łatwego napisania kodu, z którym może być powiązany powiązany kod: [sprawdzanie wartości w drzewie o dogłębnej głębokości?] (Http://stackoverflow.com/a/12758996/367456) – hakre

Odpowiedz

1

Przed przejściem przez wszystkie elementy menu należy zliczyć wszystkie podmenu dla każdego menuitem. (Zastrzeżenie:. Nie mam wiedzy o Joomla menu, ale mam nadzieję $ item->> Referencje nadrzędnej identyfikator id elementu nadrzędnego)

$submenuItemsTotals = array(); 
foreach ($list as $i => &$item) { 
    if ($item->level == 2) { 
     if (!isset($submenuItemsTotal[$item->parent->id])) { 
      $submenuItemsTotal[$item->parent->id] = 1; 
     } else { 
      $submenuItemsTotal[$item->parent->id]++; 
     } 
    } 
} 

$itemsPerColumn = array(); 
foreach ($submenuItemsTotals as $parentId => $submenuItemsTotal) { 
    $itemsPerColumn[$parentId] = ceil($submenuItemsTotal/3); 
} 


// Here comes your existing code with a small change 

foreach ($list as $i => &$item) { 
    [your code....] 

    // The next item is deeper. 
    if($item->level == 2 && ($counter % $itemsPerColumn[$item->parent->id]) == 0){ 
     echo '</ul><ul class="col-lg-3">'; 
    } 

    [your code....] 
} 
+0

dziękuję, spróbuję tego za chwilę –

+0

Jeszcze raz dziękuję za odpowiedź, ale mam następujące błędy: Uwaga: Niezdefiniowany indeks: 108 w /storage/websites/niflas/modules/mod_blogmenu/tmpl/default.php na linia 89 Ostrzeżenie: dzielenie przez zero w /storage/websites/niflas/modules/mod_blogmenu/tmpl/default.php w linii 89 –

0

Czy umieścisz go w kolumnach CSS?

<!DOCTYPE html> 
<html> 
<head> 

<style> 
div.columns { 
column-width: auto; 
-moz-column-width: auto; 
-webkit-column-width: auto; 
column-count: 3; 
-moz-column-count: 3; 
-webkit-column-count: 3; 
column-gap: 1em; 
-moz-column-gap: 1em; 
-webkit-column-gap: 1em; 
} 

.nosplit { 
display: inline-block; 
} 
</style> 

</head> 

<body> 

<div class="columns"> 
<ul> 
<li>item01</li> 
<li>item02</li> 
<li>item03</li> 
<li>item04</li> 
<li class="nosplit">item05 
    <ul> 
    <li>item05a</li> 
    <li>item05b</li> 
    </ul> 
    </li> 
<li>item06</li> 
<li>item07</li> 
<li class="nosplit">item08 
    <ul> 
    <li>item08a</li> 
    <li>item08b</li> 
    <li>item08c</li> 
    </ul> 
    </li> 
<li>item09</li> 
<li>item10</li> 
</ul> 

</body> 

</html> 
+0

hej, unikalne rozwiązanie dziękuję, ale muszę wesprzeć IE8 ... czy to nadal będzie działać? –

+0

@DawidvanderHoven - Korzystając z tej metody, będziesz musiał użyć wtyczki JS, ponieważ IE8 nie obsługuje kolumn. powinien podzielić każdą "kolumnę" za pomocą 'div' i nadać' float: left; ' – Lodder

+0

oh ya, ie8. Niestety. – egrutz