Como adicionar um atributo de dados a um item de menu do WordPress


17

Sou o Twitter Bootstrap e preciso adicionar o atributo data-toggle = "modal" à tag a do link do menu. Ao pesquisar na maioria dos resultados de referência, caminhe pelos menus suspensos do Twitter Bootstrap, mas esse menu não possui menus suspensos e eu só preciso adicionar o atributo específico.

Em seguida, encontrei o seguinte: Adicione atributos personalizados aos itens de menu sem o plug-in, o que é muito útil, pois aparece no WordPress 3.6+. Não precisamos mais fazer andadores complexos e longos. Em vez disso, podemos usá-lo: http://codex.wordpress.org/Plugin_API / Filter_Reference / nav_menu_link_attributes

No entanto, a partir dessa execução, a referência da API é bastante simples e não oferece exemplos e, como é tão nova, existem muito poucas referências a ela no Google.

Eu tentei isso primeiro:

add_filter( 'nav_menu_link_attributes', 'mywp_contact_menu_atts', 10, 3 );

function pb_contact_menu_atts( $atts, $item, $args )
{
    // inspect $item, then …
    $atts['data-toggle'] = 'modal';
    return $atts;
}

e isso funciona, no entanto, conforme o esperado, adiciona o atributo a todas as tags a no menu. Então, eu estou tentando descobrir como direcionar um item de menu com # menu-item-7857 ou algo assim.

Alguém sabe onde encontrar um exemplo de segmentação para um item de menu ou é capaz de determinar como basear-se nas informações contidas na referência de API vinculada acima?

Para observar, encontrei o exemplo a seguir, mas ele segmenta apenas itens que têm filhos, o que não ajuda, mas pode estar na direção certa:

add_filter('nav_menu_link_attributes', function($atts, $item, $args) {
    if ( $args->has_children )
    {
        $atts['data-toggle'] = 'dropdown';
        $atts['class'] = 'dropdown-toggle';
    }

    return $atts;
}, 10, 3);

ATUALIZAÇÃO - A única resposta abaixo parece que está ligada a alguma coisa, mas não foi possível determinar como encontrar o número para direcionar meu link específico e onde / como adicionar essa condicional em um exemplo de trabalho. Adicionou um comentário, mas não recebeu resposta. Desde 18 dias, pensei em ver se uma recompensa ajudaria.

Quando olho para o código do link que quero segmentar:

<li id="menu-item-7858" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7858"><a href="#" data-toggle="modal">Chat</a></li>

Eu vejo o número 7858, então pensando que talvez esse seja o número que eu deveria ter como alvo.

Mas quando tento, por exemplo:

add_filter( 'nav_menu_link_attributes', 'my_chat_menu_atts', 10, 3 );


function my_chat_menu_atts( $atts, $item, $args ) {
    if ( 7857 == $item['ID'] ) {
        // inspect $item, then …
        $atts['onclick'] = 'SnapEngage.startLink();';
        return $atts;
    }
}

No entanto, adicionando que a declaração if, sugerida por um comentarista, recebo o seguinte erro:

Fatal error: Cannot use object of type WP_Post as array

Estou assumindo que mais código é necessário, mas perdido. Como um lembrete sem a instrução if, ele funciona, no entanto, tem como alvo todos os links, e não o link que eu quero segmentar.


Eu quero inserir <? Php the_id ();?> Na variável $ atts. Algo assim // inspecionar $ item if ($ item-> ID == $ menu_target) {$ atts ['data-toggle'] = 'modal - <? php the_id ();?>'; } retornar $ atts; Você pode me ajudar, como posso inserir the_id na variável $ atts. Graças
nadzhq

Respostas:


36

Editando especificamente o código que você forneceu na pergunta original:

add_filter( 'nav_menu_link_attributes', 'wpse121123_contact_menu_atts', 10, 3 );
function wpse121123_contact_menu_atts( $atts, $item, $args )
{
  // The ID of the target menu item
  $menu_target = 123;

  // inspect $item
  if ($item->ID == $menu_target) {
    $atts['data-toggle'] = 'modal';
  }
  return $atts;
}

Depois troquei alguns dos meus próprios valores que o fizeram! Obrigado! Marcado como correto, mas diz que preciso esperar mais 23 horas para poder conceder a recompensa.
22613 cchiera

Feliz por ajudar! : D
Jen

Coloquei um lembrete no Fantastical para não esquecer de conceder a recompensa amanhã.
22413 cchiera

E se você tiver vários itens de menu como destino?
Eric Mitjans

