Dropdown Menu ab Level 2

Ein CMSimple Support Forum für deutsch sprechende Nutzer und Entwickler
Post Reply
josde
Posts: 29
Joined: Wed Feb 06, 2013 4:59 pm

Dropdown Menu ab Level 2

Post by josde » Fri Jan 27, 2017 6:55 am

Hallo zusammen,

ich habe ein Dropdown Menu über <?php echo li($hc,1)?> erstellt. Nach dem Tutorial von svasti [http://svasti.de/en/?Tutorials/Horizont ... -down-menu] gibt der zweite Parameter das Startlevel an. Ab dem ersten Level funktioniert das auch.

Auf einer Unterseite (<h2>) möchte ich, dass das Dropdown Menu erst beim Menulevel 2 beginnt. Die Eingabe <?php echo li($hc,2)?> zeigt bei mir aber immer noch die komplette Navigation ab Level 1 an.

Bei der Ausgabe eines vertikalen Menus über <?php echo toc(2,3);?> klappt alles wie gewünscht.

Kann mit jemand einen Tipp geben, wie ich die Ausgabe des Dropdown Menus ab Level 2 realisieren kann?

Vielen Dank
Josef

cmb
Posts: 14225
Joined: Tue Jun 21, 2011 11:04 am
Location: Bingen, RLP, DE
Contact:

Re: Dropdown Menu ab Level 2

Post by cmb » Fri Jan 27, 2017 9:17 am

josde wrote:Nach dem Tutorial von svasti [http://svasti.de/en/?Tutorials/Horizont ... -down-menu] gibt der zweite Parameter das Startlevel an.
Das ist so nicht wirklich richtig. Relevant ist vor allem, dass im ersten Parameter die richtigen Seiten übergeben werden. Der zweite Parameter sorgt nur für die gewünschte Verschachtelungstiefe (siehe auch weiter unten).
josde wrote:Auf einer Unterseite (<h2>) möchte ich, dass das Dropdown Menu erst beim Menulevel 2 beginnt.

Wenn Du dort alle <h2> mit Unterseiten auflisten willst, kannst Du Dir ein eigenes $hc2 im Template wie folgt erzeugen:

Code: Select all

$hc2 = array_values(array_filter($hc, function($i) {
    global $l;
    
    return $l[$i] >= 2; // 2 für h2, 3 für h3 etc.
})); 
Und dieses dann eben per `li($hc2, 2)` anzeigen lassen. Wenn Du statt dessen `li($hc, 1)` aufrufen würdest, dann würden alle Menüpunkte eine Ebene tiefer verschachtelt dargestellt.
Christoph M. Becker – Plugins for CMSimple_XH

josde
Posts: 29
Joined: Wed Feb 06, 2013 4:59 pm

Re: Dropdown Menu ab Level 2

Post by josde » Sun Jan 29, 2017 10:51 am

Hallo Christoph,

danke für deinen Code, der so auch funktioniert. Leider ist das nicht die Lösung für mein Problem. Vielleicht war meine Darstellung nicht eindeutig genug. Daher versuch ich es noch mal:

Ich habe folgende Seitenstruktur:

Code: Select all

Seite1
Seite2
Seite3
 |__ Seite31
 |__ Seite32
      |__ Seite321
      |__ Seite322
Seite4
Über <?php echo li($hc,'menulevel')?> wird folgendes Dropdown Menu erstellt:

Code: Select all

Seite1  Seite2  Seite3  Seite4
                  Seite31
                  Seite32
                    Seite321
                    Seite322
Wenn ich jetzt die Seite3 anklicke, soll das Dropdown Menu erst hier beginnen und dann so aussehen:

Code: Select all

Seite31  Seite32
          Seite321
          Seite322
Die oberste Ebene soll also entfallen. Mit <?php echo toc(2,3);?> ist das einfach zu realisieren aber leider erzeugt das kein Dropdown Menu und die zweite Ebene (Seite321) wird erst beim Anklicken von Seite32 sichtbar.

Gibt es eine Möglichkeit, die li() Funktion so zu ändern, dass mein Vorhaben möglich ist oder evtl. einen ganz anderen Lösungsansatz?

Danke
Josef

cmb
Posts: 14225
Joined: Tue Jun 21, 2011 11:04 am
Location: Bingen, RLP, DE
Contact:

Re: Dropdown Menu ab Level 2

Post by cmb » Sun Jan 29, 2017 12:50 pm

josde wrote:Die oberste Ebene soll also entfallen. Mit <?php echo toc(2,3);?> ist das einfach zu realisieren aber leider erzeugt das kein Dropdown Menu und die zweite Ebene (Seite321) wird erst beim Anklicken von Seite32 sichtbar.
Kurz allgemein zu toc() und li(): toc() sammelt die gewünschten Seiten, und ruft li() dann mit diesen auf. Dabei ist toc() nur für "normale" Menüs ausgelegt, eben nicht für Drop-Downs. Daher müsstest Du die gewünschten Seiten selbst sammeln, was für diesen Anwendungsfall aber komplexer ist, als mein Script weiter oben. Man könnte nun toc() anpassen, aber das ist mir grundsätzlich zu kompliziert, und daher bevorzuge ich die Verwendung von XH_Pages (auch wenn das etwas langsamer ist). Das könnte dann wie folgt aussehen:

Code: Select all

<?php

class Josde_Toc
{
    private $pages;

    public function __construct()
    {
        $this->pages = new XH_Pages();
    }

    public function render()
    {
        global $s, $l, $_XH_firstPublishedPage;

        if ($s <= $_XH_firstPublishedPage) {
            $parent = null;
            $level = 1;
        } else {
            $parent = $s;
            $level = $l[$s] + 1;
        }
        $indexes = $this->gatherIndexes($parent);
        sort($indexes);
        return li($indexes, $level);
    }

    private function gatherIndexes($parent)
    {
        if (!isset($parent)) {
            $indexes = $this->pages->toplevels();
        } else {
            $indexes = $this->pages->children($parent);
        }
        foreach ($indexes as $index) {
            $indexes = array_merge($indexes, $this->gatherIndexes($index));
        }
        return $indexes;
    }
}

function josde_toc()
{
    $toc = new Josde_Toc();
    return $toc->render();
}

?>
Diesen Code kopierst Du entweder in cmsimple/userfuncs.php oder in template.htm. In template.htm rufst Du dann an der gewünschten Stelle folgendes auf:

Code: Select all

<?php echo josde_toc()?>
Das sollte die von Dir gewünschte Menüstruktur erzeugen.
Christoph M. Becker – Plugins for CMSimple_XH

Tata
Posts: 3586
Joined: Tue May 20, 2008 5:34 am
Location: Slovakia
Contact:

Re: Dropdown Menu ab Level 2

Post by Tata » Sun Jan 29, 2017 2:36 pm

Hallo, Josde, meinst Du nicht etwas, wie das hier?
http://cmsimple_xh_plugins.cmsimple.sk/
CMSimple.sk
It's no shame to ask for an answer if all efforts failed.
But it's awful to ask without any effort to find the answer yourself.

josde
Posts: 29
Joined: Wed Feb 06, 2013 4:59 pm

Re: Dropdown Menu ab Level 2

Post by josde » Sun Jan 29, 2017 5:16 pm

Danke Christoph für Deine Mühen. So funktionierts bei mir.

mhz
Posts: 676
Joined: Tue Jun 25, 2013 8:46 pm
Location: Heusenstamm, Hessen
Contact:

Re: Dropdown Menu ab Level 2

Post by mhz » Tue Oct 03, 2017 2:13 pm

Hallo zusammen,
ich habe mit einem eigenen Template nun doch mal grundlegend angefangen und kam bisher recht gut weiter xh.michael-zajusch.de.
Ich habe bisher das schon gelöst: Verschiedene Aufzählungspunkte vor h1, h2, h3. Das Navigationsmenü soll so wie es jetzt aussieht, bestehen bleiben.
Jetzt stellen sich jedoch einige Fragen. Wie bekomme ich es hin, dass alle Menüpunkte in der Navigation eingeklappt sind und nur die <h1> sichtbar sind. Klicke ich auf einen dieser und es verbergen sich dahinter noch andere <h2>, so soll nach einem Klick auf <h1> der Muenüpunkt <h2> sichtbar werden, aber um einen (ca. 5px) Versatz nach rechts (so ähnlich wie hängender Einzug bei Word). Dadurch soll der Besucher merken, dass diese (Unter-)Punkte zusammengehören. Erst wenn <h2> angeklickt wird, soll sich, sofern vorhanden, <h3> (usw. bis <h9> [bei XH 1.70]) öffnen.
Befindet sich der User in einem Menüfeld, sollen alle anderen wieder bis auf die <h1>-Ebene geschlossen sein.

Was ich bisher ausprobiert habe:
1. die oben angegebene Lösung mit Userfuncs und <?php echo josde_toc;?>
2. die Lösung mit <?php echo li($hc,1);?> <--- das ist z.Zt. alleinig aktiviert!
3. die Lösung mit <?php echo toc(2,3);?>

Ich weiß jedoch nicht, ob oder wann ich <?php echo toc();?> auch eingefügt lassen soll, denn es ergeben sich unterschiedliche Szenarien beim Aufruf.

Ich bitte um Vorschläge, wie ich das Problem lösen kann.
Danke im Voraus!
Michael
Michael Zajusch (mhz)-- Mein Tutorial für CMSimple_XH. Früher

cmb
Posts: 14225
Joined: Tue Jun 21, 2011 11:04 am
Location: Bingen, RLP, DE
Contact:

Re: Dropdown Menu ab Level 2

Post by cmb » Tue Oct 03, 2017 3:59 pm

Aus dem Kopf heraus:

Code: Select all

<?php toc(1,1)?>
<?php toc(2,2)?>
<?php toc(3,3)?>
erzeugt drei einfache (also nicht verschachtelte) Listen für die jeweiligen Menüebenen, die nur diejenigen Seiten enthalten, die auch bei toc() (ohne Parameter) angezeigt würden. Den Rest kann man wohl per CSS erledigen; evtl. ist der :empty Pseudo-Selektor dabei hilfreich.
Christoph M. Becker – Plugins for CMSimple_XH

Hartmut
Posts: 553
Joined: Sat Nov 05, 2011 6:13 pm
Location: Butzbach, Deutschland
Contact:

Re: Dropdown Menu ab Level 2

Post by Hartmut » Tue Oct 03, 2017 5:25 pm

Hallo,

für die Einrückung der H2/H3-Seiten würde sich im Menü beispielsweise "margin-left" anbieten.
Hier ist eine kurze Anregung aus einem "mini1"-Template, das ich damals für meinen Belange modifiziert hatte, aber für deine Vorstellungen vermutl. noch etwas angepasst werden müsste:

Template (nav2 = vertikales Menü):

Code: Select all

    <div class="nav2">
        <?php echo toc(1,4);?>
...
    </div>
CSS:

Code: Select all

.nav2 {
    float:left;
    width: 20%;
    clear:left;
	}
.nav2 ul {
    list-style-type: none;
    padding:.2em 0 .01em 0;
    margin:0.5em 0 0.5em 0;
    background:#eaeaea;
    border-radius: .5em;
    border:1px #0080c0 solid;
}
.nav2 ul li {
    margin: 0 .1em .6em .1em ;
    border-radius:.5em;
    padding: 0 .5em 0 .5em;
    background:#9FC4F5; /* Ke: farbl. hervorhebung des aktiven H2 - H3 Verzeichnisses */
}
.nav2 ul li a {
    color: black;
    text-decoration:none;
    margin: 0 -.6em 0 -.6em;
    padding: 0 .6em 0 .6em;
    background:#eaeaea; 
    display:block;
    border-radius: 0.5em;
}
.nav2 ul li a:hover {
    color:#0a0;
    background:white;
}
.nav2 ul li ul  {
    margin:0 -1em 0 0.5em;
    padding: .5em 0 0 0;
    border-radius: .5em;
    border:1px #0080c0 solid;
}
.nav2 ul li ul li {
    padding-left: 1em;
    margin-left:0;
}
.nav2 ul li ul li a {
    margin-left:-1em;
    padding-left: 0.3em;
}
Viele Grüße
Hartmut
You do not have the required permissions to view the files attached to this post.

Post Reply