관리자 영역에서 Wordpress 위젯의 제목 표시 줄을 편집하는 방법은 없습니까?

Question

내가 만드는 모든 맞춤 위젯에서 모바일 위젯 및 데스크톱 위젯을위한 수단을 제공하고 있으므로 백엔드 위젯 영역의 제목에 위젯이 모바일/데스크톱인지를 나타내는 것이 좋습니다 이 섹션을 더욱 사용자에게 익숙하게 만드는 데 도움이됩니다.

위젯의 제목 표시 줄 (위젯 제목 왼쪽)에 이미지를로드하고 모바일/데스크톱 아이콘을 포함하여 활성화 된 위젯이 데스크톱인지 식별 ​​할 수 있도록하는 필터가 있습니까? 어떤 위젯이 모바일인지, 위젯을 열지 않아도 옵션을 볼 수 있습니까?

백엔드 관리자 widgets.php 페이지에서만 이것을 캡처하기 위해 wordpress 어딘가에 고리가 있습니까? 페이지가로드 될 때 PHP 훅을 사용하고 싶습니다. 옵션이 모바일에서 데스크톱으로 또는 그 반대로 변경 될 때 jQuery를 이미 사용하고 있습니다. 이 작업을 수행해야하는 위젯 페이지의 초기로드입니다.

가능합니까?

아래 예는 가능한 경우 초기 widgets.php 페이지에서 수행 할 수 있으며 확장 된 WP_Widgets 클래스 파일에서 쉽게로드 할 수 있습니까?

이

function __construct() { 

     parent::__construct(
      'social_media_widget', 
      __('Social Media Widget', 'mydomain') 
     ); 

     add_filter('dynamic_sidebar_params', array($this, 'my_sidebar_params'), 10, 1); 

    } 

    function my_sidebar_params($params) { 

     $sidebar_id = $params[0]['id']; 

     if (is_admin() && $params[0]['widget_name'] == 'Social Media Widget') 
     { 
      $_widget = get_option('widget_social_media_widget'); 

      if (!empty($_widget) && isset($_widget[$params[1]['number']])) 
      { 
       // $platform is being set in here as "desktop" because if I do a var_dump, it gives me "desktop", however, the image is not showing in the titlebar using before_title below... why? 
       $platform = isset($_widget[$params[1]['number']]['platform']) ? $_widget[$params[1]['number']]['platform'] : ''; 
      } 

      if (!empty($platform)) 
      { 
       $params[0]['before_title'] = '<img src="' . get_stylesheet_directory_uri() . '/img/' . $platform . '-icon.png" alt="' . $platform . ' menu" class="menu-icon ' . $platform . '-icon" />'; 
      } 
     } 
    return $params; 
} 

그래서, $ 플랫폼은 다음과 같습니다 또는 필터, 행동은 ...

그래서, 나는 WP_Widget를 확장 Widget 클래스 내부에 다음과 같이 다음을 수행하려고했습니다 등 이제는 올바른 값이지만 이미지가 관리자 위젯 영역의 제목 표시 줄에 제목 앞에 붙어 있지 않으므로 표시되지 않는 이유를 모르겠습니다 ... $params[0]['before_title'] 이미지가 표시되지만 표시되지는 않습니다. 바른 장소. 가능한 경우 위젯 제목의 <h3> 태그 내에 표시 할 이미지가 필요합니다. 어떤 아이디어? 당신은 WP 코드를 스누핑 경우

Answer 1

, 당신은 두 가지를 볼 수 있습니다 :

워드 프레스는 이미지가 제거지고 왜 제목에서 태그를 제거하는지

1. . 이것은 WP 코어 파일 "widgets.php"에서이다 :

   $widget_title = esc_html(strip_tags($sidebar_args['widget_name'])); 
   

2. 는 더 후크, 행동, 또는 필터가 없는지 당신이 그 (것)들을 조작 할 수 있도록.

그래서 창조적으로해야합니다.

한 가지 방법은 위젯의 ID를 활용하는 것입니다. WP 코드는 동일한 위젯을 여러 번 추가하더라도 고유하게 ID 코드를 관리하기 때문에 약간 까다 롭습니다. ,

인터페이스에 도시 된 제 "최근-의견"위젯의 ID가 widget-17_recent-comments-2입니다 :

는 자, 당신이 처리 할 수 ​​있습니다 방법의 예로서 "최근-의견"위젯을 보자 두 번째 "최근 댓글"위젯의 ID는 widget-9_recent-comments-3 등입니다. 아이디어를 얻을 수 있습니다.

recent-comments이라고하는 부분을 활용 해 봅시다.

이렇게하려면 "funner"CSS 선택기 인 contains 셀렉터를 사용해야합니다. 이 경우 [id*="_recent-comments-"]을 권하고 싶습니다. 을 _으로 시작하고 -으로 끝내십시오. 그러면 선택기의 일부를 포함 할 수있는 ID를 가진 다른 위젯에는 스타일이 적용되지 않습니다.

정보의 작은 조각으로

, 우리가 지금 배경으로 우리의 h3에 표시 할 이미지를 얻을 수 있습니다 :

div[id*="_recent-comments-"] h3 { 
    color: red; /* if you want to manipulate the title color */ 
    padding-left: 35px; /* to create some space for our image */ 
    /* obviously adjust this as needed */ 
    background: transparent url(http://placehold.it/20x20) 5px center no-repeat; 
    /* your other styles here ... */ 
}