Миниатюры записи через стандартный медиа интерфейс WordPress
1. Создан кастомный тип записи.
2. Необходимо реализовать следующий функционал в админке:
Прикрепление трех картинок(миниатюр) к одному посту, на сколько я понимаю необходимо смотреть в сторону:
add_meta_box
Но необходимо сделать такой же интерфейс, как у стандартной миниатюры, т.е. открытие медиафайлов, библиотеки файлов, превью картинки и т.д.
Если с таким не сталкивались, то хоть наставьте на путь истинный.
Надеюсь на отзывчивость, заранее благодарен.
Делал как-то немного не то, но очень похоже.
Суть: Файлы прикрепленные к записи выведены в отдельный метабокс и их сразу видно. Также, можно выбрать один файл, который станет стандартной миниатюрой записи.
Принцип работы: с помощью Kama_Post_Meta_Box создается метабокс, в котором выводятся все загруженные для записи картинки, по клику на кнопку можно как обычно загрузить картинки для записи и установить стандартную миниатюру.
В общем, вам этот код нужно немного изменить.
Если немного разбираетесь в программировании сможете без особых проблем под себя настроить.
<?php // Метабокс загрузки картинок if(1){ class_exists('Kama_Post_Meta_Box') && new Kama_Post_Meta_Box( array( 'id' => '_qimages', 'title' => 'Загрузка картинок и выбор основной', 'post_type' => 'page', 'fields' => array( '_thumbnail_id' => array('callback' => '_qimages_callback' ), ), ) ); // выводит все картинки и кнопку function _qimages_callback( $args, $post, $name, $val ){ echo ' <div class="wp-media-buttons" style="padding:4em 1em 1em 0; __float:none;"> <button type="button" id="qimages__add" class="button add_media" data-post_id="'. $post->ID .'" data-attr_name="'. $name .'"><span class="wp-media-buttons-icon"></span> Добавить/удалить картинку</button> </div>'; echo ___qimages_callback_images( $post->ID, $name, $val ); if( ! defined('DOING_AJAX') ) add_action('admin_print_footer_scripts', '__qimages_callback_js'); } function ___qimages_callback_images( $post_id, $name, $val ){ $out = ''; $out .= '<span class="images__wrap">'; $images = get_children([ 'post_parent' => $post_id ]); if( ! $images ) $out .= 'Картинок нет'; else foreach( $images as $img ){ $out .= ' <label style="text-align:center; float:left; margin-right:.5em;"> <input type="radio" name="'. esc_attr($name) .'" value="'. $img->ID .'" '. checked($img->ID, $val, 0) .'><br> <img src="'. wp_get_attachment_image_url( $img->ID, 'thumbnail' ) .'" width="100" height="100" alt=""> </label>'; } $out .= '</span>'; return $out; } function __qimages_callback_js(){ ?> <script> jQuery(document).ready(function($){ var frame; $('#qimages__add').click( function( event ) { event.preventDefault(); var $el = $(this), attr_name = $el.data('attr_name'), post_id = $el.data('post_id'), $imgs_cont = $el.closest('.inside').find('.images__wrap'); if( frame ){ frame.open(); return; } // Create the media frame. frame = wp.media.frames.questImgAdd = wp.media({ states: [ new wp.media.controller.Library({ title: 'Загрузка изображений квеста', library: wp.media.query({ type: 'image', post_parent: post_id }), multiple: false, date: false }) ], // submit button. button: { text: 'Сделать эту картинку главной', // Set the text of the button. } }); var selectClose_func = function(){ var $checked_radio = $imgs_cont.find('input[type=radio]:checked'), attach_id = $checked_radio.length ? $checked_radio.val() : 0; // если это выбор из окна if( this.toString() === 'select' ){ var selected = frame.state().get( 'selection' ).first(); if( selected ) attach_id = selected.id; } var data = { action: 'refresh_quest_images', post_id: post_id, attr_name: attr_name, attach_id: attach_id } //console.log( data ); // AJAX $imgs_cont.html('Обновляю...'); $.post( ajaxurl, data, function(resp) { if( resp !== '' ){ $imgs_cont.html( resp ); } }); }; frame.on('select', selectClose_func, 'select' ); frame.on('close', selectClose_func, 'close' ); // set selected frame.on('open', function(){ var $checked = $imgs_cont.find('input[type=radio]:checked'); if( $checked.length ) frame.state().get('selection').add( wp.media.attachment($checked.val()) ); }); frame.open(); }); }); </script> <?php } if( defined('DOING_AJAX') && DOING_AJAX ){ add_action('wp_ajax_refresh_quest_images', 'ajax_refresh_quest_images_cb'); function ajax_refresh_quest_images_cb(){ $post_id = (int) $_POST['post_id']; $name = $_POST['attr_name']; $val = (int) $_POST['attach_id']; if( ! current_user_can('edit_post', $post_id ) ) die; echo ___qimages_callback_images( $post_id, $name, $val ); die; } } }В результате получим такой метабокс
Документация по скрипту медиатеки: Media Backbone Guide
Дай Бог тебе здоровья!
Спасибо большое.
Для Вашей задачи используйте плагин ACF: http://advancedcustomfields.com/
или ему подобные.
1 - вот так в настройках плагина, когда создаете новый метабокс, указать нужно тип поля "Изображение" http://screencloud.net/v/839e
2 - также нужно указать, к какому типу записи показывать Ваш метабокс
http://screencloud.net/v/l9C1
Будут вопросы - пишите.
Спасибо за советы, 1) плагины принципиально не использую, да и обратился сюда, потому что завал по проектам, было бы время сам разобрался, но Kama облегчил задачу до 100%) 2) Такие простые вещи мне знакомы. Пишите если что буду помогать, хвататься не хочу но с WP давно и шарю в PHP и MySQL
Хотел бы вступить в дискуссию:
1) сайт делаете для себя или для заказчика ?
2) сколько Вы тратите время (берете денег) на разработку сайта ? разве не проще использовать плагин ACF, который в разы ускоряет разработку ?
3) какой ваш рейт (ставка в час) ?
1) Для заказчика
2) на счет денег точной суммы нет, все зависит от поставленных задач, не приветствую плагины, т.к. иногда нужна гибкая кастомизация и разбираться в чужом коде плагина нет желания, да иногда изобретаю велосипеды, но это опыт и маловероятно кому то захочется взламывать именно мой велосипед. А так нашел дырку в плагине который использует несколько тыс. человек и все есть ключик к этим тысячи сайтам.
3) Не считал, говорю очень много работы, работаю с 9.00 до 22.00 каждый день на протяжении 6 мес. Изнурительно, от жадности набрал проектов) за то урок на всю жизнь.