1

Whilst (patiently) waiting for proper documentation and/or a few tutorials on the new media uploader I'm still using the media_upload_tabsfilter to add a tab to the uploader. Here's my (working) code:

<?php

add_filter( 'media_upload_tabs', 'olab_add_media_tab' );
function olab_add_media_tab( $tabs ) {
    $tabs['bildarkiv'] = __( 'Bildarkiv', 'bildarkiv' );
    return $tabs;
}

add_action( 'media_upload_bildarkiv', 'olab_tab_content' );
function olab_tab_content() {
  ?>
  <h1>WOOT!</h1>
  <?php
}

add_action( 'print_media_templates', 'obab_enqueue_admin_stuff' );
function obab_enqueue_admin_stuff() {
  wp_register_style( 'bak-css', plugins_url( 'css/main.css', __FILE__ ) );
  wp_enqueue_style( 'bak-css' );
  wp_enqueue_script( 'bak-js', plugins_url( 'js/app.js', __FILE__ ), 'jquery' );
}

This all works, but the content of the tab is enclosed in an iFrame which means that my enqueued scripts + styles do precisely nothing!

I don't mind the iFrame I suppose, but I can't find a way to attach CSS / JS to the <head> of the iFrame. Any inline JS is stripped out when the iFrame is rendered.

Anyone know about this?

Improve this question
2
  • The new media uploader using backbone.js, so you need to look into how you can customise scripts written in this language in order to perform the changes you wish to make.
    – Ollie
    Commented Jan 4, 2013 at 9:16
  • I know it's written in backbone + underscore! There just isn't any (WordPress specific) documentation. The media-view.js is 4290 lines long! I need a little help there!
    – Richard Sweeney
    Commented Jan 4, 2013 at 12:07

1 Answer 1

Reset to default
2

You need to en-queue your styles and scripts in your media upload hook and then clal wp_iframe function. Just do it like this and it will work:

<?php

add_filter( 'media_upload_tabs', 'olab_add_media_tab' );
function olab_add_media_tab( $tabs ) {
    $tabs['bildarkiv'] = __( 'Bildarkiv', 'bildarkiv' );
    return $tabs;
}

add_action( 'media_upload_bildarkiv', 'olab_tab_iframe' );
function olab_tab_iframe() {
    wp_register_style( 'bak-css', plugins_url( 'css/main.css', __FILE__ ) );
    wp_enqueue_style( 'bak-css' );

    wp_enqueue_script( 'bak-js', plugins_url( 'js/app.js', __FILE__ ), 'jquery' );

    wp_iframe( 'olab_tab_content' );
}

function olab_tab_content() {
    ?>
    <h1>WOOT!</h1>
    <?php
}
Improve this answer
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.