Как я могу добавить поле для загрузки изображения непосредственно в пользовательскую панель записи?

Я добавил новую страницу в разделе «Страницы» в wordpress admin и добавил несколько настраиваемых полей. Я также хотел бы иметь возможность добавлять поле для загрузки в редактор страниц - есть ли способ сделать это с помощью настраиваемых полей?

Или есть другое направление, которое мне нужно принять, если мне нужна эта способность?

60 голосов | спросил Will 19 52010vEurope/Moscow11bEurope/MoscowFri, 19 Nov 2010 21:31:26 +0300 2010, 21:31:26

2 ответа


106

Для тех, кто хочет узнать больше о загрузке файлов, вот краткое руководство по основным темам и болям. Это написано с помощью WordPress 3.0 в Linux-блоке, и код является всего лишь базовым обзором для обучения концепциям. Я уверен, что некоторые люди могут предложить советы по улучшению реализации.

Очертите свой основной подход

Существует как минимум три способа связывания изображений с сообщениями: использование поля post_meta для хранения пути изображения, используя поле post_meta для хранения идентификатора медиа-библиотеки изображения (подробнее об этом позже) или назначение изображения для сообщения в виде вложения. В этом примере будет использоваться поле post_meta для хранения идентификатора медиа-библиотеки изображения. YMMV.

Многостороннее кодирование

По умолчанию WordPress создает & у форм редактирования нет enctype. Если вы хотите загрузить файл, вам нужно добавить в тег формы «enctype = 'multipart /form-data», иначе коллекция $ _FILES вообще не будет пропущена. В WordPress 3.0 для этого есть крючок. В некоторых предыдущих версиях (не уверенных в специфике) вы должны заменить строку тега формы.

function xxxx_add_edit_form_multipart_encoding () {

    echo 'enctype = "multipart /form-data"';

}
add_action ('post_edit_form_tag', 'xxxx_add_edit_form_multipart_encoding');

Создайте метабокс и поле для загрузки

Я не буду далеко ходить в создании мета-полей, поскольку большинство из вас, вероятно, уже знают, как это сделать, но я просто скажу, что вам нужен только простой мета-ящик с файловым полем в нем. В приведенном ниже примере я включил некоторый код для поиска существующего изображения и его отображение, если оно существует. Я также включил некоторые простые функции ошибок /обратной связи, которые пропускают ошибки, используя поле post_meta. Вы захотите изменить это, чтобы использовать класс WP_Error ... это просто для демонстрации.

function xxxx_render_image_attachment_box ($ post) {

    //Посмотрим, есть ли существующее изображение. (Мы связываем изображения с сообщениями, сохраняя «идентификатор прикрепления» изображения как метаданные сообщения)
    //Кстати, это также то, как вы найдете любые загруженные файлы для отображения на интерфейсе.
    $ existing_image_id = get_post_meta ($ post-> ID, '_ xxxx_attached_image', true);
    if (is_numeric ($ existing_image_id)) {

        echo '<div>';
            $ arr_existing_image = wp_get_attachment_image_src ($ existing_image_id, 'large');
            $ existing_image_url = $ arr_existing_image [0];
            echo '<img src = "'. $ existing_image_url. '" />';
        echo '</div>';

    }

    //Если есть существующее изображение, покажите его
    if ($ existing_image_id) {

        echo '<div> Идентификатор прикрепленного изображения:'. $ existing_image_id. '& Л; /дел >';

    }

    echo 'Загрузить изображение: <input type = "file" name = "xxxx_image" id = "xxxx_image" />';

    //Посмотрим, есть ли сообщение статуса для отображения (мы используем это, чтобы показывать ошибки во время процесса загрузки, хотя мы, вероятно, должны использовать класс WP_error)
    $ status_message = get_post_meta ($ post-> ID, '_ xxxx_attached_image_upload_feedback', true);

    //Показывать сообщение об ошибке, если есть
    if ($ status_message) {

        echo '<div class = "upload_status_message">';
            echo $ status_message;
        echo '</div>';

    }

    //Поместите скрытый флаг. Это помогает различать ручные сбережения и автоматическое сохранение (при автоматическом сохранении файл не будет передан).
    echo '<input type = "hidden" name = "xxxx_manual_save_flag" value = "true" />';

}



функция xxxx_setup_meta_boxes () {

    //Добавить поле на страницу определенного типа контента
    add_meta_box ('xxxx_image_box', 'Загрузить изображение', 'xxxx_render_image_attachment_box', 'post', 'normal', 'high');

}
add_action ( 'admin_init', 'xxxx_setup_meta_boxes');

