워드 프레스 게시물에 플러그인 아이콘을 만드는 방법은 무엇입니까? 플러그인 코드에 삽입하려는 코드는 포스트 바 [wp-admin / post.php]에 나타납니다.

이 이미지처럼 :

출력 : 아이콘을 클릭하면 다음 [plugin]과 같이 게시물 내용에 자동으로 씁니다 .

TinyMCE 편집기에 버튼을 추가하려면 몇 가지 작업을 수행해야합니다.

1. 툴바에 버튼 추가
2. TinyMCE 플러그인 등록
3. TinyMCE에 버튼을 클릭했을 때 수행 할 작업을 알려주는 TinyMCE 플러그인을 만듭니다.

1 단계와 2 단계

이 단계에서 우리는 자바 스크립트 파일 안에있는 TinyMCE 플러그인을 등록합니다 'path/to/shortcode.js'( wpse72394_register_tinymce_plugin()아래 참조).

 // init process for registering our button
 add_action('init', 'wpse72394_shortcode_button_init');
 function wpse72394_shortcode_button_init() {

      //Abort early if the user will never see TinyMCE
      if ( ! current_user_can('edit_posts') && ! current_user_can('edit_pages') && get_user_option('rich_editing') == 'true')
           return;

      //Add a callback to regiser our tinymce plugin   
      add_filter("mce_external_plugins", "wpse72394_register_tinymce_plugin"); 

      // Add a callback to add our button to the TinyMCE toolbar
      add_filter('mce_buttons', 'wpse72394_add_tinymce_button');
}


//This callback registers our plug-in
function wpse72394_register_tinymce_plugin($plugin_array) {
    $plugin_array['wpse72394_button'] = 'path/to/shortcode.js';
    return $plugin_array;
}

//This callback adds our button to the toolbar
function wpse72394_add_tinymce_button($buttons) {
            //Add the button ID to the $button array
    $buttons[] = "wpse72394_button";
    return $buttons;
}

3 단계

이제 TinyMCE 플러그인을 만들어야합니다. 'path/to/shortcode.js'초기 단계에서 지정한대로 파일로 이동 합니다.

jQuery(document).ready(function($) {

    tinymce.create('tinymce.plugins.wpse72394_plugin', {
        init : function(ed, url) {
                // Register command for when button is clicked
                ed.addCommand('wpse72394_insert_shortcode', function() {
                    selected = tinyMCE.activeEditor.selection.getContent();

                    if( selected ){
                        //If text is selected when button is clicked
                        //Wrap shortcode around it.
                        content =  '[shortcode]'+selected+'[/shortcode]';
                    }else{
                        content =  '[shortcode]';
                    }

                    tinymce.execCommand('mceInsertContent', false, content);
                });

            // Register buttons - trigger above command when clicked
            ed.addButton('wpse72394_button', {title : 'Insert shortcode', cmd : 'wpse72394_insert_shortcode', image: url + '/path/to/image.png' });
        },   
    });

    // Register our TinyMCE plugin
    // first parameter is the button ID1
    // second parameter must match the first parameter of the tinymce.create() function above
    tinymce.PluginManager.add('wpse72394_button', tinymce.plugins.wpse72394_plugin);
});

여기에 전체 답변을 넣을 것이 너무 많아서이 안내서를 확인하십시오 : http://wp.smashingmagazine.com/2012/05/01/wordpress-shortcodes-complete-guide/

TinyMCE 버튼을 편집기에 삽입하는 WordPress를 통해 등록한 버튼에서 조치를 취하는 Javascript 파일을 작성해야합니다.