Intereting Posts
Настройка игровой площадки WordPress и развертывание на рабочем сервере? Получить идентификатор текущей категории из текстовой страницы WordPress WordPress Payment gateway добавляет форму, как добавить форму в список или как отправить форму на следующий шаг для оплаты Какие действия влияют на файлы, DB или оба? Как добавить несколько css или js-файлов в мой плагин Как я могу динамически генерировать изображение со статическим URL изображения? Разная настройка posts_per_page для первого и остальных страниц? Изображение не отображается в переопределенном адресе woocommerce WordPress sharding: какой мульти-DB-плагин использовать? Скрипт Enqueue: ссылка не работает в источнике страницы get_category_link () ничего не возвращает Получить имя таксономии текущей страницы Как отредактировать цвет шрифта H1 на одной странице? Как отключить самозакрывающиеся теги для разметки в WordPress (например, для HTML5 или HTML4)? Включить изменения для настраиваемого типа сообщений

Как добавить значок в новый элемент панели управления?

У меня есть функция, которая добавляет элементы в панель инструментов WordPress. Например:

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

Как получить значок слева от этого нового элемента?

Я пытался использовать «мета», но значок не отображается.

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

Я прочитал ссылку на добавление изображения в «заголовок», но я хотел бы, чтобы этот значок был как пузырь комментариев.

Solutions Collecting From Web of "Как добавить значок в новый элемент панели управления?"

Полный пример

Быстрый (mu-) плагин в качестве примера:

 <?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, ), ) ); } ); 

Что делает следующий HTML в качестве первого элемента (и, следовательно, также делает наш админ-бар бесполезным, но это не относится к этому примеру):

 <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> 

Теперь, когда у нас есть база, мы можем заботиться о …

Добавление иконок

Печальная новость: нет простого способа сделать это. По крайней мере, не добавляя свою собственную таблицу стилей. Как вы можете прочитать (в коде), есть некоторые вещи: я добавил HTML-код, необходимый для переноса Dashicon до фактического элемента. Затем я добавил очень большое целое число как последнее число в действие – вот что определяет позицию элемента в панели администратора.

 <?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 */ ); } 

Наконец, вам нужно будет добавить некоторые правила CSS в свою собственную таблицу стилей. Единственной движущейся частью является wpse в #/id . Остальное является постоянным и равным для всех пунктов / узлов панели администратора. Вам также может потребоваться настроить top положение, чтобы оно соответствовало Dashicon. Просто выберите Dashicon со своего сайта и добавьте код fXXX в CSS ниже.

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

чтобы расширить ответ на вопрос кайзера, вы также можете переопределить значок с помощью настраиваемого URL-адреса изображения и поместить стили в строку (или снова отдельно, если хотите), например. значок 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' ), 

затем используйте для значения заголовка:

 'title' => $iconspan.$title,