Обработка загрузки файла

Это большой - фактически обрабатывает загрузку файла, подключаясь к действию save_post. Я включил функцию с сильным комментарием ниже, но я хотел бы отметить две ключевые функции WordPress, которые она использует:

wp_handle_upload () выполняет всю магию, а также обработку загрузки. Вы просто передаете ему ссылку на свое поле в массиве $ _FILES и массив параметров (не беспокойтесь слишком много об этом - единственное, что вам нужно установить, это test_form = false. Поверьте мне). Однако эта функция не добавляет загруженный файл в медиа-библиотеку. Он просто загружает и возвращает путь к новому файлу (и, при необходимости, полный URL-адрес). Если есть проблема, она возвращает ошибку.

wp_insert_attachment () добавляет изображение в медиа-библиотеку и генерирует все соответствующие миниатюры. Вы просто передаете ему множество параметров (название, статус сообщения и т. Д.) И ЛОКАЛЬНЫЙ путь (не URL) к только что загруженному файлу. Самое замечательное в размещении изображений в медиа-библиотеке заключается в том, что вы можете легко удалить все файлы позже, вызвав wp_delete_attachment и передав ему идентификатор медиа-библиотеки элемента (который я делаю в функцииниже). С помощью этой функции вам также необходимо будет использовать wp_generate_attachment_metadata () и wp_update_attachment_metadata (), которые будут делать именно то, что вы ожидаете от них, - сгенерировать метаданные для элемента мультимедиа.

