Come fare in modo che la voce di menu di primo livello non abbia un collegamento, ma abbia dei sottomenu collegati?

Ho alcuneidee:

1. Impostail linkpersonalizzato su # chenon restituirànulla
2. Aggiungi una classepersonalizzata aglielementie quindi utilizzajQueryper rimuoverei collegamenti.
3. Utilizza un PHPequivalente almetodojQuery
4. Utilizzailplug-in Disabilita collegamento almenuprincipale (o smontaloe scriviiltuo)

I have a few ideas:

1. Set the custom link to # which won't return anything
2. Add a custom class to the items and then use jQuery to remove the links.
3. Use a PHP equivalent to the jQuery method
4. Use the Disable Parent Menu Link plugin (or take it apart and write your own)

Ilmodopiù sempliceperfarlo senza unplugin o altro è usare lafunzione "Menu" di WordPress.Ecco leistruzioniper WordPress 4.8:

1. Dalla dashboard di WordPress,vai su "Aspetto -> Menu"
2. Nella scheda "Modificamenu",seleziona "Linkpersonalizzati"
3. Per l'URL,inserisci "#" (senza virgolette)
4. Periltesto del collegamento,inserisciiltesto desideratoperil livello superiore delmenu a discesa
5. Fai clic sulpulsante "Aggiungi almenu"
6. Trascina la voce dimenunellaposizione desiderata all'interno delmenu
7. Per la voce dimenu che hai appena aggiunto,fai clic sullafrecciagiù a destra dell'elemento (leggerà "linkpersonalizzato" a sinistra dell'elemento)
8. Rimuoviil "#" dall'URL.Questo,in tuttii browser,convertiràil collegamentoin testonormale.
9. Fai clic sulpulsante "Salvamenu"

The easiest way to do it without a plugin or anything is to use the "Menus" function of WordPress. Here are the instructions for WordPress 4.8:

1. From your WordPress dashboard, go to "Appearance -> Menus"
2. In the "Edit Menus" tab, select "Custom Links"
3. For the URL, Enter "#" (no quotes)
4. For the link text, enter your desired text for the top level of your drop-down menu
5. Click the "Add to Menu" button
6. Drag the menu item to its desired position within your menu
7. For the menu item you just added, click the down arrow to the right of the item (it will read "custom link" to the left of the item)
8. Remove the "#" from the URL. This - in all browsers - will convert the link to plain text.
9. Click on the "Save Menu" button

Ilmetodopiù semplice che hoescogitatoera creare unelemento Linkpersonalizzato conil valore URL link di # . Questo stainviando l'utente a un hash vuoto sulla stessapagina,quindifondamentalmentenon si collega danessunaparte.

Tuttavia,l'utilizzo di hash vuotiperi collegamenti segnapostopresenta alcunieffetti collaterali. Il collegamento verrà comunque visualizzatoe si comporterà come un collegamento,quindipotrebbe confondere un utente quandofa clic su quello che sembraessere un collegamentomanon accadenulla. L'altroeffetto è chefacendo clic su un link hash vuoto sovrascriverà qualsiasi hashesistente,inviando l'utente all'inizio dellapagina. Questopotrebbenonessere cosìpreoccupanteper unmenu che sitrova comunquenellaparte superiore dellapagina,ma è abbastanza sconcertante quando lapagina saltainaspettatamente quandononte lo aspetti,specialmente se questo èper unmenu apiè dipagina.

La soluzione è combinareilmetodo hash vuoto con unaparte di codiceper rilevare quando vengono utilizzati collegamenti hash vuotinelmenue rimuovere completamente l'attributo href da quel collegamento. Unelemento a senza un attributo href è metodo HTML 5 corretto per creare un collegamento segnaposto.

 /**
 * Rimuovi l'href dai link vuoti "& lt; a href=" # ">`nei menu dinavigazione
 * @param string $menuilmenu HTML corrente
 * @return stringailmenu HTMLmodificato
 */
add_filter ('wp_nav_menu_items',function ($menu) {
    return str_replace ('& lt; a href="#"','& lt; a',$menu);
});
 

The simplest method I came up with was to create a Custom Link item with the Link URL value of #. This is sending the user to an empty hash on the same page, so basically links nowhere.

However, there are some side-effects of using empty hashes for placeholder links. The link will still appear and behave like a link, so it could confuse a user when they are clicking on what appears to be a link but nothing happens. The other effect is that clicking on an empty hash link will override any existing hash, sending the user to the top of the page. This might not be so worrying for a menu which is at the top of the page anyway, but it is quite jarring when the page unexpectedly jumps when you are not expecting it, especially if this is for a footer menu.

