Ajouter un élément de menu à Wordpress 3.5 Media Manager

34

Comment ajouter un nouvel élément de menu sous "insérer à partir de l'URL" dans la barre latérale gauche du nouveau Gestionnaire de médias Wordpress 3.5?

J'ai jeté un œil à l'épine dorsale et essayé de m'y accrocher avec mon propre JS, mais sans succès.

Edit 2: Cela semble faire l'affaire:

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

Cela devrait suffire, mais je suppose qu'il est également possible de faire la même chose en Javascript. Ce serait bien s'il y avait un tutoriel / une explication sur le fonctionnement interne du nouveau gestionnaire de média.

erezie
la source
Qu'est-ce que votre nouveau menu est censé faire? L'ajout d'un élément de menu n'est pas le problème principal et vous êtes sur la bonne voie, mais si votre menu est supposé afficher quelque chose de différent des vues par défaut, avec juste le réglage modifié, Backbone a besoin d'une vue pour votre élément de menu ... et C'est là que je suis coincé aussi ...
ungestaltbar
cliquer sur l'élément de menu est censé afficher une vue différente. Obtenir le point de menu pour apparaître serait une première étape
erezie
1
En ce qui concerne mon report de 150 points: Je souhaite poursuivre l’objectif de l’affiche originale consistant à utiliser une méthode basée sur JS pour ajouter un nouvel élément de menu État sous "Insérer à partir de l’URL" et associer une nouvelle vue au modal de média principal de Post Editor.
Scott Kingsley Clark
@erezie, pouvez-vous indiquer la réponse à cette question comme celle fournie par Fabien Quatravaux?
Scott Kingsley Clark

Réponses:

19

OK, je pense que j'ai quelque chose qui est vraiment proche d'être une réponse:

Je mets mon code dans une essence

Voici le résultat: capture d'écran du menu personnalisé

J'ai construit plusieurs objets Backbone pour respecter le modèle MVC: il controller.Customest chargé de toute la logique, des view.Toolbar.Customaccords avec les boutons de la barre d'outils et de l' view.Customaffichage de l'interface utilisateur interne.

Fabien Quatravaux
la source
2
Qu'est-ce qu'il manque jusqu'à présent?
Kaiser
+1 bon début! Mais oui, au lieu d’avoir besoin de la mettre en œuvre pour savoir ce qu’elle fait, un instantané serait très utile . Et aussi, tirez cette ligne de commentaire //build an empty view (needs more work)sur le contenu de la réponse.
brasofilo
J'ai ajouté une capture d'écran pour montrer le résultat. La prochaine chose à faire est maintenant d'implémenter la vue elle-même qui affichera les composants HTML et réagira à l'interaction de l'utilisateur.
Fabien Quatravaux
Cela a l'air cool, c'est certainement un début! Digne de la prime telle quelle, mais n'hésitez pas à l'amener au niveau supérieur si vous en ressentez le besoin.
Scott Kingsley Clark
Merci pour la prime Scott! Je vais certainement creuser un peu plus parce que j'en ai besoin pour un projet au travail. Je posterai mon code ici dès qu'il sera utilisable.
Fabien Quatravaux
10

Je travaille sur l'ajout d'un bouton au "menu du routeur" (en ajoutant quelque chose à droite de "Médiathèque"), mais le système est le même.

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

Maintenant, il ne fait rien encore. C'est la prochaine étape!

Joost
la source
2
Tu as de la chance? J'aimerais vraiment voir une solution basée sur JS, pas la solution PHP d'iframe déjà notée dans l'édition de l'affiche originale et une autre réponse
Scott Kingsley Clark
7

Vous pouvez vous connecter au media_upload_tabsfiltre pour ajouter l'onglet. Voici la méthode utilisée par le plugin Network Shared Media :

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

Vous pouvez ensuite vous lier à l’ media_upload_tab_slugaction (où tab_slugest celle utilisée précédemment) pour afficher le contenu de l’onglet:

function wpse_76980_media_upload() {
    // display tab contents
}
add_action( 'media_upload_tab_slug', 'wpse_76980_media_upload' );
karité
la source
2
C'est l'ancienne façon d'ajouter un onglet. Bien que cela fonctionne toujours, mais je soupçonne que WP s'en éloigne.
Jenny
2
@ Jenny, je pense que nous pouvons compter sur ce filtre. Pertinentes billet . (: oh, et +1, joli snipett :)
brasofilo
3

Je n'ai pas de solution, mais des allusions. Les chaînes proviennent d'un tableau. Vous pouvez filtrer via hook media_view_strings. La boîte modale après clic est un javascript, construit avec backbone.js depuis WP 3.5. Voir dans /wp-includes/js/media-views.jspour une solution. Backbone est également nouveau pour moi et les scripts ont plusieurs lignes de source.

bueltge
la source
C'était un très bon indice, mais je pense que cela ne tient pas. La media.view.settingsvariable js peut être modifiée par un filtre php pour ajouter de nouveaux onglets, mais ces onglets sont ensuite restitués via un iframe (voir la createIframeStatesméthode à media-views.js).
Fabien Quatravaux
Peut-être pourriez-vous ajouter un tutoriel, un élément essentiel à votre blog ou ajouter un lien simple dans la vue multimédia et une action personnalisée en cliquant sur ce lien? Votre contenu actuel est très complexe et comporte de nombreuses actions personnalisées.
Bueltge
Malheureusement, je n'ai pas trouvé d'autre moyen plus simple d'y parvenir. Ce code ne fait qu'une chose de base: ajoutez un élément de menu personnalisé à gauche, avec sa propre vue de contenu, sa barre d’outils et son contrôleur. Toute cette construction est nécessaire pour construire les vues et le contrôleur nécessaires à Backbone. Mais si vous avez une solution plus simple, n'hésitez pas à préciser mon propos.
Fabien Quatravaux
Oui, j'ai vu cela et aussi testé, ça marche bien. Mais je pense que c’était bien, que vous créiez également un contenu essentiel pour un bouton ou un lien et une fonction de rappel dans l’écran multimédia par défaut, et non une partie supplémentaire, comme dans votre exemple.
bueltge