wp_list_pages ohne Links

Graveto

Hi,

ich habe ein Drop-Downmenü mit superfish gemacht. Die notwendige Liste meiner Seiten generiere ich per wp_list_pages().

Ich hätte gerne, dass die oberste Ebene des Menüs nicht verlinkt ist.
So meine ich das:

HTML

<ul>
  <li>Thema 1
    <ul><a href="#">Punkt1</a></ul>
    <ul><a href="#">Punkt2</a></ul>
    <ul><a href="#">Punkt3</a></ul>
  </li>
  <li>Thema 2
    <ul><a href="#">Punkt1</a></ul>
    <ul><a href="#">Punkt2</a></ul>
  </li>
</ul>

Alles anzeigen

Hier soll's mal eingesetzt werden: http://annettes.alfahosting.org/MLI/
Bisher verbergen sich hinter der obersten Ebene des Menüs leere Seiten. btw ich will das Menü nicht statisch machen.

Hat jemand ne Idee? Danke.

Graveto

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Ammaletu

Spontane doofe Idee: Die unerwünschten Links mit jQuery entfernen. Etwa so:

Code

jQuery('.menu ul li > a').each(function(){
  jQuery(this).after(jQuery(this).text()).remove();

Die leeren Seiten gibt es natürlich trotzdem, die man dann per Suche oder Google z.B. finden kann.

kaiser

Ammaletu: Bin kein Js-Profi, aber entfernt das nicht den gesamten Link (incl. Text). Weil wenn ja, wäre es genauso einfach das nur per css: display: none; auszublenden. Ein php: str_replace könnte lediglich das <a href=""> und das </a> entfernen. Aber: Auch nicht schön.

Graveto

Danke für die Idee. Ich werd's mal versuchen. Die leeren Seiten werde ich wohl nicht los. Schliesslich will ich das Menü dynamisch erzeugen können.

Wie funktioniert das mit dem str_replace?
Der Text soll schon sichtbar sein.

Morris

Mit jQuery würde sich hier wohl unwrap() empfehlen.

Gruß
Mo

Graveto

Bin schlecht mit Java und schaff's einfach nicht.
So erzeuge ich mein Menü:

HTML

<ul id='page-menu' class='sf-menu'>  
    <?php wp_list_pages('sort_column=menu_order&title_li=&exclude=5'); ?>
</ul>

So habe ich versucht die Links loszuwerden:

PHP

<script type="text/javascript">
    jQuery('.sf-menu ul li > a').each(function(){
    jQuery(this).after(jQuery(this).text()).remove();
</script>

Da tut sich leider gar nix. Kann mir jemand helfen und evtl. gleich die unwrap() Funktion einbauen?

DANKE

Morris

Java und Javascript haben bis auf die Namensähnlichkeit nichts miteinander zu tun.

Hast du den definierten Selector überprüft? Das geht z.B. sehr gut mit Firebug

Was genau verstehst du an den Beispielen in der jQuery-Doku zu unwrap() nicht?

Gruß
Mo

Ammaletu

Morris hat auf jeden Fall schon mal Recht, unwrap() ist da einfacher.

kaiser: Um den Text zu erhalten war in meinem ersten Versuch die after()-Methode gedacht, welche den Text dahinter einfügen sollte ehe der Link entfernt wird.

So, noch mal umgebaut und Selektor berichtigt. Geht das jetzt?

Code

<script type="text/javascript">
    jQuery('ul#page-menu > li > a').text().unwrap();
</script>

Du musst mal schauen, ob der Selektor so jetzt schon stimmt. Erklärung: Mit ">" wird das direkte Kind angesprochen. Das soll verhindern, dass die inneren Links auch entfernt werden. Ich hoffe, unwrap() nach text() geht auch.

Graveto

Ich meinte schon JavaScript. Aber ich kann leider beides kaum :D
Das ist was mir der web-develpper ausgibt für einen der obersten Menüpunkte.

html > body > div#top > div#content > div.shell > div.wrapper > div #menu > ul #page-menu sf-menu > li .page_item page-item-7 > a

Stimmt doch dann. Oder nicht?!

Das Problem mit dem unwrap()-Beispiel ist, dass die Funktion dort von einem Button aufgerufen wird. Ich hab kein Button und sollte die Funktion vermutl. beim laden der Seite ausführen.
Keine Ahnung wie die entsprechenden Methoden heißen.

Graveto

Zitat von Ammaletu
Code
<script type="text/javascript">
    jQuery('ul#page-menu > li > a').text().unwrap();
</script>
Du musst mal schauen, ob der Selektor so jetzt schon stimmt. Erklärung: Mit ">" wird das direkte Kind angesprochen. Das soll verhindern, dass die inneren Links auch entfernt werden. Ich hoffe, unwrap() nach text() geht auch.

Ne, klappt leider nicht! Danke für die Erklärung des >. Das war mir ein Rätsel. Und danke für euer Hilfe überhaupt...

Ammaletu

Ach so, ja, ausführen wenn die Seite geladen wird. Dann so:

Code

<script type="text/javascript">
jQuery(document).ready(function() {
  jQuery('ul#page-menu > li > a').text().unwrap();
});
</script>

Mit dem text().unwrap() bin ich mir nicht ganz sicher. Falls das so nicht geht, probiere das hier:

Code

<script type="text/javascript">
jQuery(document).ready(function() {
  jQuery('ul#page-menu > li > a').wrapInner('<span></span>').find('span').unwrap();
});
 </script>

Graveto

mmmm. klappt nicht...
Ich binde jquery so ein:

HTML

<script src="http://code.jquery.com/jquery-latest.js"></script>

Wo ich die Funktionen dann ausführe spielt keine Rolle? oder doch?

Graveto

Hab mir eben mal ein Beispiel gebaut. Und es hat funktioniert. Das File findet ihr im Anhang.

Jetzt muss es nur noch in der echten Umgebung klappen. Das sollte allerdings machbar sein. Danke nochmal für eure Hilfe! Das war super!!!

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">


<html>
<head>
  <title>Menuetest</title>
  <script src="http://code.jquery.com/jquery-latest.js"></script>


   <script type="text/javascript">
      jQuery(document).ready(function() {
         jQuery('ul#page-menu > li > a').wrapInner('<span></span>').find('span').unwrap();
      });
   </script>


</head>


<body>
  <ul id='page-menu' class='sf-menu'>
    <li class="page_item page-item-291">
      <a href="#" title="">Oben 1</a>


      <ul>
        <li class="page_item page-item-301"><a href="#" title="">Punkt 1</a></li>


        <li class="page_item page-item-304"><a href="#" title="">Punkt 2</a></li>


        <li class="page_item page-item-297"><a href="#" title="">Punkt 3</a></li>
      </ul>
    </li>


    <li class="page_item page-item-7">
      <a href="#" title="">Oben 2</a>


      <ul>
        <li class="page_item page-item-257"><a href="#" title="">Punkt 1</a></li>


        <li class="page_item page-item-258"><a href="#" title="">Punkt 2</a></li>


        <li class="page_item page-item-261"><a href="#" title="">Punkt 3</a></li>
      </ul>
    </li>
  </ul>
</body>
</html>

Alles anzeigen

Graveto

Leider klappt es nicht mit dem superfish-menü.
Ich hab keine Ahnung warum :confused:.

Hat noch jemand ne Idee?

Wenn ich den generierten Quellcode aus dem Browser neheme und daraus ein eine neue Seite baue funktioniert es:

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">


<html>
<head>
  <title>Menuetest</title>
  <script src="http://code.jquery.com/jquery-latest.js"></script>


   <script type="text/javascript">
      jQuery(document).ready(function() {
         jQuery('ul#page-menu > li > a').wrapInner('<span></span>').find('span').unwrap();
      });
   </script>


</head>


<body>
                  <ul id='page-menu' class='sf-menu'>
                                            <li class="page_item page-item-5"><a href="index.php" title="News">News</a>    <span class="subline">Wann? Wo? Was?</span></li>
                        <li class="page_item page-item-291"><a href="http://annettes.alfahosting.org/MLI/?page_id=291" title="Capoeira">Capoeira</a>    <span class="subline">das Spiel</span>
<ul>
    <li class="page_item page-item-301"><a href="http://annettes.alfahosting.org/MLI/?page_id=301" title="Geschichte">Geschichte</a>    </li>


    <li class="page_item page-item-304"><a href="http://annettes.alfahosting.org/MLI/?page_id=304" title="Die Roda">Die Roda</a>    </li>
    <li class="page_item page-item-297"><a href="http://annettes.alfahosting.org/MLI/?page_id=297" title="Graduation">Graduation</a>    </li>
</ul>
</li>
<li class="page_item page-item-7"><a href="http://annettes.alfahosting.org/MLI/?page_id=7" title="Training">Training</a>    <span class="subline">Orte und Zeiten</span>
<ul>
    <li class="page_item page-item-257"><a href="http://annettes.alfahosting.org/MLI/?page_id=257" title="Offenburg">Offenburg</a>    </li>


    <li class="page_item page-item-258"><a href="http://annettes.alfahosting.org/MLI/?page_id=258" title="Karlsruhe">Karlsruhe</a>    </li>
    <li class="page_item page-item-261"><a href="http://annettes.alfahosting.org/MLI/?page_id=261" title="Kehl">Kehl</a>    </li>
    <li class="page_item page-item-313"><a href="http://annettes.alfahosting.org/MLI/?page_id=313" title="Bühl">Bühl</a>    </li>
    <li class="page_item page-item-315"><a href="http://annettes.alfahosting.org/MLI/?page_id=315" title="Kindertraining">Kindertraining</a>    </li>
</ul>


</li>
<li class="page_item page-item-15"><a href="http://annettes.alfahosting.org/MLI/?page_id=15" title="Über uns…">Über uns…</a>    <span class="subline">der Verein</span>
<ul>
    <li class="page_item page-item-324"><a href="http://annettes.alfahosting.org/MLI/?page_id=324" title="Tesourinha">Tesourinha</a>    </li>
    <li class="page_item page-item-326"><a href="http://annettes.alfahosting.org/MLI/?page_id=326" title="Geschichte">Geschichte</a>    </li>
</ul>
</li>
<li class="page_item page-item-9"><a href="http://annettes.alfahosting.org/MLI/?page_id=9" title="Brasil-Tanz">Brasil-Tanz</a>    <span class="subline">Samba, Frevo,... </span>


<ul>
    <li class="page_item page-item-506"><a href="http://annettes.alfahosting.org/MLI/?page_id=506" title="Frevo">Frevo</a>    </li>
    <li class="page_item page-item-511"><a href="http://annettes.alfahosting.org/MLI/?page_id=511" title="Maculelé">Maculelé</a>    </li>
    <li class="page_item page-item-521"><a href="http://annettes.alfahosting.org/MLI/?page_id=521" title="Forró">Forró</a>    </li>
    <li class="page_item page-item-526"><a href="http://annettes.alfahosting.org/MLI/?page_id=526" title="Maracatú">Maracatú</a>    </li>


    <li class="page_item page-item-531"><a href="http://annettes.alfahosting.org/MLI/?page_id=531" title="Samba">Samba</a>    </li>
</ul>
</li>
<li class="page_item page-item-187"><a href="http://annettes.alfahosting.org/MLI/?page_id=187" title="Medien">Medien</a>    <span class="subline">Fotos, Videos, Musik</span>
<ul>
    <li class="page_item page-item-318"><a href="http://annettes.alfahosting.org/MLI/?page_id=318" title="Fotos">Fotos</a>    </li>
    <li class="page_item page-item-320"><a href="http://annettes.alfahosting.org/MLI/?page_id=320" title="Videos">Videos</a>    </li>


    <li class="page_item page-item-322"><a href="http://annettes.alfahosting.org/MLI/?page_id=322" title="Liedertexte">Liedertexte</a>    </li>
    <li class="page_item page-item-469"><a href="http://annettes.alfahosting.org/MLI/?page_id=469" title="Presse">Presse</a>    </li>
</ul>
</li>
<li class="page_item page-item-384"><a href="http://annettes.alfahosting.org/MLI/?page_id=384" title="etc">etc</a>    <span class="subline">der Rest</span></li>
                                    </ul>




</body>
</html>

Alles anzeigen

Ammaletu

Auf Deiner Seite sind hoverIntent.js und super-fish.js *vor* der jQuery-Lib eingebunden. Das ist vermutlich falsch, jQuery muss zuerst. jQuery solltest Du im übrigen nicht von jquery.com einbinden, sondern besser die komprimierte Variante, die bei WP eh schon dabei ist. Das sollte so hier aussehen:

PHP

<?php wp_enqueue_script('jquery'); ?>

Graveto

Ne. Es will nicht klappen. Danke trozdem...

Ammaletu

In erster Linie klappt es nicht, weil Du jQuery immer noch nach den jQuery-Plugins lädst. Das kann nicht gehen. Setze die beiden genannten JS-Dateien bitte mal unter den wp-head-Aufruf. Da müssten die enqueue-Anweisungen die JavaScripte einfügen, denke ich. Zur Sicherheit, den document-ready-Schnipsel am besten auch gleich darunter.

Graveto

mmm. Ich habe doch folgendes da stehen und es funktioniert nicht:

HTML

<?php wp_enqueue_script('jquery'); ?>


    <script type="text/javascript">
    jQuery(document).ready(function() {
    jQuery('ul#page-menu > li > a').wrapInner('<span></span>').find('span').unwrap();
    });
    </script>


    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/sf/js/hoverIntent.js"></script>
    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/sf/js/superfish.js"></script>

Alles anzeigen

Is doch dann die richtige Reihenfolge?!?

Ammaletu

Nein, wie Du ja selber am Quelltext Deiner Seite siehst.[COLOR=Black] ;-) [/COLOR][COLOR=#000080][COLOR=Black]wp_enqueue_script sagt WP nur, dass es das Script laden soll. Das fügt nichts in die Seite ein. WP sammelt alle diese Aufrufe und fügt sie an der Stelle ein, an der wp_head() definiert ist. Deshalb, wie oben schon geschrieben, die Scripte mal unter wp_head() rücken. Mit etwas Glück geht es dann.[/COLOR]
[/COLOR]

Graveto

Oh. Das hatte ich falsch verstanden. Leider klappt's immer noch nicht. Vielleicht sollte ich das Menü doch statisch aufbauen.
Danke für deine Hilfe!

Willkommen! Melden Sie sich an oder registrieren Sie sich.

wp_list_pages ohne Links

Jetzt mitmachen!