サルでき流 WordPressではじめる企業サイトの作り方

第47回 Webサイトが劇的にカッコよくなる!「ショートコード」を使いこなせ!(実践編)

この記事を読むのに必要な時間:およそ 5 分

③Tweetmeme Button

【代表的なパラメーター】ボタンタイプ

画像

「Tweetボタン」を作るショートコードです。Facebook同様,こちらもすっかりお馴染みですね。

Facebookと説明が重複してしまいますが,テーマによってはTweetボタンが標準で表示されるものもありますので,その場合は念押し用として使いましょう。

④Tabs

【代表的なパラメーター】自動で表示を切り替える秒数,タブスタイル

画像

上の画像のような,横に続くタブ欄を作るショートコードです。急に「機能」っぽくなってきました。

必要な情報量は多いけれども,あまりひとつの投稿記事や固定ページをダラダラと伸ばしたくない。そんな時に役立つのが,⁠タブ」です。

タブのショートコード自体では,⁠切り替え用の枠」までしか作ってくれませんので,その中に「テキストボックス」「画像」などのショートコードを組み込んで使います。

⑤Tour

【代表的なパラメーター】自動で表示を切り替える秒数,タブスタイル

画像

今度は,縦に続くタブ欄を作るショートコードです。

名前こそ違いますが,使い方は横の場合と同じです。どちらを使うかはWebサイトの構成によってお好みで,という感じになります。

注目のポイントとしては,縦タブも横タブも,どちらにも「自動でタブの表示を切り替える機能」が付いています。

たとえば「何かの手順」「手順ごとに」タブで作った場合,スライドショーのように順番に内容を見せていくことができるようになっています。もちろんオフにすることも可能です。スゲエ。

⑥Accordion

【代表的なパラメーター】最初から開いているセクション,すべてのセクションを同時に畳めるようにするか/最低ひとつのセクションは開いているようにするか

画像

アコーディオン欄を作るショートコードです。

アコーディオンもタブと同じように,スペースを有効活用するための機能なのですが,タブが「切り替える」という動きなのに対して,アコーディオンは「開いたり畳んだり」という動きになります。

タブと違って,見出しの部分が1行丸々使えますので,⁠見出し部分に用語を書いて」⁠内部のテキスト欄にその解説」のような形式で,⁠用語集」を作ったりするのに向いています。

ちなみに,ここまでの3つ,⁠タブ」⁠ツアー」⁠アコーディオン」を使うときの注意点は,「すべてのタブやセクションを,同時に開くことができない」ということです。

「そりゃそうでしょうよ,コンパクトにするための機能ですし,全部同時には開かないでしょ」ということなんですけどね。ここに意外な盲点がありまして。

それは,⁠1ページまるごと印刷したいな」と思った時に,すべてを同時に開けないので,どこかは隠れてしまうということなのです。

見た目がいいので,多用したくなる機能なのですが,頻繁に印刷されることを目的としたページの場合は,ほどほどにしておくことをオススメします。

⑦Post Carousel

【代表的なパラメーター】表示する記事の選択,自動切り替えするかしないか,ループするかしないか,前後ボタンの表示

画像

投稿記事や固定ページを,「カルーセル形式」で表示するショートコードです。カルーセルとは,平たく言うと「メリーゴーランド」のことですね。

メリーゴーランドがくるくる回るように,記事がくるくる切り替わって表示される。そんな機能です。

前回基本編で,記事一覧を表示するショートコードをご紹介しましたが,アレのさらなる機能強化版という感じです。

……こんな豪勢な機能,もはや一体ドコで使えばいいのかしら。

著者プロフィール

カワサキタカシ(かわさきたかし)

元アイ・ビー・エムERPコンサルタント,元アップル教育ソリューション開発者兼営業,他にも様々な経験を経て,人材育成会社『株式会社マイウェイ』を夫婦で起業。現在,同社の取締役兼なんでも担当。

「Webサイト」から「iPhoneアプリ」,「ビジネスサービス」から「会社」まで,『作ること』が好き。そして作る楽しさを誰かに『教えること』も好き。楽しく作る技術を学ぶコミュニティ,『サルでき.jp』をぐーたら管理中。

著書に『iPhoneアプリ開発塾』(技術評論社),『サルにもできるiPhone同人誌の創り方』(飛鳥新社)がある。

株式会社マイウェイ Webサイト
株式会社マイウェイ Facebook
カワサキタカシ Facebook
サルでき.jp


企業サイト作り(運用)にお困りの経営者さま・Webご担当者さま。ワタシ,『企業サイトを楽しく作る(育てる)ためのサポートサービス』もやっております。困り果てて現実逃避の小旅行に出かける前に,是非一度弊社Webサイトまでお気軽にご相談くださいませ。