Помогите в создании слайд-шоу пользовательского типа поста с помощью пользовательских мета-блоков?

16

Мне нужно создать собственный мета-блок (-ы) для моего типа поста «Слайд-шоу» (этот тип поста уже создан). Каждый метабокс будет содержать содержимое каждого слайда слайда и сохранять его в соответствующих настраиваемых полях. Каждый метабокс должен содержать следующие поля:

  • Заголовок (текстовое поле)
  • Изображение (Либо текстовое поле для URL-адреса img, либо, в идеале, раскрывающийся список, показывающий миниатюры изображений, прикрепленных к сообщению)
  • Код для вставки (текстовая область)
  • Описание (wysiwyg)
  • Скрыть слайд (флажок, используемый для временного скрытия слайда без его удаления)
  • Удалить слайд (кнопка, которая удаляет содержимое мета полей публикации, которые были заполнены этим слайдом)

Я также хотел бы, чтобы где-то была кнопка, которая позволяет мне «Добавить слайд», поэтому при нажатии на него добавляется еще один «Пользовательский» мета-бокс «Слайд», который является дубликатом первого, но добавляет добавочное число к каждому пользовательскому мета-полю поста. В настоящее время у меня есть только 15 метабоксов, и шаблон слайд-шоу настроен таким образом, что если заполнены только 5 метабоксов, отображаются только 5 слайдов.

Наконец, я хотел бы иметь возможность переупорядочивать слайды с помощью «Перетаскивания» или другого текстового поля, в которое я могу ввести номер заказа.

Я получил его почти там, где он мне нужен, с помощью плагина «Больше полей» и некоторой справки по коду от Rarst. С плагином «Больше полей» у меня есть следующие поля в каждом метабоксе:

  • Заголовок (текстовое поле)
  • Изображение (выпадающий список изображений, прикрепленных к сообщению)
  • Код для вставки (текстовая область)
  • Описание (wysiwyg)
  • Скрыть слайд (флажок, используемый для временного скрытия слайда без его удаления)

Вот скриншот того, как я его настраивал через плагин «Больше полей»:

альтернативный текст

Проблема в том, что невозможно удалить слайд после его создания, потому что «Больше полей» нигде не используется <?php delete_post_meta($post_id, $key, $value); ?>. Другая проблема с плагином заключается в том, что он слишком ненадежен и часто ломается с обновлениями.

Мне удалось реализовать подобное решение с моими собственными настраиваемыми метабоксами, которые включают в себя:

  • Заголовок (текстовое поле)
  • Изображение (текстовое поле для URL img)
  • Код для вставки (текстовая область)
  • Описание (текстовая область)
  • Скрыть слайд (флажок, используемый для временного скрытия слайда без его удаления)

С этой реализацией я не могу заставить работать несколько полей TinyMCE или выпадающий список изображений. Код TinyMCE кажется работать , пока я не добавить код, создавать инкрементные копии первого METABOX в этот момент я получаю это право ошибки над полем , где кнопки TinyMCE должны быть: Warning: array_push() [function.array-push]: First argument should be an array....

Кроме того, прямо сейчас я полагаюсь, что мои авторы знают, чтобы вставить ЛЮБОЕ видео или изображение для каждого слайда, и это нормально, но может быть лучше иметь переключатель, который позволит им выбрать, какой из слайдов (вероятно, по умолчанию изображение), которое связано с условным оператором отображения в шаблоне слайд-шоу.

Я занимаюсь загрузкой изображений через встроенное поле «Featured Image» на боковой панели, хотя я не возражаю против пользовательского метабокса, в котором просто говорится «Upload Images» в верхней части панели записи.

В конечном итоге я ищу слайд-шоу, похожее на это: http://www.nytimes.com/slideshow/2010/08/10/science/20100810angier-1.html . Я хочу, чтобы мой также мог иметь видео в качестве содержимого на слайде вместо изображения. Мне нужна интуитивно понятная и простая в использовании панель администратора для моих авторов (они не очень технически подкованы и не надежны при использовании html и / или коротких кодов). На всякий случай, если из примера не ясно, каждый слайд должен генерировать новый просмотр страницы.