function xxxx_update_post ($ post_id, $ post) {

    //Получить тип сообщения. Поскольку эта функция будет работать для ВСЕХ сообщений (независимо от типа сообщения), нам нужно это знать.
    //Важно также отметить, что действие save_post может выполняться несколько раз при каждом сохранении сообщения, поэтому вам нужно проверить и убедиться, что
    //post type в переданном объекте не является "ревизией"
    $ post_type = $ post-> post_type;

    //Удостоверьтесь, что наш флаг находится там, иначе это автосохранение, и мы должны залог.
    if ($ post_id & & isset ($ _ POST ['xxxx_manual_save_flag])) {

        //Логика для обработки определенных типов сообщений
        switch ($ post_type) {

            //Если это сообщение. Вы можете изменить этот случай, чтобы отразить свой собственный рекламный пул
            case 'post':

                //РУЧКА ФАЙЛА ЗАГРУЗИТЬ

                //Если в поле загрузки есть файл
                if (isset ($ _ FILES ['xxxx_image']) & & ($ _FILES ['xxxx_image'] ['size']> 0)) {

                    //Получить тип загруженного файла. Это возвращается как «тип /расширение»
                    $ arr_file_type = wp_check_filetype (basename ($ _ FILES ['xxxx_image'] ['name']));
                    $ uploaded_file_type = $ arr_file_type ['type'];

                    //Установить массив, содержащий список допустимых форматов
                    $ allowed_file_types = array ('image /jpg', 'image /jpeg', 'image /gif', 'image /png');

                    //Если загруженный файл является правильным форматом
                    if (in_array ($ uploaded_file_type, $ allowed_file_types)) {

                        //Массив опций для функции wp_handle_upload. 'test_upload' => ложный
                        $ upload_overrides = array ('test_form' => false);

                        //Обрабатываем загрузку с помощью функции WP wp_handle_upload. Принимает опубликованный файл и массив опций
                        $ uploaded_file = wp_handle_upload ($ _ FILES ['xxxx_image'], $ upload_overrides);

                        //Если вызов wp_handle_upload возвратил локальный путь для изображения
                        if (isset ($ uploaded_file ['file'])) {

                            //Функция wp_insert_attachment нуждается в литеральном системном пути, который был возвращен из wp_handle_upload
                            $ file_name_and_location = $ uploaded_file ['file'];

                            //Создаем заголовок для изображения, которое будет использоваться в медиатеке
                            $ file_title_for_media_library = 'ваш заголовок здесь';

                            //Настройка массива опций для добавления этого файла в качестве вложения
                            $ attachment = array (
                                'post_mime_type' => $ Uploaded_file_type,
                                'post_title' => «Загруженное изображение». addslashes ($ file_title_for_media_library),
                                'post_content' => '',
                                'post_status' => «Унаследуют»
                            );

                            //Запустите функцию wp_insert_attachment. Это добавляет файл в медиа-библиотеку и генерирует миниатюры. Если вы хотите закрепить это изображение на сообщение, вы можете передать идентификатор сообщения в качестве третьего параметра, и это было бы волшебным образом.
                            $ attach_id = wp_insert_attachment ($ attachment, $ file_name_and_location);
                            require_once (ABSPATH. "wp-admin". /includes/image.php ');
                            $ attach_data = wp_generate_attachment_metadata ($ attach_id, $ file_name_and_location);
                            wp_update_attachment_metadata ($ attach_id, $ attach_data);

                            //Прежде чем обновлять мета-сообщение, удалите ранее загруженное изображение для этого сообщения.
                            //Возможно, вы не захотите этого поведения, в зависимости от того, как вы используете загруженные изображения.
                            $ existing_uploaded_image = (int) get_post_meta ($ post_id, '_ xxxx_attached_image', true);
                            if (is_numeric ($ existing_uploaded_image)) {
                                wp_delete_attachment ($ existing_uploaded_image);
                            }

                            //Теперь обновим метаданные сообщения, чтобы связать новое изображение с сообщением
                            update_post_meta ($ post_id, '_ xxxx_attached_image', $ attach_id);

                            //Установите флаг обратной связи в false, поскольку загрузка была успешной
                            $ upload_feedback = false;


                        } else {//wp_handle_upload возвращает некоторую ошибку. возврат содержит сведения об ошибке, поэтому вы можете использовать его здесь, если хотите.

                            $ upload_feedback = 'Была проблема с вашей загрузкой.';update_post_meta ($ post_id, '_ xxxx_attached_image', $ attach_id);

                        }

                    } else {//неправильный тип файла

                        $ upload_feedback = 'Загрузите только файлы изображений (jpg, gif или png).';
                        update_post_meta ($ post_id, '_ xxxx_attached_image', $ attach_id);

                    }

                } else {//Файл не передан

                    $ upload_feedback = false;

                }

                //Обновление метаданных с любой обратной связью
                update_post_meta ($ post_id, '_ xxxx_attached_image_upload_feedback', $ upload_feedback);

            ломать;

            по умолчанию:

        } //Конечный выключатель

    вернуть;

} //Конец, если флаг сохранения вручную

    вернуть;

}
add_action ( 'save_post', 'xxxx_update_post', 1,2);

Разрешения, права собственности и безопасность

Если у вас возникли проблемы с загрузкой, возможно, это связано с разрешениями. Я не эксперт по настройке сервера, поэтому, пожалуйста, поправьте меня, если эта часть неудобна.

Сначала убедитесь, что ваша папка wp-content /uploads существует и принадлежит apache: apache. Если это так, вы должны иметь возможность устанавливать разрешения на 744, и все должно работать. Собственность важна - даже установка perms на 777 иногда не поможет, если каталог не принадлежит должным образом.

Вы также должны рассмотреть возможность ограничения типов файлов, загруженных и выполняемых с использованием файла htaccess. Это не позволяет пользователям загружать файлы, которые не являются изображениями, и выполнять сценарии, замаскированные под изображения. Вероятно, вы должны сделать это для более авторитетной информации, но вы можете сделать простой тип файла, например:

<Files ^ (*. jpeg | * .jpg | * .png | * .gif)>
запретить порядок, разрешить
отказывать всем
& Lt; /& Файлы GT;
ответил MathSmath 23 22010vEurope/Moscow11bEurope/MoscowTue, 23 Nov 2010 03:28:22 +0300 2010, 03:28:22
0

Код, предоставленный @MathSmath, является правильным. Тем не менее, если вы обрабатываете много полей для загрузки или хотите загрузить несколько файлов, вам нужно его много изменить.

Кроме того, он не использует медиатеку WordPress для загрузки файлов (что делает всю грязную работу за сценой).

Я бы посоветовал вам взглянуть на плагин, например Meta Box . Плагин поддерживает оба способа загрузки файлов:

  • Через HTML5 input [type = "file"], который использует аналогичный код выше (см. docs ) и
  • Через библиотеку WordPress Media (см. документы ).

Это может помочь вам уменьшить усилия по написанию и обслуживанию кода, особенно если вы хотите создать несколько загрузок.

Отказ от ответственности: я являюсь автором Meta Box.

ответил rilwis 24 Jam1000000amWed, 24 Jan 2018 05:57:44 +030018 2018, 05:57:44

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132