WP UI – Tabs, Accordions, Sliders

WP UI – Tabs, Accordions, Sliders
機能が満載。
コンテンツ内にTABコンテンツを搭載する機能。普通に文章を書くだけでなく、他のPOSTや固定ページを引っ張ってくることもできる。

[ wptabs style=”wpui-achu” ]


TAB


TAB機能。
[ Wrap tabs ]ボタンで概要を作成し、[ Add tab ]ボタンでタブを追加していく。
styleを40種類ぐらいから選択することができる。
ここで使っているのは「wpui-achu」。

Accordion


[ wptabs ]に「type=”accordion”」を指定することでアコーディオン形式にすることができる。

Spoiler


[ wptabs ]とは別に[ wpspoiler ]がある。
[ wpspoiler name=”Spoiler Test1″ ]Spoiler Test 1[ /wpspoiler ]
のようにwpspoilerで囲むことでアコーディオンの単発版を出すことができる。
openオプションにtrue/falseを指定することで初期状態を開いている/閉じている、それぞれを指定することができる。
デフォルトはfalse。

Spoiler Title 1

Spoiler Content 1

Spoiler Title 2

Spoiler Content 2


Dialog


[ wptabs ]とは別に[ wpdialog ]もある。
これをコンテンツのどこかに書いておくことでページを開いた時に画面中央にダイアログを出すことができる。
出せるのはJavaScriptでいうところのAlert。Confirmではない。
このページを開いた時に出てきたアラートのshortcodeは

[ wpdialog title="alert" show="drop" hide="explode" ] wpdialogを使用することでアラートを出すことができます。 [ /wpdialog ]


Feeds


[ wptabs ]とは別に[ wpuifeeds ]もある。
[ wpuifeeds url=”http://feeds.reuters.com/reuters/JPTopNews?format=xml” number=”1″ ]
このように書くことで指定URLからのfeedをnumber分だけ受けることができる。

その他注意事項


[ wptabs ]を多重化して設置することはできない。
Crayon Syntax Highlighterとの相性があまり良くない。
SyntaxHighlighter Evolvedは今のところ問題なさそう。

[ wptabs type=”accordion” style=”wpui-achu” effect=”fade” mode=”virtical” ]


Accordion Test 1

Accordion Test 1

Accordion Test 2

Accordion Test 2

Reuters News Feed

黒田日銀総裁「緩和の永続望まず」、物価達成後に政策正常化へ

黒田日銀総裁「緩和の永続望まず」、物価達成後に政策正常化へ

日銀は18、19日の金融政策決定会合で、現行政策を維持する方針を決めた。黒田東彦総裁は会合後の記者会見で、物価2%の早期実現に向けて金融緩和を続ける考えを示す一方、大規模緩和を「いつまでも続けたいということはない」と発言。

Read More...


wpdialogを使用することで
アラートを出すことができます。