Come faccio ad aggiungere un'icona a un nuovo elemento della barra di amministrazione?

Ho una funzione che aggiunge elementi alla barra degli strumenti di WordPress. Per esempio:

$args2 = array(
    'id'    => 'conversations_unread',
    'title' => $visitor['conversations_unread'] . ' &nbsp ',
    'href'  => XenForo_Application::get('options')->boardUrl . '/conversations'
);

Come posso ottenere un'icona a sinistra di questo nuovo elemento?

Ho provato a usare il "meta" ma l'icona non viene visualizzata.

'meta' => array( 'class' => 'ib-icon' ),

Ho letto un riferimento all'aggiunta dell'immagine al "titolo", ma vorrei che questa icona fosse come la bolla dei commenti.

Esempio completo

Un rapido plugin (mu-) come esempio:

<?php
/** Plugin Name: Add Admin Bar Icon */
add_action( 'admin_bar_menu', function( \WP_Admin_Bar $bar )
{
    $bar->add_menu( array(
        'id'     => 'wpse',
        'parent' => null,
        'group'  => null,
        'title'  => __( 'Example', 'some-textdomain' ),
        'href'   => get_edit_profile_url( get_current_user_id() ),
        'meta'   => array(
            'target'   => '_self',
            'title'    => __( 'Hello', 'some-textdomain' ),
            'html'     => '<p>Hello</p>',
            'class'    => 'wpse--item',
            'rel'      => 'friend',
            'onclick'  => "alert('Hello');",
            'tabindex' => PHP_INT_MAX,
        ),
    ) );
} );

Il che rende il seguente HTML come primo elemento (e quindi rende anche inutile la nostra barra di amministrazione, ma non è questo il punto di questo esempio):

<li id="wp-admin-bar-wpse" class="wpse--item">
    <a class="ab-item" tabindex="9223372036854775807" href="http://astro.dev/wp-admin/profile.php" onclick="alert(\'Hello\');" target="_self" title="Hello" rel="friend">Example</a>
    <p>Hello</p>
</li>

Ora che abbiamo una base, possiamo preoccuparci di ...

Aggiunta di icone

La triste notizia: non esiste un modo semplice per farlo. Almeno non senza aggiungere il tuo foglio di stile. Come puoi leggere (nel codice), stanno accadendo alcune cose: ho anteposto l'HTML necessario per avvolgere un Dashicon prima dell'oggetto reale. Quindi ho aggiunto un numero intero molto alto come ultimo numero all'azione: questo è ciò che decide la posizione dell'elemento nella barra di amministrazione.

<?php
/** Plugin Name: Add Admin Bar Icon */
add_action( 'admin_bar_menu', function( \WP_Admin_Bar $bar )
{
    $bar->add_menu( array(
        'id'     => 'wpse',
        'title'  => '<span class="ab-icon"></span>'.__( 'Example', 'some-textdomain' ),
        'href'   => get_edit_profile_url( get_current_user_id() ),
        'meta'   => array(
            'target'   => '_self',
            'title'    => __( 'Ahoi!', 'some-textdomain' ),
            'html'     => '<!-- Custom HTML that goes below the item -->',
        ),
    ) );
}, 210 ); // <-- THIS INTEGER DECIDES WHERE THE ITEM GETS ADDED (Low = left, High = right)

add_action( 'wp_enqueue_scripts', function()
{
    wp_enqueue_style( /* register your stylesheet */ );
}

Alla fine dovrai aggiungere alcune regole CSS nel tuo foglio di stile. L'unica parte in movimento è la wpsein #/id. Il resto è costante ed uguale per tutti gli elementi / nodi della barra di amministrazione. Potrebbe anche essere necessario regolare la topposizione per adattarsi al Dashicon. Basta scegliere un Dashicon dal loro sito e aggiungere il fXXXcodice nel CSS qui sotto.

#wpadminbar #wp-admin-bar-wpse .ab-icon:before {
    content: '\f306';
    top: 3px;
}

per espandere la risposta di Kaiser, puoi anche sovrascrivere l'icona con un URL di immagine personalizzato e mettere gli stili in linea (o di nuovo separatamente se vuoi) ad es. un'icona 22px x 22px ...

$iconurl = '/images/custom-icon.png';

$iconspan = '<span class="custom-icon" style="
    float:left; width:22px !important; height:22px !important;
    margin-left: 5px !important; margin-top: 5px !important;
    background-image:url(\''.$iconurl.'\');"></span>';

$title = __( 'Example', 'some-textdomain' ),

quindi utilizzare per il valore del titolo:

'title' => $iconspan.$title,