The solution is to combine the empty hash method with a piece of code to detect when empty hash links are used in the menu and to remove the href attribute from that link entirely. An a element without a href attribute is the correct HTML 5 method of creating an placeholder link.

/**
 * Remove the href from empty links `<a href="#">` in the nav menus
 * @param string $menu the current menu HTML
 * @return string the modified menu HTML
 */
add_filter( 'wp_nav_menu_items', function ( $menu ) {
    return str_replace( '<a href="#"', '<a', $menu );
} );

Questo hafunzionatoperme:

Ho attivato Classi CSS in Menu> Opzioni schermo> Classi CSS Poi ho dato l'elemento dimenu che volevo disattivare la classe ".nolink" e ho aggiunto questopezzo di codice almiopannello CSSpersonalizzato:

 .nolink {
   pointer-events: none;
   cursor: default;
}
 

This worked for me:

I activated CSS Classes in Menus > Screen Options > CSS Classes Then I gave the menu element that I wanted to deactivate the class ".nolink" and added this piece of code to my custom CSS panel:

.nolink {
   pointer-events: none;
   cursor: default;
}

Utilizzando l'approccio PHP ho aggiunto questo codice afunctions.php:

 function remove_link_contact_menu($item_output, $item) {
    if ($item->post_name == 'contact')
        return '<span>' . $item->title . '</span>';

    return $item_output;
}
add_filter('walker_nav_menu_start_el', 'remove_link_contact_menu', 20, 2);
add_filter('megamenu_walker_nav_menu_start_el', 'remove_link_contact_menu', 20, 2);
 

Questo sostituiràil link con unelemento spanperilmenuitem conpost_name=="contact",che è quello che stavo cercando.Puoi cambiarlofacilmenteper verificareiltitolo delmenu o l'ID,oppure aggiungere del codiceper verificare se ha voci dimenufiglio,ecc.

Using the PHP approach I added this code to functions.php:

function remove_link_contact_menu($item_output, $item) {
    if ($item->post_name == 'contact')
        return '<span>' . $item->title . '</span>';

    return $item_output;
}
add_filter('walker_nav_menu_start_el', 'remove_link_contact_menu', 20, 2);
add_filter('megamenu_walker_nav_menu_start_el', 'remove_link_contact_menu', 20, 2);

This will replace the link with a span element for the item menu with the post_name == "contact", which is what I was looking for. You can easily change that to check for the menu title or the ID, or add some code to check if it has any child menu items etc.

Apprezzo che questo sia un vecchiothread,maper unmodo rapidoe sporco di avere un collegamentoin Wordpress è rendere l'URL del collegamento come:

<"#_

Notail carattere di sottolineatura dopo l'hashtag.In questomodo,seiltuomenu scorre lapagina versoilbasso (cioè risolto),non si ottiene un salto all'inizio dellapagina quando sifa clic su diessoe non ènecessario alcunplug-in/script.

Appreciate this is an old thread, but for a quick and dirty way of having a link in Wordpress is by making the link URL as:

#_

Notice the underscore after the hashtag. This way if your menu scrolls down the page (ie. fixed), you don't get a jump to the top of the page when clicking on it and doesn't require any plugins/script.

Crea la voce dimenu "Linkpersonalizzati"e aggiungi "javascript :;"(senza virgolette)peril campo URL.Questo è unmodomigliore rispetto all'utilizzo di "#"perchénonfarà scorrere lapagina verso l'alto quando viene cliccato.

Create "Custom Links" menu item and add "javascript:;" (without quotes) for the URL field. This is better way than using "#" because it won't scroll your page to the top when clicked.

Ho risoltoin questomodo:in header.php (deltuotema) ho cercato:

 'link_before'     => '',
'link_after'      => '',
 

e sostituito con:

 'link_before'     => '<script>var scriptTag=document.getElementsByTagName("script");scriptTag=scriptTag[scriptTag.length-1];if(scriptTag.parentNode.href)if(scriptTag.parentNode.href.slice(-1)=="#")document.write("<span onclick=\"return false\">")</script>',
'link_after'      => '<script>var scriptTag=document.getElementsByTagName("script");scriptTag=scriptTag[scriptTag.length-1];if(scriptTag.parentNode.href)if(scriptTag.parentNode.href.slice(-1)=="#")document.write("</span>")</script>',
 

Inparole semplici,questo script controlla seil suo collegamentoprincipaletermina con "#",in questo caso aggiunge unelemento span attorno al contenuto deltag A,che disabilitail clic.

Spero che aiuti :-)

I solved this way: in header.php (of your theme) I searched for:

'link_before'     => '',
'link_after'      => '',

and replaced with:

