web-dev-qa-db-ja.com

メディアアップローダのJavaScriptオブジェクトからカスタム画像サイズを取得する

Javascriptオブジェクトを返すためにadd_image_sizeを使って作成したカスタムイメージサイズを取得しようとしています。ドロップダウンにそれらを含める方法は知っていますが、それを望まない/必要としません。

現在のオブジェクトはデフォルト(フル、ラージ、ミディアム、およびサムネイル)を配列で返しますが、カスタムサイズは返しません。

これが私がアップローダインスタンスを設定するために使っているコードです。

jQuery('input.guide-logo-upload').on('click', function( event ){

    event.preventDefault();

    // If the media frame already exists, reopen it.
    if ( file_frame ) {
        file_frame.open();
        return;
    }

    // Create the media frame.
    file_frame = wp.media.frames.file_frame = wp.media({
        title: jQuery( this ).data( 'uploader_title' ),
        button: {
            text: jQuery( this ).data( 'uploader_button_text' )
        },
        multiple: false // force single file
    });

    // run the callback when selected
    file_frame.on( 'select', function() {

        // make sure to only deal with the first item
        attachment = file_frame.state().get('selection').first().toJSON();

        // WHERE ARE MY CUSTOM SIZES
        console.log(attachment);

        // Populate the field with the URL and show a preview below it
        jQuery('input#g-logo').val( attachment.url );
        jQuery('input#g-logo-id').val( attachment.id );

        jQuery('p.logo-description').after( '<img class="logo-display logo-140" src="' + attachment.sizes.thumbnail.url + '">' );
        jQuery('p.logo-description').after( '<img class="logo-display logo-350" src="' + attachment.sizes.medium.url + '">' );

    });

    // Finally, open the modal
    file_frame.open();
});
5
Norcross

twitterの友人のおかげで、私はこれを機能させることができました。以下はそのコードです。

function wpse_110060_image_sizes_js( $response, $attachment, $meta ){

        $size_array = array( 'custom_size_one', 'custom_size_two') ;

        foreach ( $size_array as $size ):

            if ( isset( $meta['sizes'][ $size ] ) ) {
                $attachment_url = wp_get_attachment_url( $attachment->ID );
                $base_url = str_replace( wp_basename( $attachment_url ), '', $attachment_url );
                $size_meta = $meta['sizes'][ $size ];

                $response['sizes'][ $size ] = array(
                    'height'        => $size_meta['height'],
                    'width'         => $size_meta['width'],
                    'url'           => $base_url . $size_meta['file'],
                    'orientation'   => $size_meta['height'] > $size_meta['width'] ? 'portrait' : 'landscape',
                );
            }

        endforeach;

        return $response;
}
add_filter ( 'wp_prepare_attachment_for_js',  'wpse_110060_image_sizes_js' , 10, 3  );

注:配列とforeachは、2つの別々のものを含める必要があるので必要なだけです。含めるものが1つしかない場合は、それを削除できます。

7
Norcross