Wordpress 3.5 Media Managerにメニュー項目を追加します


34

新しいWordpress 3.5 Media Managerの左側のサイドバーの「URLから挿入」の下に新しいメニュー項目を追加するにはどうすればよいですか?

私はバックボーンjsを見て、自分のJSでそれをフックしようとしましたが、成功しませんでした。

編集2:これはトリックを行うようです:

http://sumtips.com/2012/12/add-remove-tab-wordpress-3-5-media-upload-page.html

それは単純なものに対して行うべきですが、Javascriptで同じことを行うことも可能だと思います。新しいメディアマネージャーの内部がどのように機能するかについてのチュートリアル/説明があればいいでしょう。


あなたの新しいメニューは何をすることになっていますか?メニュー項目を追加することは主な問題ではなく、あなたは正しい道を歩んでいますが、メニューがデフォルトのビューと異なるものを表示することになっている場合、設定を変更するだけで、Backboneにはメニュー項目のビューが必要です...私も同様にstuckedだthatsの...
ungestaltbar

メニュー項目をクリックすると、別のビューが表示されます。表示するメニュー項目を取得する最初のステップになります
erezie

1
私の150点のバニーについて:JSベースの方法を使用して「URLから挿入」の下に新しい状態メニュー項目を追加し、ポストエディタのプライマリメディアモーダルに新しいビューを関連付けるという元のポスターの目的を継続したいと考えています。
スコットキングスリークラーク

@erezie、これについての答えをファビアン・クアトラヴォーが提供したものとしてマークできますか?
スコットキングスリークラーク

回答:


19

OK、私は本当に答えに近いものがあると思います:

コードを要約します

結果は次のとおりです。 カスタムメニューのスクリーンショット

MVCパターンを尊重するために、いくつかのBackboneオブジェクトを作成controller.Customしました。すべてのロジック、view.Toolbar.Customツールバーボタンの処理view.Custom、内部UIの表示を担当しています。


2
これまでのところ何が欠けていますか?
カイザー

+1良いスタート!しかし、はい、それが何であるかを知るためにこれを実装する必要がある代わりに、スナップショットは非常に便利です。また、そのコメント行を//build an empty view (needs more work)回答の内容に追加します。
ブラソフィロ

結果を示すスクリーンショットを追加しました。次にやるべきことは、HTMLコンポーネントを表示し、ユーザーの操作に反応するビュー自体を実装することです。
ファビアンクアトラヴォー

これはクールに見えますが、それは間違いなく始まりです!報奨金の価値はありますが、必要に応じて次のレベルに進んでください。
スコットキングスリークラーク

報奨金のスコットをありがとう!仕事中のプロジェクトに必要なので、もう少し掘り下げます。コードが使用可能になり次第、ここにコードを投稿します。
ファビアンクアトラヴォー

10

「ルーターメニュー」にボタンを追加する作業(「メディアライブラリ」の右に何かを追加する)を行っていますが、システムは同じです。

<script type="text/javascript">
    jQuery(window).on('load', function() {
        var media   = window.wp.media,  
        Attachment  = media.model.Attachment,
        Attachments = media.model.Attachments,
        Query       = media.model.Query,
        l10n = media.view.l10n = typeof _wpMediaViewsL10n === 'undefined' ? {} : _wpMediaViewsL10n,
        NewMenuItem;

        jQuery(document).on( 'click', '.insert-media', function( event ) {
            var workflow = wp.media.editor.get();
            var options = workflow.options;
            if( undefined == NewMenuItem ) {
                NewMenuItem = new wp.media.view.RouterItem( _.extend( options, { text: 'New Item!' } ) );
                workflow.menu.view.views.set( '.media-menu', NewMenuItem, _.extend( options, { add: true } ) );
            }

        });
    });
</script>

現在、まだ何もしていません。それが次のステップです!


2
これで運がありますか?A JSベースのソリューションは、すでに元のポスターの編集、別の答えに記載のiframe PHPソリューション、私が実際に見てみたいと思いますではありません
スコットキングスレークラーク

7

media_upload_tabsフィルターにフックしてタブを追加できます。これは、ネットワーク共有メディアプラグインで使用される方法です。

function wpse_76980_add_upload_tab( $tabs ) {
    $newtab = array( 'tab_slug' => 'Tab Name' );
    return array_merge( $tabs, $newtab );
}
add_filter( 'media_upload_tabs', 'wpse_76980_add_upload_tab' );

次に、media_upload_tab_slugアクション(tab_slug上記で使用したもの)にフックして、タブの内容を表示できます。

function wpse_76980_media_upload() {
    // display tab contents
}
add_action( 'media_upload_tab_slug', 'wpse_76980_media_upload' );

2
これは、タブを追加する古い方法です。まだ機能していますが、WPがそこから遠ざかっていると思います。
ジェニー

2
@Jennyは、私たちは考えてカウントすることができる。このフィルタ上。関連チケット。(:ああ、+ 1、素敵なスニペット:)
ブラソフィロ

3

解決策はありませんが、ヒントがあります。文字列は配列から取得します。hookでフィルタリングできますmedia_view_strings。クリック後のモーダルボックスはjavascriptであり、WP 3.5以降、backbone.jsでビルドされます。/wp-includes/js/media-views.jsソリューションをご覧ください。Backboneは私にとっても新しく、スクリプトには多くのソース行があります。


これは非常に良いヒントでしたが、それでは不十分だと思います。media.view.settingsJS VARは、新しいタブを追加するために、PHPフィルタによって微調整することができるが、それらのタブはIFRAME(参照を介してレンダリングされcreateIframeStatesた方法をmedia-views.js)。
ファビアンクアトラヴォー

たぶん、チュートリアルを追加し、ブログooに要旨を追加して、メディアビュー内に簡単なリンクを追加し、このリンクをクリックするとカスタムアクションを追加できますか?現在の要点は非常に複雑で、多くのカスタムアクションがあります。
-bueltge

残念ながら、これを達成するための別の簡単な方法は見つかりませんでした。このコードは基本的なことを1つだけ実行します。左側にカスタムメニュー項目を追加し、独自のコンテンツビュー、ツールバー、コントローラーを追加します。Backboneに必要なビューとコントローラーを構築するには、このすべての構築が必要です。しかし、よりシンプルなソリューションをお持ちの場合は、お気軽に要点をお伝えください。
ファビアンクアトラヴォー

はい、私はこれを見て、それをテストし、正常に動作します。しかし、例のように、追加の部分ではなく、デフォルトのメディア画面内にボタンまたはリンクのみの要点とコールバック機能を作成することは素晴らしいと思います。
bueltge
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.