관리화면 서브메뉴 항목에 커스텀 HTML 클래스 이름을 추가하는 방법

관리화면 서브메뉴 항목에 커스텀 HTML 클래스 이름을 추가하는 방법

[ Posts ]메뉴의 서브메뉴 항목을 다음에 나타냅니다.

코드를 확인해보니 마크업이 이것입니다.

<ul class="wp-submenu wp-submenu-wrap">
  <li class="wp-submenu-head" aria-hidden="true">Posts</li>
  <li class="wp-first-item current"><a href="edit.php" class="wp-first-item current">All Posts</a></li>
  <li><a href="post-new.php">Add New</a></li>
  <li><a href="edit-tags.php?taxonomy=category">Categories</a></li>
  <li><a href="edit-tags.php?taxonomy=post_tag">Tags</a></li>
</ul>

커스텀 클래스를 추가하고 싶다.my-custom-class에서<li>태그(서버 측에 있는 태그)는 다음과 같이 됩니다.

<ul class="wp-submenu wp-submenu-wrap">
  <li class="wp-submenu-head" aria-hidden="true">Posts</li>
  <li class="wp-first-item current my-custom-class"><a href="edit.php" class="wp-first-item current">All Posts</a></li>
  <li class="my-custom-class"><a href="post-new.php">Add New</a></li>
  <li class="my-custom-class"><a href="edit-tags.php?taxonomy=category">Categories</a></li>
  <li class="my-custom-class"><a href="edit-tags.php?taxonomy=post_tag">Tags</a></li>
</ul>

관리화면 서브메뉴 항목에 커스텀 HTML 클래스명을 추가하는 방법이 있나요?

페이지가 로드되기 전에 html에서 str_replace를 수행할 수 있습니다.

셀렉터를 계산하거나 DOMDocument를 사용하여 해석하기만 하면 됩니다.

function callback($buffer) {

    $buffer = str_replace('wp-first-item', 'wp-first-item my-custom-class', $buffer);

    return $buffer;
}

function buffer_start() { ob_start("callback"); }

function buffer_end() { ob_end_flush(); }

add_action('admin_head', 'buffer_start');
add_action('admin_footer', 'buffer_end');

다음과 같은 간단한 플러그인으로 실제로 실행할 수 있습니다.

<?php
/** Plugin Name: Custom Admin Submenu CSS Class **/

add_action( 'admin_menu', function() use ( &$submenu )
{
    $class = 'my-class'; // Edit to your needs!

    if( ! isset( $submenu['edit.php'][5] ) )
        return;

    if( ! empty( $submenu['edit.php'][5][4] ) ) // Append if css class exists
        $submenu['edit.php'][5][4] .= ' ' . $class;
    else                                      
        $submenu['edit.php'][5][4] = $class;

} );

이 부분을 찾아내서 이렇게 만들었습니다._wp_menu_output()핵심 기능:

if ( ! empty( $sub_item[4] ) ) {
    $class[] = esc_attr( $sub_item[4] );
}

변경된 HTML의 모양은 다음과 같습니다.

<ul class='wp-submenu wp-submenu-wrap'>
    <li class='wp-submenu-head' aria-hidden='true'>Posts</li>
    <li class="wp-first-item current my-class">
        <a href='edit.php' class="wp-first-item current my-class">All Posts</a>
    </li>
    <li>
        <a href='post-new.php'>Add New</a>
    </li>
    <li>
        <a href='edit-tags.php?taxonomy=category'>Categories</a>
    </li>
    <li>
        <a href='edit-tags.php?taxonomy=post_tag'>Tags</a>
    </li>
</ul>

여기서 커스텀 css 클래스는 양쪽의 CSS에 추가됩니다.<li>태그와<a>태그를 붙입니다.

일반적으로 글로벌 변수를 수정하는 것은 좋아하지 않지만, 클래스를 서브메뉴에 추가하는 회피책은 없는 것 같습니다.

첫 번째 수준 항목(메뉴)의 css 클래스를 수정하려는 경우 예를 들어 필터를 살펴볼 수 있습니다.

서브메뉴의 css 클래스가 필터를 통해 직접 조정되어야 한다고 강하게 생각하는 경우 trac 티켓을 작성할 수 있습니다.이것이 필요한 이유를 상세하게 설명하고 새로운 것을 제안합니다.add_submenu_classes필터링을 실시합니다.

도움이 됐으면 좋겠네요!

이것으로 충분합니다.

function add_admin_class() {
    $find = '.wp-submenu li';
    $add_class = 'my-custom-class';

    echo '"<script type="text/javascript">
        jQuery(function() {
            jQuery("' . $find . '").addClass("' . $add_class . '");
        });
    </script>"';
}
add_action('admin_footer', 'add_admin_class');

나는 이것을 조사했다.코어 파일을 해킹하지 않으면 관리 메뉴 항목에 css-classes를 추가할 수 없습니다.

새 서브메뉴 항목을 추가하려면 delete_submenu_page() 및 add_submenu_page()를 사용할 수 있지만 css 클래스를 지정할 수는 없습니다.

다음을 시도해 보십시오.

이건 나한테 효과가 있었어.

add_action('admin_init','add_custom_class_adminMenu');
function add_custom_class_adminMenu() 
{
    global $menu;
    foreach($menu as $key => $value)
    {
        if('Posts' == $value[0])
        {
            $menu[$key][4] .= " custom-class-1";
        }

        if('Pages' == $value[0])
        {
            $menu[$key][4] .= " custom-class-2";
        }            
    }
}

언급URL : https://stackoverflow.com/questions/43454330/how-to-add-a-custom-html-class-name-to-admin-screen-submenu-items