Переупорядочение Drag'n'Drop не является высоким приоритетом, но было бы здорово. Я нашел плагин, который действительно хорошо справляется с этим: SlideDeck . К сожалению, плагин не соответствует моим потребностям, но способ, которым они обрабатывают порядок слайдов, довольно приятный. Это отдельный метабокс в боковой панели, который позволяет перетаскивать слайды в нужном вам порядке. Это также, как вы добавляете слайды, нажимая кнопку «Добавить слайд», которая добавляет еще один Metabox для слайдов на панель записи. Вот скриншот:

альтернативный текст

Вы также можете увидеть больше скриншотов в действии в репозитории WordPress .

Вот весь мой код:

Функции, настраивающие мой тип публикации слайд-шоу и нумерацию слайд-шоу: http://loak.pastebin.com/g63Gf186

Оригинальный код от DeluxeBloggingTips.com (DBT), на котором я основал свои метабоксы: http://loak.pastebin.com/u9YTQrxf

Версия кода DBT, которую я изменил, чтобы дать мне инкрементные версии одного и того же метабокса: http://loak.pastebin.com/WtxGdPrN

Модифицированная версия кода DBT, созданная Крисом Бербриджем для нескольких экземпляров TinyMCE: http://loak.pastebin.com/Mqb3pKhx С этим кодом работают TinyMCE.

Моя модификация кода Бербриджа, которая пытается включить мое увеличение и поле, которое позволяет вам выбрать изображение из выпадающего списка всех изображений, прикрепленных к сообщению: http://loak.pastebin.com/xSuenJTK В этой попытке TinyMCE сломан и выпадающий не работает.

Это, вероятно, не имеет значения, но на случай, если вам интересно, вот код, который я использую для извлечения кода встраивания из пользовательской мета-записи, изменения его размера и вставки в сообщение: http://loak.pastebin.com / n7pAzEAw

Это отредактированная версия исходного вопроса, отражающая текущее состояние проекта и отвечающая на вопросы, размещенные в комментариях. Спасибо Chris_O за то, что вы получили награду за это. Кроме того, спасибо Rarst и Джастину за помощь в решении многих вопросов на форуме ThemeHybrid.com . Я потратил много часов на это и застрял (я провел пару часов один в этом вопросе). Любая помощь будет принята с благодарностью.

матовый
источник
Можете ли вы нарисовать простое изображение, которое показывает всю картину, как эскиз или так? Я думаю, что это полезно, чтобы лучше понять ваши потребности.
Хакре
Я добавил несколько примеров внизу. Если это не проясняет ситуацию, дайте мне знать.
Мэтт
Это все еще не ясно?
Мэтт
Кто-нибудь? Эта вещь включена?
Мэтт
@ Хакре, ты там?
Мэтт

Ответы:

6

Судя по всему, самая безопасная ставка и самый простой путь - это раскрутить плагин More Fields специально для вашего использования. Две самые важные функции, которые, как я вижу, нужны вашей вилке, - это поле «фабрика» и интерфейс перетаскивания.

Несколько полей

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

Это основа работы нескольких виджетов на боковой панели:

  • Вы определяете код для каждого виджета один раз, расширяя WP_Widgetкласс.
  • Затем вы можете создать столько копий виджета, сколько захотите.
    • Специфика каждого виджета хранится в виде сериализованных данных в таблице параметров.
  • Вы можете настроить каждый виджет, удалить их с помощью простой deleteкоманды и установить их расположение явно через интерфейс перетаскивания Appearance

Перетащите и падение

Еще раз, я предлагаю обратиться к системе виджетов WordPress для вдохновения. У нас уже есть довольно интуитивно понятный интерфейс перетаскивания, так что было бы довольно легко переназначить большую часть того же кода в другом месте. Или, если вы хотите стать действительно модным, вы можете реализовать свою собственную систему перетаскивания в отдельном настраиваемом метаполе.

Таким образом, каждый слайд будет определяться пользовательским мета-блоком, который связан с постом. Порядок слайдов будет установлен отдельным мета-блоком, который также связан с постом. Я бы порекомендовал отправлять обновления слайдов через AJAX, чтобы вы могли динамически обновлять мета-поле порядка слайдов на основе информации (это предотвращает необходимость вручную нажимать кнопку «обновить» и ждать перезагрузки страницы, прежде чем перемещать объекты).