'link_before'     => '<script>var scriptTag=document.getElementsByTagName("script");scriptTag=scriptTag[scriptTag.length-1];if(scriptTag.parentNode.href)if(scriptTag.parentNode.href.slice(-1)=="#")document.write("<span onclick=\"return false\">")</script>',
'link_after'      => '<script>var scriptTag=document.getElementsByTagName("script");scriptTag=scriptTag[scriptTag.length-1];if(scriptTag.parentNode.href)if(scriptTag.parentNode.href.slice(-1)=="#")document.write("</span>")</script>',

In simple words, this script checks if its parent link ends with "#", in this case it adds a span element around the content of the A tag, that disables the click.

Hope it helps :-)

Come altri qui hanno suggerito,puoi creare una voce dimenu di collegamentopersonalizzata con # come URL.Quindi cancella la # una volta aggiunta almenu.Infine,puoi utilizzare questa semplice regexper rimuovereiltageffettivo da quei link.

 preg_replace('/<a>([^<]+)<\/a>/i', '<span class="no-link">$1</span>', $navHTML);
 

As others here have suggested you can create a custom link menu item with the # as its url. Then erase the # once it is added to the menu. And finally, you can use this simple regex to strip the actual tag from those links.

preg_replace('/<a>([^<]+)<\/a>/i', '<span class="no-link">$1</span>', $navHTML);

Questo rimuoveràil clic (e annullerà lo stile dell'elemento).In questomodo,non ènecessario utilizzarei link #personalizzatinelmenu.

 add_action( 'wp_footer', function(){
    ?>
    <script>
    (function( $ ) {
        var itemm = $('#main-menu .menu-item-has-children > a');
        itemm.click(function(){
            document.activeElement && document.activeElement.blur();
            return false;
        });
    })(jQuery);
    </script>
<?php
 }, 1, 0 );
 

This will remove the click (and unstyle the item). This way, you dont have to use the custom # links in your menu.

add_action( 'wp_footer', function(){
    ?>
    <script>
    (function( $ ) {
        var itemm = $('#main-menu .menu-item-has-children > a');
        itemm.click(function(){
            document.activeElement && document.activeElement.blur();
            return false;
        });
    })(jQuery);
    </script>
<?php
 }, 1, 0 );

Mi rendo conto diesserein ritardonelgioco,ma questi sonoi duemetodi che utilizzo:

1) Rendi la voce dimenuprincipale un duplicato dellaprima voce secondariae cambia la suaetichetta.Adesempio,seilprimoelementoin "Prodotti" è "Prodotto 1",utilizza "Prodotto 1" come voce dimenuprincipale,quindimodifica la suaetichettain "Prodotti".In questomodo,sia "Prodotti" che "Prodotto 1"porteranno allapagina Prodotto 1.

2) Aggiungi un reindirizzamentoin modo che lapagina Prodotti venga reindirizzata al Prodotto 1. Il vantaggio di questa opzione è cheti consente di creare unapagina Prodotti vuotaper creare unelencogerarchicoin Pages,ma se qualcuno cerca di andare anellapagina Prodotti vuota,verranno reindirizzati.

I realize I'm late in the game, but these are the two methods I use:

1) Make the parent menu item a duplicate of the first sub-item, and change its label. For example, if the first item under "Products" is "Product 1", use "Product 1" as the parent menu item, then change its label to "Products". That way, both "Products" and "Product 1" will lead to the page Product 1.

2) Add a redirect so that the Products page is redirected to Product 1. The benefit of this option is that it allows you to create a blank Products page to create a hierarchical listing in Pages, but if anyone tries to go to the blank Products page, they will be redirected.

Vai su Aspetto,quindifai clic suimenu.In questa sezione vai sotto la struttura delmenue fai clic sullafreccia versoilbassoperespandere lapaginae vedrai una casella che dice disabilita collegamento.Seleziona la casellae salva.

Go to Appearance, then click on menus. In this section go under menu structure and click on the arrow down to expand the page and you'll see a box that says disable link. Check that box and save.

1. Impostail linkpersonalizzato su # chenon restituirà alcunelemento dell'elenco

2. Aggiungi questofiltro:

    add_filter( 'wp_nav_menu_items', 'wpse_remove_empty_links' );
   
   function wpse_remove_empty_links( $menu ) {
   
       return preg_replace("/<a href=\"#\">(.+?)<\/a>/is", "<span>$1</span>", $menu);
   
   }
   

3. Modifica lo span CSSper ottenere lo stesso stile di <a>,non dimenticare cursor: context-menu;.

1. Set the custom link to # which won't return anything List item

2. Add this filter:

   add_filter( 'wp_nav_menu_items', 'wpse_remove_empty_links' );
   
   function wpse_remove_empty_links( $menu ) {
   
       return preg_replace("/<a href=\"#\">(.+?)<\/a>/is", "<span>$1</span>", $menu);
   
   }
   

