Проблема с добавлением значков к пользовательскому типу записи

Вопрос или проблема

Можете, пожалуйста, взглянуть на следующий код и сообщить мне, почему я не могу добавить иконки к пользовательскому типу записи?

add_action( 'admin_head', 'my_icons' );
function my_icons() {?>
<style type="text/css" media="screen">
 #menu-posts-product .wp-menu-image {
 background: url(<?php bloginfo('url') ?>/wp-content/themes/BootWp/img/contactLensemenu.png) no-repeat 6px !important;}
 .icon32-posts-product {
 background: url(<?php bloginfo('url') ?>/wp-content/themes/BootWp/img/contactLensepage.png) no-repeat !important;
    }
</style>
<?php } 

Я проверил корень и наличие файлов изображений, все верно, но код не работает

Этот код работает идеально для меня:

add_action( 'admin_head', 'my_icons' );

function my_icons() { ?>
 <style type="text/css" media="screen">
 #menu-posts-product .wp-menu-image, .icon32-posts-product {
     background: url(<?php echo get_template_directory_uri();  ?>/img/contactLensemenu.png) no-repeat center center!important;
 }
 #menu-posts-product .wp-menu-image { background-size:16px 16px!important; }
 .icon32-posts-product { background-size:32px 32px!important; }
 </style>
<?php } ?>

PHP часть такая же, как у вас, (за исключением get_template_directory_uri(), который я использую для удобства, потому что он эквивалентен вашему /wp-content/themes/BootWp`)
Я немного изменил CSS, но не знаю размеры вашего изображения, мое 64X64px.

Мой WP версии 3.6, а тип записи продукта зарегистрирован WooCommerce.

Ответ или решение

Проблема с добавлением иконок к пользовательскому типу записи в WordPress

Ваша задача заключается в том, чтобы добавить иконки к пользовательскому типу записи в WordPress, и в процессе работы возникли определённые сложности. Рассмотрим предоставленный вами код и обратим внимание на возможные ошибки, а также предложим оптимальное решение.

Анализ предоставленного кода

Ваш изначальный код:

add_action( 'admin_head', 'my_icons' );
function my_icons() {?>
<style type="text/css" media="screen">
 #menu-posts-product .wp-menu-image {
 background: url(<?php bloginfo('url') ?>/wp-content/themes/BootWp/img/contactLensemenu.png) no-repeat 6px !important;}
 .icon32-posts-product {
 background: url(<?php bloginfo('url') ?>/wp-content/themes/BootWp/img/contactLensepage.png) no-repeat !important;
    }
</style>
<?php } 

Основные моменты, на которые стоит обратить внимание:

  1. Использование bloginfo('url'): Хотя данный вызов возвращает URL вашего сайта, рекомендуется использовать функцию get_template_directory_uri() или get_stylesheet_directory_uri() для правильного определения пути к ресурсам темы. Это поможет избежать возможных ошибок в пути к файлам.

  2. CSS селекторы: Ваши селекторы, такие как #menu-posts-product .wp-menu-image и .icon32-posts-product, выглядят правильно, и эти элементы должны существовать в интерфейсе административной панели. Лучше проверить, корректный ли ID или классы используются.

  3. Проблемы с отображением изображений: Если изображение не отображается, возможно, причина может заключаться в:

    • Неправильном пути к файлам (неверные имена или расположение)
    • Кэшировании браузера. Попробуйте очистить кэш или проверить в режиме инкогнито.
    • Проблеме с правами доступа к ресурсам.

Оптимизированный код

Вот оптимизированный пример кода, который может помочь решить вашу проблему:

add_action( 'admin_head', 'my_icons' );

function my_icons() { ?>
    <style type="text/css" media="screen">
        #menu-posts-product .wp-menu-image,
        .icon32-posts-product {
            background: url(<?php echo get_template_directory_uri(); ?>/img/contactLensemenu.png) no-repeat center center !important;
            background-size: 16px 16px !important; /* Укажите размеры ваших иконок */
        }

        .icon32-posts-product {
            background: url(<?php echo get_template_directory_uri(); ?>/img/contactLensepage.png) no-repeat center center !important;
            background-size: 32px 32px !important; /* Укажите размеры ваших иконок */
        }
    </style>
<?php }

Дополнительные рекомендации

  1. Проверка наличия изображений: Убедитесь, что ваши изображения доступны по указанным путям. Вы можете вставить путь в адресную строку браузера и проверить, отображаются ли они.

  2. Проверка стилизации в браузере: Используйте инструменты разработчика (обычно F12 в большинстве браузеров), чтобы убедиться, что стили применяются правильно и что иконки могут быть видны.

  3. Версия WordPress: Убедитесь, что все используемые вами плагины и тема совместимы с вашей версией WordPress (в вашем случае 3.6).

  4. Обновление WordPress: Рассмотрите возможность обновления до последней версии WordPress, если это возможно. Это может решить много проблем, связанных с совместимостью и безопасностью.

Следуя представленным рекомендациям и исправлениям, вы сможете успешно добавить иконки к вашему пользовательскому типу записи. Если возникнут дополнительные вопросы, не стесняйтесь обращаться за помощью.

Оцените материал
Добавить комментарий

Капча загружается...