OtFm Gutenberg Spoiler — (or FAQ) collapse block

Описание

WordPress 5.0 представляет новый редактор блоков (кодовое имя «Gutenberg»), который предлагает новый опыт редактирования и создания контента.
Плагин предоставляет в редакторе блоков 2 типа спойлеров:

  • Little Spoiler
  • Box spoiler

Little Spoiler — маленький спойлер для обычного текста.

Box spoiler — состоит из 2 блоков:
Открывающий спойлер (Box Spoiler Start) и закрывающий спойлер (Box Spoiler End)
Между ними вы вставляете в редакторе блоков нужный блок (или множество блоков) с содержимым, которое вы хотите скрыть.

В фронтенде (внешняя часть сайта) спойлер (аккордеон) открывается с анимацией.
В редакторе (в админке гутенберг редактора) вы можете выбрать цветовой дизайн спойлера.

Возможность задать свой новый цвет или установить свою палитру (набор) цветов. Смотри FAQ

Нужно скрыть часть публикации? или вам нужен FAQ? — плагин идеально подходит для этого.

Зацените всю красоту и мощь плагина, просмотрев это видео:

Требования

PHP 5.6+, 7, 7.1, 7.2 или 7.3 рекомендованы, WordPress 5.5

Перевод

Доступен на английском, русском, испанском, шведском, голландском, японском и других языках в будущем.

Благодарности

Спасибо Nilo Velez за перевод на испанский (Испания).
Спасибо Yordan Soares за перевод на испанский (Венесуэла).
Спасибо Tor-Bjorn Fjellner за перевод на шведский.
Спасибо Peter Smits за перевод на голландский.

Скриншоты

  • Найти & добавить блоки спойлеров
  • Little spoiler
  • Box spoiler
  • В фронтенде
  • Открытый спойлер

Блоки

Этот плагин предоставляет 3 блока.

otfm/box-spoiler-start
OtFm Gutenberg Spoiler - (or FAQ) collapse block
otfm/box-spoiler-end
OtFm Gutenberg Spoiler - (or FAQ) collapse block
otfm/little-spoiler
OtFm Gutenberg Spoiler - (or FAQ) collapse block

Установка

  1. Закачайте папку otfm-gutenberg-spoiler в папку /wp-content/plugins/ или через админку файл otfm-gutenberg-spoiler.zip в «Плагины» — «Добавить новый» и укажите этот зип архив с вашего ПК.
  2. Активируйте OtFm Gutenberg Spoiler плагин в админке — на странице «Плагины».
  3. Используйте блоки OtFm Gutenberg Spoiler при написании контента через Гутенберг редактор.

Часто задаваемые вопросы

Поддержка доступности? Управление по клавише tab?

Да!
Навигация по клавише «Tab»:
Кнопка «Стрелка вверх» (UP arrow) — если фокус стоит на открытом спойлере, это закроет его
Клавиша «Стрелка вниз» (Down key) — если фокус стоит на закрытом спойлере, это откроет его
Или «Enter» клавиша, или «Space bar» (пробел) нажат — переключает состояние выбранного спойлера (если открыт — закроет, если закрыт — откроет его).
Кнопка «End» — перемещает фокус на последний спойлер на странице
Кнопка «Home» — перемещает фокус на первый спойлер на странице

Поддержка скрин ридеров (screen readers)

Как я могу скрыть несколько блоков?

  1. найди «Box Spoiler Start» и вставь (это откроет спойлер)
  2. блоки, блоки, блоки…
  3. найди «Box Spoiler End» и вставь (это закроет спойлер)

Как я могу добавить свой цвет?

Добавьте этот сниппет в ваш functions.php:

// add new colors to spoiler
function otfmgs_add_new_colors($colors){
    $colors[]= array( 'color' => '#bd4747', 'name' => 'my_brown' );
    $colors[]= array( 'color' => '#32dd94', 'name' => 'my_green' );
    //... etc

    return $colors;
}
add_filter('otfmgs_colors','otfmgs_add_new_colors');

где: #bd4747 — новый цвет в HEX-формате

результат: https://yadi.sk/i/223x_1-S3e_H1w

(доступно с версии плагина 1.4.0)

Как я могу заменить все цвета?

Добавьте этот сниппет в ваш functions.php:

// add my color palette to spoiler
function otfmgs_add_my_color_pallete($colors){
    $colors['new'][]= array( 'color' => '#bd4747', 'name' => 'my_brown' );
    $colors['new'][]= array( 'color' => '#32dd94', 'name' => 'my_green' );
    //... etc

    return $colors;
}
add_filter('otfmgs_colors','otfmgs_add_my_color_pallete');

где: #bd4747 — новый цвет в HEX-формате

результат : https://yadi.sk/i/Fv7BaxRLkjj_SA

