Contao-Camp 2024
Ergebnis 1 bis 5 von 5

Thema: Side Navigation mit und für contao-bootstrap Erweiterung

  1. #1
    Contao-Nutzer
    Registriert seit
    29.10.2010.
    Beiträge
    45

    Standard Side Navigation mit und für contao-bootstrap Erweiterung

    Basiert auf diesem Originaltemplate: nav_default.html5

    Kurzbeschreibung was die Modifizierung bewirkt:
    Verändert die Navigation, die auf einer unordered list <ul> basiert, so, dass kein Dropdown-Menü für das Submenü geöffnet wird sondern eine "Collapse" die Kind-Elemente anzeigt.

    (Bei Bedarf) Ausführliche Beschreibung/Sonstige Infos:
    Ich wollte für eine Seite, die auf dem Bootstrap Framework (Erweiterung "contao-bootstrap") aufsetzt, nicht die Standard Navigationsleiste zur die Hauptnavigation nutzen sondern eine Seitennavigation erstellen. Das von Contao Core mitgelieferte Template "nav_default.html5" lies sich für meine Zwecke am besten verändern. Es lässt sich sogar in mehreren Ebenen nutzen - bis Ebene 3 habe ich getestet.


    PHP-Code:

    <?php if ($this->level != "level_1"): ?>
      <ul id="<?php foreach ($this->items as $item) { if (strstr($item['class'],'first')) { echo str_replace('/','-',$item['parentAlias']). '-collapse'; } echo '" class="collapse list-unstyled '$this->level; if (strstr($_SERVER['REQUEST_URI'],$item['parentAlias'])) { echo ' show'; } } ?>">
    <?php else: ?>
      <ul class="list-unstyled components <?= $this->level ?>">
    <?php endif; ?>

    <?php foreach ($this->items as $item): ?>
      <?php if (!empty($item['subitems'])): ?>
        <li<?php if ($item['class']) echo ' class="' $item['class'] . '"'?>><a href="#<?= str_replace('/','-',$item['alias']) ?>-collapse" data-toggle="collapse" aria-expanded="false" <?php if ($item['class']) echo ' class="dropdown-toggle ' $item['class'] . '"'?><?php if ($item['accesskey'] !== '') echo ' accesskey="' $item['accesskey'] . '"'?><?php if ($item['tabindex']) echo ' tabindex="' $item['tabindex'] . '"'?><?php if ($item['nofollow']) echo ' rel="nofollow"'?><?= $item['target'?> itemprop="url"><span itemprop="name"><?= $item['link'?></span></a><?= $item['subitems'?></li>
      <?php else: ?>
        <?php if ($item['isActive']): ?>
          <li class="<?= $item['class'?>"><strong class="<?= $item['class'?>"<?php if (!empty($item['subitems'])) echo ' aria-haspopup="true"'?> itemprop="name"><?= $item['link'?></strong><?= $item['subitems'?></li>
        <?php else: ?>
          <li<?php if ($item['class']) echo ' class="' $item['class'] . '"'?>><a href="<?= $item['href'] ?: './' ?>" title="<?= $item['pageTitle'] ?: $item['title'?>"<?php if ($item['class']) echo ' class="' $item['class'] . '"'?><?php if ($item['accesskey'] !== '') echo ' accesskey="' $item['accesskey'] . '"'?><?php if ($item['tabindex']) echo ' tabindex="' $item['tabindex'] . '"'?><?php if ($item['nofollow']) echo ' rel="nofollow"'?><?= $item['target'?><?php if (!empty($item['subitems'])) echo ' aria-haspopup="true"'?> itemprop="url"><span itemprop="name"><?= $item['link'?></span></a><?= $item['subitems'?></li>
        <?php endif; ?>
      <?php endif; ?>
    <?php 
    endforeach; ?>  
    </ul>
    Meine PHP Kenntnisse sind rudimentär, und ich habe durch viel rumprobiererei rausbekommen, welche $item-Elemente ich wie kombiniere um den gewünschten Effekt zu erzielen. Es sollte so sein dass das Submenü auch offen bleibt, wenn man auf ein Submenü-Item klickt.

    Wenn ein PHP Profi das ganze noch eleganter hinbekommt (z.B. auf eine foreach-Schleife kürzen?) - würde mich freuen.
    Geändert von sui (30.01.2020 um 21:34 Uhr)

  2. #2
    Contao-Fan
    Registriert seit
    20.10.2014.
    Ort
    Freiburg
    Beiträge
    470

    Standard

    Hallo, darf ich fragen wie du das Template eingebunden hast?
    Im Modul "Navigationsmenü" und dieses wiederum in Modul "Navigationsleiste (Bootstrap)"?

    Frage deshalb weil mein Navigationsmenü nur bis Level 2 vernünftig arbeitet. Brauche aber inkl. Level 3...

  3. #3
    Contao-Urgestein Avatar von zonky
    Registriert seit
    19.03.2010.
    Ort
    Berlin, Rdf
    Beiträge
    9.682
    User beschenken
    Wunschliste

    Standard

    Zitat Zitat von sui Beitrag anzeigen
    Kurzbeschreibung was die Modifizierung bewirkt:
    Verändert die Navigation, die auf einer unordered list <ul> basiert, so, dass kein Dropdown-Menü für das Submenü geöffnet wird sondern eine "Collapse" die Kind-Elemente anzeigt.
    hast Du eine Seite als Beispiel, wo man das sehen kann?

  4. #4
    Contao-Nutzer
    Registriert seit
    29.10.2010.
    Beiträge
    45

    Standard

    Guten Abend zonky,

    entschuldige bitte die verspätete Antwort.

    Ich kann dir leider die Seite, bei der ich die Modifikation nutze und die sich noch in Entwicklung befindet, nicht zeigen. Aber Screenshots kann ich machen.


    Im dritten Screenshot habe ich einfach in der Seitenstruktur unterhalb der Seite "Firmen" eine weitere Seite "Test" angelegt, diese aktiv geschaltet, und schwupps ist sie im Menü zu sehen. Die CSS sind für die dritte Ebene nicht vorbereitet, daher erkennt man es nicht direkt, aber es funktioniert.

    Eingebunden habe ich das so:
    1) Unter "Templates" ein neues Template erstellt, als Basis das nav_default.html5 ausgewählt und den Quelltext entsprechend verändert
    2) In den Modulen habe ich ein Navigationsmenü (ohne Navigationsmodul(Bootstrap)) erstellt -> siehe Screenshot Screenshot 2022-03-23 202136.png
    3) Im Seitenlayout habe ich das Navigationsmenü der linken Spalte der Seite zugewiesen -> siehe Screenshot Screenshot 2022-03-23 202408.png

    Ist schon länger her, aber das müsste es gewesen sein.
    Hoffe, Du kriegst es hin.

    Gruß - Sui

  5. #5

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •