Menambahkan input khusus untuk atribut data dalam menyisipkan modal media

Saya mencoba menambahkan input teks ke modal "Insert Media" dengan harapan bisa menambahkan data-atribut html5 ke jangkar induk gambar.

<a class="fancybox" href="..." data-fancybox-group=" "> <- Bagian ini
<img class="wp-image-871" src="..." alt="..." width="245" height="333" />
</a>

Sejauh ini saya sudah bisa menambahkan input ke modal:

Menggunakan kode di bawah ini di file functions.php saya:

function add_fancybox_input( $form_fields, $post ) {
$form_fields['fancyboxGroup'] = array(
'label' => 'fancybox group',
'input' => 'text',
'value' => 'testing',
'helps' => 'use this to group images in fancybox',
);
return $form_fields;
}

add_filter( 'attachment_fields_to_edit', 'add_fancybox_input', 10, 2 );

Dan saya telah menambahkannya data-fancybox-group=""ke anchor menggunakan:

function give_linked_images_class($html, $id, $caption, $title, $align, $url, $size, $alt = '' ){
  $classes = 'fancybox'; // separated by spaces, e.g. 'img image-link'

  // check if there are already classes assigned to the anchor
  if ( preg_match('/<a.*? class=".*?">/', $html) ) {
    $html = preg_replace('/(<a.*? class=".*?)(".*?>)/', '$1 ' . $classes . '$2', $html);
  } else {
    $html = preg_replace('/(<a.*?)>/', '$1 class="' . $classes . '" data-fancybox-group="" >', $html);
  }
  return $html;
}
add_filter('image_send_to_editor','give_linked_images_class',10,8);

Di sinilah saya terjebak ... Saya punya tempat untuk memasukkan data dan saya punya tempat untuk data itu, tapi saya tidak yakin bagaimana cara mendapatkan data dari input ke data Atribut -fancybox-group.

Saya telah melihat sumbernya, sayangnya saya belum melihat cara yang bagus untuk meneruskan informasi tanpa menyimpannya. Yang menyebalkan - waktu besar - karena ini sebenarnya bukan apa-apa yang perlu diselamatkan.

Solusinya adalah untuk mengaktifkan Sesi PHP dengan meletakkan yang berikut di awal Anda functions.php:

    if (!session_id()) {
        session_start();
    }

Sekarang Anda dapat menggunakan $_SESSIONvariabel, seperti ini:

    $_SESSION[ 'your-key' ] = 'your-value';

Buat bidang formulir Anda seperti ini:

    function wpse_154330_attachment_fields_to_edit( $form_fields, $post ) {
        $current_screen = get_current_screen();
        // we are not saving, so no need to show the field on the attachment page
        if ( $current_screen->id == 'attachment' ) {
            return $form_fields;
        }
        $form_fields['fancyboxGroup'] = array(
            'label' => 'fancybox group',
            'input' => 'text',
            'value' => '', // leave the value empty
            'helps' => 'use this to group images in fancybox',
        );
        return $form_fields;
    }
    add_filter(
        'attachment_fields_to_edit',
        'wpse_154330_attachment_fields_to_edit',
        10,
        2
    );

Manfaatkan variabel sesi seperti ini:

    function wpse154330_save_attachment_field( $post, $attachment ) {
        // we're only setting up the variable, not changing anything else
        if ( isset( $attachment[ 'fancyboxGroup' ] ) {
            $_SESSION[ 'fancyboxGroup' ] = $attachment[ 'fancyboxGroup' ];
        }
        return $post;
    }
    add_filter(
        'attachment_fields_to_save',
        'wpse154330_save_attachment_field',
        10,
        2
    );

Ubah output sesuai:

    function wpse154330_image_send_to_editor(
        $html,
        $id,
        $caption,
        $title,
        $align,
        $url,
        $size,
        $alt = ''
    ) {
        // no need to modify the output, if no fancybox group is given
        if (
            empty( $_SESSION[ 'fancyboxGroup' ] )
            || ! isset( $_SESSION[ 'fancyboxGroup' ] )
        ) {
            return $html;
        }
        $classes = 'fancybox';
        if ( preg_match( '/<a.*? class=".*?">/', $html ) ) {
            $html = preg_replace(
                '/(<a.*? class=".*?)(".*?>)/',
                '$1 ' . $classes . '$2',
                $html
            );
        } else {
            $html = preg_replace(
                '/(<a.*?)>/',
                '$1 class="'
                    . $classes
                    . '" data-fancybox-group="'
                    . $_SESSION[ 'fancyboxGroup' ]
                    . '" >',
                $html
            );
        }
        unset( $_SESSION[ 'fancyboxGroup' ] );
        return $html;
    }
    add_filter(
        'image_send_to_editor',
        'wpse154330_image_send_to_editor',
        10,
        8
    );

Itu saja. Seharusnya cukup banyak menjelaskan sendiri, kalau tidak hanya bertanya.

Anda harus dapat menarik bidang menggunakan get_post_meta.

function give_linked_images_class($html, $id, $caption, $title, $align, $url, $size, $alt = '' ){
  $classes = 'fancybox'; // separated by spaces, e.g. 'img image-link'

  // check if there are already classes assigned to the anchor
  if ( preg_match('/<a.*? class=".*?">/', $html) ) {
    $html = preg_replace('/(<a.*? class=".*?)(".*?>)/', '$1 ' . $classes . '$2', $html);
  } else {
    $html = preg_replace('/(<a.*?)>/', '$1 class="' . $classes . '" data-fancybox-group="'.get_post_meta($id, 'fancyboxGroup', true).'" >', $html);
  }
  return $html;
}
add_filter('image_send_to_editor','give_linked_images_class',10,8);

Selain itu, Anda harus menghubungkan ke attachment_fields_to_savefilter, jika belum, untuk menyimpan bidang yang Anda tambahkan.

function wpse154330_save_attachment_field($post, $attachment) {
    if( isset($attachment['fancyboxGroup']) ){
            update_post_meta($post['ID'], 'fancyboxGroup', $attachment['fancyboxGroup']);
        }

    return $post;
}

add_filter( 'attachment_fields_to_save','wpse154330_save_attachment_field', 10, 2);

Anda juga harus memperbarui add_fancybox_inputfungsi Anda . Ubah nilai untuk menarik bidang fancybox.

function add_fancybox_input( $form_fields, $post ) {
$form_fields['fancyboxGroup'] = array(
'label' => 'fancybox group',
'input' => 'text',
'value' => get_post_meta($post->ID, 'fancyboxGroup', true),
'helps' => 'use this to group images in fancybox',
);
return $form_fields;
}
add_filter( 'attachment_fields_to_edit', 'add_fancybox_input', 10, 2 );

Saya tidak yakin apakah ini yang terbaik untuk Anda, tetapi saya rasa Anda bisa mencobanya.

Dapatkan data dari bidang input dan letakkan dalam formulir di input tersembunyi atau sesuatu dan lakukan atribut data saat jendela Pemilihan Media akan ditutup

$inputValue = $('.some_class').val();
$('.fancybox').data('fancybox-group', $inputValue);

Saya tahu ini kedengarannya gila, tetapi mungkin sangat sederhana bagi Anda dan mungkin berhasil.