web-dev-qa-db-ja.com

投稿からの画像の添付解除

私は現在、開発中のテーマにカスタム投稿タイプがあり、これはポートフォリオアイテムに使用されます。これまで、画像をポートフォリオ投稿に添付できるようにする機能を実装しました。

投稿から画像をデタッチするための最良の方法が必要です。現在私のコードは次のとおりです。

    $images =& get_children('post_type=attachment&post_mime_type=image&post_parent=$post->ID');
            $numberOfImages = count($images);
            if($numberOfImages == 1) {

            }
            else if($numberOfImages > 1)
            {
                foreach($images as $attachment_id => $attachment)
                {
                    $imageAttributes = wp_get_attachment_image_src($attachment_id);
                    ?>
                    <div class="element">
                        <img alt="" height="100" src="<?php echo $imageAttributes[0]; ?>" width="150" />
                        <a href="#" title="Unattach this media item.">Unattach</a>
                    </div>
                    <?php
                }
            }

これにより、添付されている画像がループされ、関連付けられている[Unattach]ボタンと共にメタボックスに表示されます。投稿から画像を切り離すために何をどこへリンクする必要があるのか​​迷っています。任意の助けをいただければ幸いです。

1
Darren

これは、データベースを照会して親を「ゼロ」に設定するAjax呼び出しを使用して実行できます。

まず、メタボックスを作成し、unattach関数を呼び出すJavascriptをエンキューし、このWP_Ajax関数を登録します。

<?php
/*
Plugin Name: Unattach Meta Box
Version: 0.3
Author: brasofilo
Plugin URI: http://wordpress.stackexchange.com/q/54822
*/

add_action( 'add_meta_boxes', 'wpse_54822_add_custom_box' );
add_action( 'admin_head', 'wpse_54822_script_enqueuer' );
add_action( 'wp_ajax_wpse_54822_custom_query', 'wpse_54822_unattach' );
add_action( 'wp_ajax_nopriv_wpse_54822_custom_query', 'wpse_54822_unattach' );

function wpse_54822_add_custom_box() 
{
    add_meta_box(
        'wpse_54822_sectionid',
        __( 'Page Attachments' ), 
        'wpse_54822_inner_custom_box',
        'page'
    );
}

function wpse_54822_inner_custom_box() 
{
    global $post;
    $images = get_children( 'post_type=attachment&post_mime_type=image&post_parent=' . $post->ID );
    if( count($images) > 0 )
    {
        foreach( $images as $attachment_id => $attachment )
        {
            $imageAttributes = wp_get_attachment_image_src( $attachment_id );
            ?>
            <div class="element" id="container-<?php echo $attachment_id; ?>">
                <img alt="" height="100" src="<?php echo $imageAttributes[0]; ?>" width="150" />
                <a href="javascript:void(0);" id="dettach-<?php echo $attachment_id; ?>" class="dettach" title="Unattach this media item." >Unattach</a>
            </div>
            <?php
        }
    } 
    else
    {
        echo 'No images attached.';
    }
}

function wpse_54822_script_enqueuer() 
{
    global $current_screen;
    if( 'page' != $current_screen->id )
        return;
    wp_register_script( 'scripts.js', plugin_dir_url(__FILE__).'script.js' );
    wp_enqueue_script( 'scripts.js' );
    wp_localize_script( 'scripts.js', 'wp_ajax', array( 
        'url' => admin_url( 'admin-ajax.php' ),
        'nonce' => wp_create_nonce('nonce_wpse_54822')
    )); 
}

function wpse_54822_unattach()
{
    check_ajax_referer( 'nonce_wpse_54822' );
    global $post, $wpdb;
    if( !isset( $_POST['the_attach_id'] ) )
        wp_send_json_error( array( 'error' => 'ID not set' ) );

    $the_id = intval( $_POST['the_attach_id'] );
    $do_query = $wpdb->query( $wpdb->prepare( 
        "UPDATE $wpdb->posts SET post_parent = 0 WHERE ID = '%s'", 
        $the_id 
    ));

    if( !$do_query ) {
        wp_send_json_error( array( 'error' => 'Query error.' ) ); // Refine this to show proper wpdb error
    }
    else {
        wp_send_json_success();
    }
}

これはエンキューされたJavascriptファイル(script.js)です。それはアタッチ解除するためにMySqlクエリを実行するAjax呼び出しを行い、メタボックスからサムネイルを削除します。

jQuery(document).ready( function($) 
{       
    $('.dettach').each( function(i,e)
    {
        var id = $(this).attr('id').replace(/dettach-/, '');
        $(this).click( function(){
            $.post( 
                wp_ajax.url, 
                { 
                    action: 'wpse_54822_custom_query', 
                    _ajax_nonce: wp_ajax.nonce, 
                    the_attach_id: id
                }, 
                function( response ){
                    if( !response.success )
                        console.log( response.data.error );
                    else
                        remove_image( id );
                }
            );
        });
     });                 

    function remove_image( id )
    {
        $('#container-'+id).remove();
        return false;
    }
});  

結果:
unattach meta box

6
brasofilo