Wordpress 3.5 Media Manager'a bir menü öğesi ekleyin


34

Yeni Wordpress 3.5 Media Manager'da sol kenar çubuğundaki "URL'den ekle" nin altına yeni bir menü maddesi nasıl ekleyebilirim?

Omurga js'lerine baktım ve kendi JS'mle ama başaramadan kendime takmaya çalışıyorum.

Düzenleme 2: Bu hile yapmak gibi görünüyor:

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

Basit şeyler için yapmalı, ama aynı şeyi Javascript'te de yapmak mümkün. Yeni medya yöneticisinin kurumunun nasıl çalıştığı hakkında bir öğretici / açıklama olsaydı iyi olurdu.


yeni menünüz ne yapmalı? Bir menü öğesi eklemek ana sorun değildir ve doğru yoldasınız, ancak menünüzün varsayılan görünümlerden farklı bir şey göstermesi gerekiyorsa, yalnızca değiştirilen ayarlarla, Omurga'nın menü öğeniz için bir görünüme ihtiyacı var ... o da
sıkışıp kaldığım yer

menü öğesine tıklandığında farklı bir görünüm gösterilmesi gerekiyor. Menü öğesinin gösterilmesi ilk adım olabilir
erezie

1
150 puan sınırlamamla ilgili olarak: Orijinal posterin, "URL'den ekle" nin altına yeni bir Durum menüsü öğesi eklemek için JS tabanlı bir yöntem kullanmak ve Post Editörünün birincil medya modelinde yeni bir görünüm ilişkilendirmek için orijinal posterin amacına devam etmek istiyoruz.
Scott Kingsley Clark

@erezie, buradaki cevabı Fabien Quatravaux tarafından verilen cevap olarak işaretleyebilir misiniz?
Scott Kingsley Clark

Yanıtlar:


19

Tamam, sanırım bir cevaba çok yakın bir şeyim var:

Kodumu bir yere koydum

İşte sonuç: özel menü ekran görüntüsü

MVC modeline saygı göstermek için birkaç Omurga nesnesi yaptım: controller.Customtüm mantığı yapmaktan, view.Toolbar.Customaraç çubuğu düğmeleriyle view.Customuğraşmaktan ve iç kullanıcı arayüzünü görüntülemekle sorumlu .


2
Şimdiye kadar ne eksik?
kaiser

+1 iyi başlangıç! Ancak, evet, ne yaptığını bilmek için bunu uygulamak zorunda kalmamız yerine, anlık bir görüntü çok kullanışlı olacaktır . Ayrıca, bu yorum satırını Yanıtın //build an empty view (needs more work)içeriğine çekin .
brasofilo

Sonucu göstermek için bir ekran görüntüsü ekledim. Şimdi yapılacak bir sonraki şey, HTML bileşenlerini görüntüleyecek ve kullanıcı etkileşimine tepki verecek görünümün kendisini uygulamaktır.
Fabien Quatravaux

Bu harika görünüyor, kesinlikle bir başlangıç! Ödül kazanmaya değer, ancak ihtiyacı hissederseniz bir sonraki seviyeye almakta çekinmeyin.
Scott Kingsley Clark

Ödül Scott için teşekkürler! Kesinlikle biraz daha derine ineceğim çünkü işteki bir proje için buna ihtiyacım var. Kullanılabilir olur olmaz kodumu buraya geri göndereceğim.
Fabien Quatravaux,

10

"Yönlendirici menüsüne" ("Medya Kitaplığı" ndan doğru bir şey ekleyerek) bir düğme eklemeye çalışıyorum, ancak sistem aynı.

<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>

Şimdi, henüz bir şey yapmıyor. Bu bir sonraki adım!


2
Şansın var mı? JS tabanlı bir çözüm gerçekten görmek istediğim şey, orijinal posterin düzenlemesinde daha önce belirtilen iframe PHP çözümü değil, başka bir cevabı
Scott Kingsley Clark

7

media_upload_tabsSekmeyi eklemek için filtreye takabilirsiniz . Ağ Paylaşımlı Medya eklentisi tarafından kullanılan yöntem :

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' );

Daha sonra sekme içeriğini görüntülemek için media_upload_tab_slugeyleme bağlanabilirsiniz ( tab_slugyukarıda kullanıldığı gibi):

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

2
Bu, sekme eklemenin eski yoludur. Hala çalışıyor olmasına rağmen, WP'nin bundan uzaklaştığından şüpheleniyorum.
Jenny,

2
@ Jenny, bu filtreye güvenebileceğimizi düşünüyorum . İlgili bilet . (: oh, ve +1, güzel snipett :)
brasofilo

3

Bir çözümüm yok ama ipuçları var. Dizeler bir diziden elde edilir. Kanca ile filtre edebilirsiniz media_view_strings. Tıklamadan sonraki modal kutusu bir javascript, WP 3.5'ten beri backbone.js ile oluşturuldu. /wp-includes/js/media-views.jsBir çözüm için bakın . Omurga da benim için yeni ve senaryoların birçok kaynak satırı var.


Bu çok hoş bir ipucuydu, ama bence kısa düşüyor. media.view.settingsJs var yeni sekme eklemek için bir php filtre tarafından büküverilmiş edilebilir, ancak daha sonra bu tırnaklar, iç çerçeve ile işlenir (bakınız createIframeStatesyöntemi media-views.js).
Fabien Quatravaux

Belki bir öğretici ekleyebilir, blog görünümünüze basit bir bağlantı ekleyebilir ve bu bağlantıyı tıklatarak özel bir işlem ekleyebilirsin? Şu anki özün çok karmaşık ve çok fazla özel eylem var.
bueltge,

Ne yazık ki, bunu başarmanın daha basit bir yolunu bulamadım. Bu kod yalnızca bir temel şey yapıyor: Sol tarafta, kendi içerik görünümü, araç çubuğu ve denetleyicisi ile özel bir menü öğesi ekleyin. Bütün bu yapı, Omurga tarafından ihtiyaç duyulan görüntü ve denetleyiciyi oluşturmak için gereklidir. Ancak, daha basit bir çözüm varsa, yumruklarımı doldurmakta özgürsünüz.
Fabien Quatravaux

Evet, bunu gördüm ve ayrıca test ettik, iyi çalışıyor. Ama bence güzeldi, ayrıca sadece bir düğme ya da bağlantı ve varsayılan medya ekranının içinde bir geri arama funktion için ek bir parça için değil, örneğin ne için bir fikir yarattığınızı düşünüyorum.
bueltge,
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.