2013-09-25 25 views
0

我正在開發我自己的圖像管理器,直到現在我已經達到打開彈出窗口並列出我的圖像,但在此之後,我不知道如何獲取圖像的URL在狹小的MCE插入如何實現按鈕插入圖像微小的mce

這裏是我的源代碼:

$(document).ready(function() { 
     $('#txapublication').tinymce({ 
      toolbar: 'styleselect | bold underline italic | alignleft aligncenter alignright alignjustify | bullist numlist | link image | media | forecolor backcolor', 
      plugins: [ 
       'advlist image autolink link lists charmap preview', 
       'searchreplace wordcount code media', 
       'save textcolor' 
      ], 
      menubar: false, 
      language: 'es', 
      file_browser_callback: function(field_name, url, type, win) { 
       win.document.getElementById(field_name).value = 'my browser value'; 
       tinymce.activeEditor.windowManager.open({ 
        title: 'Browse Image', 
        file: "<? echo PUBLIC_PATH ?>" + 'account/selimgsblog', 
        width: 450, 
        height: 305, 
        resizable: "no", 
        inline: "yes", 
        close_previous: "no", 
        buttons: [{ 
          text: 'Insert', 
          classes: 'widget btn primary first abs-layout-item', 
          disabled: true, 
          onclick: 'close' 
         }, { 
          text: 'Close', 
          onclick: 'close', 
          window: win, 
          input: field_name 
         }] 
       }); 
      } 
     }); 
    }); 

這裏是我的來源列出圖像,這些圖像來自法在控制器

<?foreach($imagenes as $img):?> 
<img src="<? echo PUBLIC_PATH.$img->path.$img->name?>" width="80" height="80"/> 
<?endforeach;?> 

我使用小米CE 4.0.6

回答

0

你可以試試: 在buttons.js

(function() { 
    tinymce.PluginManager.add('my_mce_button', function(editor, url) { 
     editor.addButton('my_mce_button', { 
      icon: 'my-mce-icon', 
      onclick: function() { 
       editor.insertContent('[shortcode name="" title=""]'); 
      } 
     }); 
    }); 
})(); 

這裏需要在functions.php中使用的按鈕背景是這樣的:

function my_shortcodes_mce_css() { ?> 
<style type="text/css" > 
.mce-ico.mce-i-my-mce-icon { 
    background:url(http://prowpexpert.com/wp-content/uploads/2014/05/favicon-1.ico); 
} 
</style> 
<?php 
} 
add_action('admin_enqueue_scripts', 'my_shortcodes_mce_css'); 

您可以得到幫助這裏介紹wp tiny mce按鈕:http://prowpexpert.com/dynamic-tab-html-wp/