(доступно с версии плагина 1.4.0)

Какие вордпресс темы работают с OtFm Gutenberg Spoiler?

Любая правильно разработанная тема WordPress будет работать с OtFm Gutenberg Spoiler

Как найти блок спойлера?

  1. Переходите в новый редактор блоков (добавить новую запись)
  2. Нажмите «Добавить блок»
  3. «Поиск блоков» ищите «спойлер» или «spoiler» или «otfm» или «faq»

Бесплатен ли OtFm Gutenberg Spoiler?

Да! Основные функции OtFm Gutenberg Spoiler абсолютно бесплатны.

Где я могу попросить о помощи?

Напишите мне: Otshelnik-Fm@yandex.ru

Отзывы

08.09.2020
Easy to use spoiler plugin (to show or hide content-blocks as an accordion). Simple styled title row with heading, showing or hiding the complete following content-block or only a chunk of text. Looks well in desktop and mobile mode. (For better adaption of different website-designs it would be great if the color of the used borders for title-box and expanded content-box could be easily set via custom CSS code 😉
16.09.2019
The most important feature for me was the box spoiler feature. After testing a little bit I can say that everything works fine! 🙂 Maybe you could implement custom colors into GUI.
20.09.2018
This is hands down the best spoiler plugin for Gutenberg. It comes with 2 options to choose from: a simple spoiler for text only, and 2-piece spoiler which can be used with any blocks. The way it works is very simple, yet very effective. You just add some Gutenberg blocks between a START SPOILER and END SPOILER blocks, and you get a very good looking dropdown. Very happy with the plugin!
Посмотреть все 4 отзыва

Участники и разработчики

«OtFm Gutenberg Spoiler — (or FAQ) collapse block» — проект с открытым исходным кодом. В развитие плагина внесли свой вклад следующие участники:

Участники

«OtFm Gutenberg Spoiler — (or FAQ) collapse block» переведён на 11 языков. Благодарим переводчиков за их работу.

Перевести «OtFm Gutenberg Spoiler — (or FAQ) collapse block» на ваш язык.

Заинтересованы в разработке?

Посмотрите код, проверьте SVN репозиторий, или подпишитесь на журнал разработки по RSS.

Журнал изменений

2020-08-16

v1.5.1
* Изменен Text Domain на слаг плагина

2020-08-13

v1.5.0
* Добавлена поддержка WordPress 5.5

2019-04-11

v1.4.0
* Новый фильтр: otfmgs_colors — Позволяет добавить свой цвет или поменять палитру своим набором. Смотри FAQ

2019-02-22

v1.3.3
* совместимость с WordPress v5.1

2019-01-18

v1.3.2
* что-то в репо заглючило, перезалил

2019-01-18

v1.3.1
* Переименовал файлы min.js & min.css

2019-01-16

v1.3.0
* Поддержка доступности
Навигация по клавише «Tab»:
Кнопка «Стрелка вверх» (UP arrow) — если фокус стоит на открытом спойлере, это закроет его
Клавиша «Стрелка вниз» (Down key) — если фокус стоит на закрытом спойлере, это откроет его
Или «Enter» клавиша, или «Space bar» (пробел) нажат — переключает состояние выбранного спойлера (если открыт — закроет, если закрыт — откроет его).
Кнопка «End» — перемещает фокус на последний спойлер на странице
Кнопка «Home» — перемещает фокус на первый спойлер на странице

Поддержка скрин ридеров (screen readers)

2018-12-07

v1.2.0
* совместимость с WordPress v5.0.0

2018-11-30

v1.1.1
* Совместимость с Gutenberg v4.6.0

2018-11-30

v1.1.0
* Совместимость с Gutenberg v4.5.1

2018-11-17

v1.0.9
* Совместимость с Gutenberg v4.4.0

2018-11-15

v1.0.8
* Поддержка Gutenberg v4.3.0

2018-11-08

v1.0.7
* Поддержка Gutenberg v4.2.0

2018-10-26

v1.0.6
* fix cover block ломал спойлер
* Совместимость с Gutenberg v4.1.1

2018-10-25

v1.0.5
* Совместимость с гутенберг v4.1.0
* Небольшой css-фикс стилей в редакторе

2018-10-06

v1.0.4
* Поддержка Gutenberg 3.9.0
* Fix содержимое контента спойлера на apple safari

2018-09-20

v1.0.3
* Поддержка Гутенберг 3.8.0
* Убрал строки которые не нужно переводить (имена собственные)
* Добавил подсказки в файл переводов (для translate.wordpress.org)

2018-09-12

v1.0.2
* add php file only for service translate.wordpress.org

2018-09-12

v1.0.1
* Small css fix

2018-09-08

v1.0.0
* Release