Title: OtFm Gutenberg Spoiler &#8211; (or FAQ) collapse block
Author: Vova Druzhaev
Published: <strong>September 12, 2018</strong>
Last modified: January 15, 2023

---

Search plugins

![](https://ps.w.org/otfm-gutenberg-spoiler/assets/banner-772x250.png?rev=1940153)

This plugin **hasn’t been tested with the latest 3 major releases of WordPress**.
It may no longer be maintained or supported and may have compatibility issues when
used with more recent versions of WordPress.

![](https://ps.w.org/otfm-gutenberg-spoiler/assets/icon-256x256.png?rev=1940153)

# OtFm Gutenberg Spoiler – (or FAQ) collapse block

 By [Vova Druzhaev](https://profiles.wordpress.org/otshelnik-fm/)

[Download](https://downloads.wordpress.org/plugin/otfm-gutenberg-spoiler.zip)

 * [Details](https://wordpress.org/plugins/otfm-gutenberg-spoiler/#description)
 * [Reviews](https://wordpress.org/plugins/otfm-gutenberg-spoiler/#reviews)
 *  [Installation](https://wordpress.org/plugins/otfm-gutenberg-spoiler/#installation)
 * [Development](https://wordpress.org/plugins/otfm-gutenberg-spoiler/#developers)

 [Support](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/)

## Description

WordPress 5.0 introduces a block-based editor (codename “Gutenberg”) that offers
a streamlined editing experience.
 The plugin provides in the block editor 2 types
of spoilers:

 * Little Spoiler
 * Box spoiler

Little Spoiler – small spoiler for plain text.

Box spoiler – consists of 2 blocks:
 Opening spoiler (Box Spoiler Start) and closing
spoiler (Box Spoiler End) Between them, you insert any block (or several block’s)
with content that you want to hide.

In the frontend, the spoiler (accordion) opens with animation.
 In the editor you
can choose the color design of the spoiler.

Ability to add new colors or replace a set of colors. See FAQ

Want to hide part of the publication? or make up the FAQ? – plugin is perfect for
this

Check out all beauty and power of the plugin by watching this video:

### Requirements

PHP 7.4, 8.0+ recommended for better performance, WordPress 6.1

#### Translation

Available in English, Russian, Ukrainian, Spanish, German, Swedish, Dutch, Japanese,
French, Italian, Norwegian, Portuguese, Chinese and more other languages in becoming.

#### Acknowledgements

Thanks to [Nilo Velez](https://profiles.wordpress.org/nilovelez/) for Spanish (Spain)
translation approval.
 Thanks to [Yordan Soares](https://profiles.wordpress.org/yordansoares/)
for Spanish (Venezuela) translation. Thanks to [Tor-Bjorn Fjellner](https://profiles.wordpress.org/tobifjellner/)
for Swedish translation approval. Thanks to [Peter Smits](https://profiles.wordpress.org/psmits1567/)
for Dutch translation approval. Thanks to [miccweb](https://profiles.wordpress.org/miccweb/)
for Japanese translation approval. Thanks to [FX Bénard](https://profiles.wordpress.org/fxbenard/)
for French (France) translation approval. Thanks to [Luisa Ravelli](https://profiles.wordpress.org/darkavenger/)
and [aliceorru](https://profiles.wordpress.org/aliceorru/) for Italian translation
approval. Thanks to [Eivind](https://profiles.wordpress.org/meinmycell/) for Norwegian(
Nynorsk) translation approval. Thanks to [Pedro Mendonça](https://profiles.wordpress.org/pedromendonca/)
for Portuguese (Portugal) translation approval. Thanks to [Sergey Kovalets](https://profiles.wordpress.org/sergeykovalets/)
for Ukrainian translation. Thanks to [Jens Ratzel](https://profiles.wordpress.org/jensratzel/)
for German translation. Thanks to [Alex Lion](https://profiles.wordpress.org/alexclassroom/)
for Chinese (Taiwan) translation. Thanks to [Pieterjan Deneys](https://profiles.wordpress.org/nekojonez/)
for Dutch (Belgium) translation.

## Screenshots

[⌊Find & add spoiler blocks⌉⌊Find & add spoiler blocks⌉[

Find & add spoiler blocks

[⌊Little spoiler⌉⌊Little spoiler⌉[

Little spoiler

[⌊Box spoiler⌉⌊Box spoiler⌉[

Box spoiler

[⌊In frontend⌉⌊In frontend⌉[

In frontend

[⌊Open spoiler⌉⌊Open spoiler⌉[

Open spoiler

## Blocks

This plugin provides 3 blocks.

 *   Box Spoiler Start
 *   Box Spoiler End
 *   Little Spoiler

## Installation

 1. Upload the `otfm-gutenberg-spoiler` folder to your `/wp-content/plugins/` directory
    or alternatively upload the otfm-gutenberg-spoiler.zip file via the plugin page
    of WordPress by clicking ‘Add New’ and selecting the zip from your computer.
 2. Activate the OtFm Gutenberg Spoiler WordPress plugin through the ‘Plugins’ menu
    in WordPress.
 3. Use OtFm Gutenberg Spoiler blocks on your next page or post.

## FAQ

### Accessibility support? Navigation by tab?

Yes!
 Navigation by “Tab” button: The “Up arrow” key pressed – If the focused spoiler
is open, you close it The “Down arrow” key pressed – If the focused spoiler is closed,
you open it Either the “Enter” key or “Space bar” pressed – You toggle the focused
spoiler. If it is open, close it; if it is closed, open it. The “End” key pressed–
You move focus to the last spoiler on the page The “Home” key pressed – You move
focus to the first spoiler on the page

Support screen readers

### How can I close a lot of blocks?

 1. find “Box Spoiler Start” and paste (spoiler open)
 2. blocks, blocks, blocks…
 3. find “Box Spoiler End” and paste (this spoiler closed)

### How can I add my own color?

Add this snippet to your file 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');
    ```

where: #bd4747 – new hex color

result: https://yadi.sk/i/223x_1-S3e_H1w

(available from plugin version 1.4.0)

### How to replace colors with your own set?

Add this snippet to your file 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');
    ```

where: #bd4747 – new hex color

result: https://yadi.sk/i/Fv7BaxRLkjj_SA

(available from plugin version 1.4.0)

### What WordPress themes work with OtFm Gutenberg Spoiler?

Any properly developed WordPress theme will work with OtFm Gutenberg Spoiler

### How do I find the spoiler block?

 1. Go to the block editor (add new post)
 2. Click “insert block”
 3. Search for a block “spoiler” or “otfm” or “faq”

### Is OtFm Gutenberg Spoiler free?

Yes! OtFm Gutenberg Spoiler core features are absolutely free.

### Where can I ask for help?

Write me Otshelnik-Fm@yandex.ru

## Reviews

![](https://secure.gravatar.com/avatar/3f4fd1f1b30416b7aca6979e726278b889b92bfcfee7459a564564dc7486097f?
s=60&d=retro&r=g)

### 󠀁[⭐⭐⭐⭐⭐ Очень удобно для Gutenberg](https://wordpress.org/support/topic/%e2%ad%90%e2%ad%90%e2%ad%90%e2%ad%90%e2%ad%90-%d0%be%d1%87%d0%b5%d0%bd%d1%8c-%d1%83%d0%b4%d0%be%d0%b1%d0%bd%d0%be-%d0%b4%d0%bb%d1%8f-gutenberg/)󠁿

 [denysoftru](https://profiles.wordpress.org/denysoftru/) April 29, 2021 1 reply

⭐⭐⭐⭐⭐ Спасибо автору за плагин, альтернатив для Gutenberg не нашёл. Плагин 
работает хорошо, форматировать уже имеющийся текст очень удобно. Автор ответил на
мой вопрос на форуме и помог с кастомизаций плагина под сайт.

![](https://secure.gravatar.com/avatar/4c98c8332bd0e19fd3f03bc8da5335c170fba217f6f945fa64e00938f862d2a5?
s=60&d=retro&r=g)

### 󠀁[Very useful spoiler plugin](https://wordpress.org/support/topic/very-useful-spoiler-plugin/)󠁿

 [Jens](https://profiles.wordpress.org/jroggemann/) September 8, 2020 1 reply

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 😉

![](https://secure.gravatar.com/avatar/ca8fd6cf836a9585f2ef07384a8be1b11fa40b02e2496514274b9192a7648d07?
s=60&d=retro&r=g)

### 󠀁[Great, but one thing…](https://wordpress.org/support/topic/great-but-one-thing/)󠁿

 [winkli](https://profiles.wordpress.org/winkli/) September 16, 2019 3 replies

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.

![](https://secure.gravatar.com/avatar/5bfb3dbe47a382dd9b69cdee45002e1365eeaac43eae980dcad04576f63caa5e?
s=60&d=retro&r=g)

### 󠀁[Great, simple little plugin](https://wordpress.org/support/topic/great-simple-little-plugin/)󠁿

 [kacper3355](https://profiles.wordpress.org/kacper3355/) December 16, 2018 1 reply

The best spoiler plugin ever. Please keep up the good work and then eventually it
will get more popular 🙂 Thank you!

![](https://secure.gravatar.com/avatar/af9e6d23c424ada4169f7f5c023a862d3c2a3bded761b4af8c1a1f740a1b5c14?
s=60&d=retro&r=g)

### 󠀁[Best spoiler plugin for Gutenberg](https://wordpress.org/support/topic/best-spoiler-plugin-for-gutenberg/)󠁿

 [logaritym](https://profiles.wordpress.org/logaritym/) September 20, 2018 1 reply

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!

 [ Read all 5 reviews ](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/reviews/)

## Contributors & Developers

“OtFm Gutenberg Spoiler – (or FAQ) collapse block” is open source software. The 
following people have contributed to this plugin.

Contributors

 *   [ Vova Druzhaev ](https://profiles.wordpress.org/otshelnik-fm/)

“OtFm Gutenberg Spoiler – (or FAQ) collapse block” has been translated into 16 locales.
Thank you to [the translators](https://translate.wordpress.org/projects/wp-plugins/otfm-gutenberg-spoiler/contributors)
for their contributions.

[Translate “OtFm Gutenberg Spoiler – (or FAQ) collapse block” into your language.](https://translate.wordpress.org/projects/wp-plugins/otfm-gutenberg-spoiler)

### Interested in development?

[Browse the code](https://plugins.trac.wordpress.org/browser/otfm-gutenberg-spoiler/),
check out the [SVN repository](https://plugins.svn.wordpress.org/otfm-gutenberg-spoiler/),
or subscribe to the [development log](https://plugins.trac.wordpress.org/log/otfm-gutenberg-spoiler/)
by [RSS](https://plugins.trac.wordpress.org/log/otfm-gutenberg-spoiler/?limit=100&mode=stop_on_copy&format=rss).

## Changelog

[Full Changelog](https://github.com/Otshelnik-Fm/otfm-gutenberg-spoiler#changelog)

## Meta

 *  Version **1.5.4**
 *  Last updated **3 years ago**
 *  Active installations **600+**
 *  WordPress version ** 6.1.0 or higher **
 *  Tested up to **6.1.10**
 *  PHP version ** 8.0 or higher **
 *  Languages
 * [Chinese (Taiwan)](https://tw.wordpress.org/plugins/otfm-gutenberg-spoiler/),
   [Dutch](https://nl.wordpress.org/plugins/otfm-gutenberg-spoiler/), [Dutch (Belgium)](https://nl-be.wordpress.org/plugins/otfm-gutenberg-spoiler/),
   [English (US)](https://wordpress.org/plugins/otfm-gutenberg-spoiler/), [French (France)](https://fr.wordpress.org/plugins/otfm-gutenberg-spoiler/),
   [German](https://de.wordpress.org/plugins/otfm-gutenberg-spoiler/), [Italian](https://it.wordpress.org/plugins/otfm-gutenberg-spoiler/),
   [Japanese](https://ja.wordpress.org/plugins/otfm-gutenberg-spoiler/), [Norwegian (Nynorsk)](https://nn.wordpress.org/plugins/otfm-gutenberg-spoiler/),
   [Portuguese (Portugal)](https://pt.wordpress.org/plugins/otfm-gutenberg-spoiler/),
   [Russian](https://ru.wordpress.org/plugins/otfm-gutenberg-spoiler/), [Spanish (Argentina)](https://es-ar.wordpress.org/plugins/otfm-gutenberg-spoiler/),
   [Spanish (Chile)](https://cl.wordpress.org/plugins/otfm-gutenberg-spoiler/), 
   [Spanish (Spain)](https://es.wordpress.org/plugins/otfm-gutenberg-spoiler/), 
   [Spanish (Venezuela)](https://ve.wordpress.org/plugins/otfm-gutenberg-spoiler/),
   [Swedish](https://sv.wordpress.org/plugins/otfm-gutenberg-spoiler/), and [Ukrainian](https://uk.wordpress.org/plugins/otfm-gutenberg-spoiler/).
 *  [Translate into your language](https://translate.wordpress.org/projects/wp-plugins/otfm-gutenberg-spoiler)
 * Tags
 * [blocks](https://wordpress.org/plugins/tags/blocks/)[frequently asked questions](https://wordpress.org/plugins/tags/frequently-asked-questions/)
   [gutenberg](https://wordpress.org/plugins/tags/gutenberg/)[gutenberg blocks](https://wordpress.org/plugins/tags/gutenberg-blocks/)
   [spoiler](https://wordpress.org/plugins/tags/spoiler/)
 *  [Advanced View](https://wordpress.org/plugins/otfm-gutenberg-spoiler/advanced/)

## Ratings

 5 out of 5 stars.

 *  [  5 5-star reviews     ](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/reviews/?filter=5)
 *  [  0 4-star reviews     ](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/reviews/?filter=4)
 *  [  0 3-star reviews     ](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/reviews/?filter=3)
 *  [  0 2-star reviews     ](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/reviews/?filter=2)
 *  [  0 1-star reviews     ](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/reviews/#new-post)

[See all reviews](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/reviews/)

## Contributors

 *   [ Vova Druzhaev ](https://profiles.wordpress.org/otshelnik-fm/)

## Support

Got something to say? Need help?

 [View support forum](https://wordpress.org/support/plugin/otfm-gutenberg-spoiler/)

## Donate

Would you like to support the advancement of this plugin?

 [ Donate to this plugin ](https://money.yandex.ru/to/41001526199072)