Web サイト上に文章や画像などの何らかのコンテンツを表示する際、デフォルトでは表示をオフにしておきたい場合がある。表示のオン・オフを切り替えられるようにすることで長いテキストをすっきり見せたり、漫画や映画などのネタバレを防ぐ事ができる。
WordPress を利用しているのであれば Show-Hide / Collapse-Expand という拡張機能を利用すると、コンテンツの表示・非表示を切り替える機能を実装できる。
![](https://loumo.jp/wp/wp-content/plugins/simpleapplinks/images/loading001.gif)
使い方は簡単、プラグインをインストールしたらショートコード [bg_collapse] で隠したいコンテンツを囲うだけだ。
ショートコードにはオプションを指定でき、表示をテキストリンクではなくボタンにしたり、アイコンの有無や折り畳み表示のテキストを変更できる。例えば以下のように指定すると、折り畳みテキストを日本語で表示可能だ。
[bg_collapse icon="arrow" expand_text="表示する" collapse_text="閉じる"]
開閉の際にはアニメーションもついているので動作がわかりやすいと思う。アニメーションについては管理画面よりアニメーション速度の変更や jQuery UI を利用したエフェクトをつけることができる。
コンテンツの表示/非表示を変更したい場面というのはそれなりにあると思う。このプラグインならショートコードを書くだけで簡単に実装できる。便利なので、コンテンツの表示/非表示を切り替えたいのであれば試してみると良いと思う。
Sponsored Link
コメント