basta usar a instrução if múltipla se o valor de alternância de dados for diferente. Ou você pode salvar o ID na chave da matriz (considerando que são exclusivos) e o nome modal como valor da matriz. Em seguida, verifique se a declaração comarray_key_exists()
Sisir

8

O segundo $itemargumento, que está sendo disponibilizado para a função de filtro, contém um objeto de item de menu. Se despejado, é algo como isto:

[1] => WP_Post Object
    (
        [ID] => 2220
        [post_author] => 1
        [post_date] => 2012-12-26 19:29:44
        [post_date_gmt] => 2012-12-26 17:29:44
        [post_content] => 
        [post_title] => Home
        [post_excerpt] => 
        [post_status] => publish
        [comment_status] => open
        [ping_status] => open
        [post_password] => 
        [post_name] => home-3
        [to_ping] => 
        [pinged] => 
        [post_modified] => 2013-06-05 01:55:20
        [post_modified_gmt] => 2013-06-04 22:55:20
        [post_content_filtered] => 
        [post_parent] => 0
        [guid] => http://dev.rarst.net/?p=2220
        [menu_order] => 1
        [post_type] => nav_menu_item
        [post_mime_type] => 
        [comment_count] => 0
        [filter] => raw
        [db_id] => 2220
        [menu_item_parent] => 0
        [object_id] => 2220
        [object] => custom
        [type] => custom
        [type_label] => Custom
        [title] => Home
        [url] => http://dev.rarst.net/
        [target] => 
        [attr_title] => 
        [description] => 
        [classes] => Array
            (
                [0] => 
                [1] => menu-item
                [2] => menu-item-type-custom
                [3] => menu-item-object-custom
                [4] => current-menu-item
                [5] => current_page_item
                [6] => menu-item-home
            )

        [xfn] => 
        [current] => 1
        [current_item_ancestor] => 
        [current_item_parent] => 
    )

Para segmentar um item de menu específico, é necessário formular sua condição e compará-la com os dados disponíveis no objeto, por exemplo if ( 2220 == $item['ID'] )


Obrigado por isso! No entanto, não sei ao certo como obter o ID do item $ para o meu item de menu específico. No seu exemplo, o 2220 também é igual ao seu URL " dev.rarst.net/?p=2220 ". Meu link no qual quero adicionar o atributo de dados não vai para outro URL do wordpress, mas é href = "# ContactForm". Com base no seu exemplo acima, pesquisei mais no Google e tentei executar echo var_export ($ GLOBALS ['post'], TRUE); mas quando olho para o item de menu inicial, não vejo nenhum ID exclusivo. Você pode esclarecer? Ou em "if (2220 == $ item ['ID'])" Agradecemos antecipadamente!
cchiera

2
O erro que você está vendo é porque $itemé um objeto, não uma matriz; mudar o $item['ID']que $item->ID.
21413 Jen

1

Por que você não aborda esse problema de uma direção diferente? Em vez de tentar segmentar o item de menu com id == ?? que pode mudar em algum momento (o item de menu, não o ID), use a área Admin do WP para adicionar uma classe personalizada ao item de menu que você deseja segmentar. Em seguida, use essa classe no seu Javascript para acionar as informações necessárias:

$('.my-class').click(function(e){
  // do other stuff
  e.preventDefault;
});

Meu javascript não é garantido. Se você não estiver usando o jQuery, tente isso .


1

Eu queria adicionar letras de dados ao menu personalizado que havia criado no WordPress.

Os passos que eu escolhi foram:

  1. Encontrei o número de identificação do meu menu.
  2. adicionou essas linhas de código de @guiniveretoo
  3. escreveu instruções if para cada item de menu (como eu queria que valores diferentes de atributos fossem injetados.)
  4. trabalhou!

Aqui está o meu código.

add_filter( 'nav_menu_link_attributes', 'wpse121123_contact_menu_atts', 10, 3 );
function wpse121123_contact_menu_atts( $atts, $item, $args )
{  
  $menu_target = 6;

  if ($item->ID == $menu_target) {
    $atts['data-letters'] = 'PROJECTS';
  }

  elseif ($item->ID == 7) {
    $atts['data-letters'] = 'RESUME';
  }
  elseif ($item->ID == 8) {
    $atts['data-letters'] = 'ARTWORKS';
  }
  elseif ($item->ID == 9) {
    $atts['data-letters'] = 'HELLO!';
  }
  return $atts;
}

Espero que isso ajude você.

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.