Пользовательский интерфейс jQuery имеет отличный « перетаскиваемый » интерфейс, которым вы можете легко манипулировать для своих целей в этом пользовательском метабоксе. Сложная часть заключается не в построении интерфейса, а в согласованном и точном взаимодействии между мета-блоком и коллекцией мета-блоков слайдов в другом месте на странице.

В итоге

Из вашего поста я понял, что у вас есть несколько приемлемое решение:

  • Вы добавили 15 настраиваемых полей в свой тип записи через виджет Больше полей, но хотите динамически добавлять / удалять поля, а не работать с заданным числом
  • Вы хотите настроить порядок этих пользовательских полей так, чтобы слайды загружались по порядку

Для этого я бы абстрагировал процесс создания пользовательской мета от класса, который можно использовать снова и снова для создания новых пользовательских полей мета. Затем я расширил бы класс, чтобы инициализировать два типа мета-блоков: один для слайдов, один для структуры слайдов. Я бы также встроил в мета-блок структуры слайдов возможность динамически создавать новые мета-блоки слайдов (мета-блоки слайдов содержали бы собственное действие «удалить»).

Весь слайд - шоу будет храниться не в слайде мете коробке, но мета поля структуры слайда в поле пользовательской меты для поста - пользовательская мета будет неровный массивом, причем каждый из слайдов представлена в виде массивов внутри нее - в заказ . Настройка порядка показа слайдов в мета-поле структуры приведет к реорганизации массива и повторному сохранению мета-записи. Таким образом, у меня есть только 1 мета-значение для чтения, когда я хочу получить доступ к слайд-шоу.

Между SlideDeck, More Fields и пользовательским кодом, который вы уже собрали, у вас уже есть большая часть вашего решения ... вам просто нужно, чтобы все это работало вместе в одно и то же время. Я бы сосредоточился на том, чтобы сначала получить корневую реализацию, прежде чем добавлять украшения JavaScript - динамическое создание, изменение, сохранение и удаление слайдов важнее, чем редактор форматированного текста IMO. Получите это сначала. Тогда отключите систему заказов. Затем вы можете сосредоточиться на получении нескольких экземпляров TinyMCE, работающих на странице.

EAMann
источник
Спасибо за помощь! На данный момент это немного из моего набора навыков, но послужит хорошим ориентиром в процессе обучения. Я знаю о «классах» и понимаю, что уже использую класс в коде метабоксов, но все еще не понимаю их. Другая вещь, о которой я «осведомлен», но не до конца понимаю, это использование массивов.
Мэтт
Ваш совет о том, как сначала разобраться с основами, имеет смысл, но я сталкиваюсь с некоторыми реальными ограничениями, которые требуют, чтобы я включил это в производственную среду как можно скорее, и одним из наиболее важных факторов является редактор wysiwyg, потому что многие из авторов очень нетехнические , Я не возражаю против того, чтобы сделать проект постепенным и полагаться на костыли, но этот подход, очевидно, должен быть масштабируемым. Тем не менее, мне кажется, что использование плагина «Больше полей» может служить временным решением, пока я не выясню это, однако я не уверен, что это будет работать с ...
Мэтт
Ваш подход сохранения всего слайд-шоу в одном настраиваемом поле. Вы действительно думаете, что лучше все это поместить в одну область? Это может показаться невежественным, но мне кажется, что существует гораздо больше возможностей для ошибок, если wp должен переписывать весь слайд-шоу каждый раз, когда вносятся незначительные изменения.
Мэтт
Сохранение всего шоу в одном мета-поле предотвращает и создает проблемы. Это экономит время на сайте презентации, не заставляя вас выбирать, читать и проходить по нескольким полям. Однако, если что-то ломается на одном слайде и записывается в БД, это ломает весь слайд-шоу. Определенно компромисс, но я всегда выбираю скорость и простоту разработки.
EAMann
Вы говорите, что это экономит время на передней части сайта? С чего бы это, если он показывает только один слайд за раз?
Мэтт