Spoilers in the layout of web pages are used to visually hide part of the voluminous text, image or any other page content behind a link. To make a spoiler in Joomla, use a special plugin.
Instructions
Step 1
In the Joomla add-ons directory, find and install the Core Design Spoiler plugin. To work correctly, you will also need the Core Design Scriptegrator plugin, which will automatically load JS libraries (Highslide, jQuery, and others). After installation, enable both add-ons via the Plugin Manager.
Step 2
Now you can add a spoiler with hidden content by wrapping it in the [spoiler] tag. Such a tag can be added not only to regular Joomla articles, but also to the materials of the catalog components, for example, in K2, ZOO, FLEXIcontent, etc.
Step 3
Select the way the spoiler is displayed in the plugin settings. It can be either a simple link or a button. Also specify the condition under which the spoiler will open - when you click or hover the cursor.
Step 4
In addition to the specified method, any of the parameters can be specified manually, in the [spoiler] tag. The spoiler can be set with the element parameter, specifying the link value for displaying as a link, or button for a button.
Step 5
The action at which the spoiler will be revealed can be designated through the action parameter, for which there are valid values of hover (on hover) or click (on click). A unique spoiler title can be created using the Title parameter, specifying the required value in quotes.
Step 6
For example, if you need to make a spoiler with the title "Read the continuation of the story", which will be opened by clicking on the link with the title text, use the following tag: [spoiler title="Read the continuation of the story" action = "click" element = "link"]
Step 7
After this tag, place the text or image you want to hide, and then "close" the spoiler with the tag: [/spoiler]
