Hide or Toggle

The Hide or Toggle plugin is an intuitive and useful plugin that provides three blocks: Simple Hide , Simple Toggle and Simple Blocks.

gif file displays how the Hide or Toggle plugin blocks work.
Demostració de ‘Hide or Toggle’ blocs

Simple Hide

The Simple Hide block is easy to use and contains two paragraphs: the title and the content. On the frontend, it displays a plus icon and and a title, with the content hidden by default. Upon clicking the plus icon, the content is shown and a minus icon is displayed to the left of the plus icon. From this point, you can hide the content by clicking the minus icon. There are three different styles for the Simple Hide block to choose from: default, expanded, and compact. See an example below:

Example of Simple Hide block

You may use the Simple Hide Block in isolation or stacked as a FAQ or a frequently answered questions page.

Here the block is used as a FAQ page

Working Examples

Even tough this block is very simple, it has three different styles. Use the default style example below:

This is the title. A question for example.

Now, try the expanded style example. Click on the plus icon to display the content:

This is the title. A question for example.

Finally the compact style example. Click on the plus icon to display the content:

This is the title. A question for example.

Simple Toggle

The second block is the Simple Toggle block and operates similarly to the Simple Hide block. In the Simple Toggle block there is no icon and the title is clicked to toggle the content (show or hide). As the Simple Hide block, the Simple Toggle offers three styles to choose from (default, compact, and expanded) and two toggle speeds (slow and fast). The text and the background colors can be changed. Try out the working examples below to see the different styles and different speeds in action.

Content is hidden. or closed.
Content is shown or opened.

Working Examples

Try the working examples below. This is the default style for the Simple Toggle. The default style has only margin at the top. It takes text color and background colors from the present theme styles:

This line toggles the content below

This is the compact style. Veru low margin at the top with a different background color.

This line toggles the content below

This is the expanded style. More margin and padding and , also, a different background color:

This line toggles the content below

You can pick any color for text color and background color. Below, a compact style with a different background color and ‘Fast’ toggle speed:

This line toggles the content below

Simple Toggle settings

Simple Toggle styles and colors settings

Simple Blocks

A third block is the Simple Blocks block. It’s a more extendable block because it can contain blocks in the content. Here below you can see a Working example:

Click this title to open the content below.
  • Revisa els plugins de WordPress amb PHP CodeSniffer i els WordPress Coding Standards a Windows utilizant XAMPP i Composer

    Si vols fer una extensió per a WordPress et pot ser útil revisar-la seguint els estàndards de WordPress. A Windows no és gaire senzill perquè cal instal·lar diversos programaris amb unes quantes configuracions manuals. Si la teva instal·lació és Windows 10. El primer que et cal és disposar de PHP instal·lat en el path de […]

  • Utilitza el customizer a WordPress amb blocs

    En el tema de WordPress Twenty-Twenty-Three dessapareix el ‘Customizer’ que hi havia en versions anteriors. El pots cridar directament des de la barra del navegador afegint el següent codi al final de la url del teu lloc : Malgrat que potser el resultat, en temes preparats per blocs, és decebedor, encara es poden entrar uns […]

  • Creació ràpida de nous temes a WordPress amb el plugin Create Block Theme

    WordPress ha creat un plugin per facilitar la creació de nous temes de manera molt ràpida. Pots, per exemple, agafar un tema com el Twenty-Twenty-Three i després fer-ne un tema fill del tema principal (child theme) o clonar-lo. També et permet crear un tema des de zero amb un tema en blanc. Crea un tema […]

Som 60% aigua