3. Edit span CSS to get same style as <a>, don't forget cursor: context-menu;.

Scrivendo dal 1/2019,la soluzione cheproduce HTML5 corretto èfare quanto segue.

1. Aggiungi un linkpersonalizzato con l'URLimpostato su #e ilnome che desideri.Entrambii campi sono obbligatori.
2. Modificail linkpersonalizzato appena aggiuntoin modo che l'URL sia vuoto.
3. Salva lemodifiche.

Questoprodurrà unmenu dinavigazione diprimo livello che è <a>Menu</a> che èilmodo correttoper rappresentare un linknon cliccabile.

Writing from 1/2019, the solution that produces proper HTML5 is to do the following.

1. Add a Custom Link with the URL set to #, and whatever name you'd like. Both fields are required.
2. Edit the newly added Custom Link so that the URL is empty.
3. Save the changes.

This will produce a top level nav that is <a>Menu</a> which is the correct way to represent a non-clickable link.

Puoi disabilitareglieventi sultag <a>pertutte le voci dimenu diprimo livello utilizzandoil csspuro.La classe .main-menupotrebbe avere un altronomein base alla denominazione delmenu.

 /* disable parent menu items */
ul.main-menu > li > a {
    pointer-events: none;
}
 

You may disable the events on the <a> tag for all first level menu items using pure css. .main-menu class may have another name according to your menu naming.

/* disable parent menu items */
ul.main-menu > li > a {
    pointer-events: none;
}

Crea unmenu di linkpersonalizzato come altri come detto.Visualizzail codice sorgentee cerca l'href del sottomenu,adesempio: #mm-1.Incollalonell'URL del linkpersonalizzatoe salvailmenu.Questofaràfunzionare anche la versionemobile quandotocchiiltesto delmenu.

Create a custom link menu as other as said. View the source code and look for the href of the submenu, for example: #mm-1. Paste this into the URL of the custom link and save the menu. This will make the mobile version work as well when you tap the menu text.

Lamia versione è simile a questa:

prima,nelmenunelpannello di amministrazionenel collegamento desideratonel campo hrefmetti # o lascialo vuoto,quindiin function.php vengono aggiuntitemi:

 function replace_empty_menu_links( $item_output, $item, $depth, $args ) {
  if ( $item->url == '#' || $item->url == '' ) {
    $item_output = sprintf( '%1$s<' . 'div' . '%2$s>%3$s%4$s%5$s</' . 'div' . '>%6$s',
      $args->before,
      $attributes,
      $args->link_before,
      apply_filters( 'the_title', $item->title, $item->ID ),
      $args->link_after,
      $args->after
    );
  }
  return $item_output;
}
add_filter( 'walker_nav_menu_start_el', 'replace_empty_menu_links', 10, 4 );
 

Puoi sostituire 'div' con qualsiasielemento adatto ate.

Funzionaper la versione 5.3.2 (testatain questa versione,ma dovrebbefunzionare anchein altre).

In questaforma,il lavoro dituttigli argomenti 'before','after','link_before','link_after',ecc. da wp_nav_menu() vienemantenuto.

Inoltre,funziona ancheperi sottomenu.

My version looks like this:

first, in the menu in the admin panel in the desired link in the href field put # or leave it empty, and then in function.php themes are added:

function replace_empty_menu_links( $item_output, $item, $depth, $args ) {
  if ( $item->url == '#' || $item->url == '' ) {
    $item_output = sprintf( '%1$s<' . 'div' . '%2$s>%3$s%4$s%5$s</' . 'div' . '>%6$s',
      $args->before,
      $attributes,
      $args->link_before,
      apply_filters( 'the_title', $item->title, $item->ID ),
      $args->link_after,
      $args->after
    );
  }
  return $item_output;
}
add_filter( 'walker_nav_menu_start_el', 'replace_empty_menu_links', 10, 4 );

You can replace 'div' with any element that suits you.

This works for version 5.3.2 (tested in this version, but should work in others too).

In this form, the work of all arguments 'before', 'after', 'link_before', 'link_after', etc. from wp_nav_menu() is preserved.

Also, this works for sub-menus too.

Una soluzionemoltopiù semplicepuòesseretrovata su un'altra domanda:

Menu amministratore:evidenziailmenu diprimo livello quando ci sitrovanellapagina di un sottomenu (senzamostrareil sottomenu)

Cerca la risposta di Askelon.Funzionaperfettamente,senzabisogno difarepreg_replaces ojquery.

Much easier solution can be found on another question:

Admin Menu - Highlight top-level menu when on a sub-menu page (without showing sub-menu)

Look for Askelon's answer. Work's perfectly, without needing to do any preg_replaces or jquery.