web-dev-qa-db-ja.com

Wp_nav_menu <a>タグのテキストをフックして編集する方法

wp_nav_menu liのアンカータグに表示されるテキストを変更しようとしています。

私は実際にはjQueryを使ってこれを実行することができました。ここで基本的なコードを見ることができます：

jQuery(document).ready(function () {

    jQuery('.menu-item-30 > a').html('<i class="fas fa-home"></i>');

});

それはうまくいきます、このコードは希望のナビゲーションメニューliのアンカータグを見つけて、ホームページのための小さな小さな家にアイコンを変更します。問題は、家をロードする前にページをロードしたときに、一番短い時間で、そのアンカータグに「home」の元のテキストが表示され、見栄えが悪くなることです。私が言おうとしているのは、ページがロードされてからこのコードが著しく実行されたということです。

したがって、私はこれがおそらくフィルタとフックが効くところであると考えました。しかし、私が理解していることから、jQueryをPHPでラップしてフィルタとして設定することはできません。たぶん私はjQueryの "ready"を他の何かに変更する必要があるかもしれません。

したがって、<a>と</a>の間のテキストを 'Home'から<i class="fas fa-home"></i>に変更し、同時にページの読み込み中に読み込みを行うことができます。

phpmenusfiltershooks
1
Ruke

そのような効果を得るための一つの方法はwp_nav_menu_objectsフックを使うことでしょう。

function modify_home_in_nav_menu_objects( $items, $args ) {
    foreach ( $items as $k => $object ) {
        // you can also target given page using this if:
        // if ( 'page' == $object->object && 2 == $object->object_id ) {
        if ( 30 == $object->ID ) {
            $object->title = '<i class="fas fa-home"></i>';
        }
    }
    return $items;
}
add_filter( 'wp_nav_menu_objects', 'modify_home_in_nav_menu_objects', 10, 2 );

PS。それは本当にfasであってfaではないはずですか？

0
Krzysiek Dróżdż