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

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

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

The7で使えるショートコード一覧

では,前編の今回は,最後にThe7(Visual Composer)で使えるショートコードを一覧でざざっと紹介して終わりにします。

この山ほどあるエレメント,その実体はショートコードなのでした

この山ほどあるエレメント,その実体はショートコードなのでした

Row列を作るショートコード
TextBlockテキスト欄を作るショートコード
Message Boxメッセージ欄を作るショートコード
Facebook LikeFacebookのいいねボタンを作るショートコード
Tweetmeme ButtonTweetボタンを作るショートコード
Google+ ButtonGoogle+ボタンを作るショートコード
FAQFAQ欄を作るショートコード
Single Image画像を配置するショートコード
Tabs横タブ欄を作るショートコード
Tour縦タブ欄を作るショートコード
Accordionアコーディオン欄を作るショートコード
Post Carousel記事をカルーセル形式で表示するショートコード
Posts Slider記事をスライダー形式で表示するショートコード
Call to Action Button誘導用ボタンを作るショートコード
Video PlayerYouTube等の動画を配置するショートコード
Google MapsGoogle Mapを配置するショートコード
Progress Bar棒グラフを作るショートコード
Pie Chart円グラフを作るショートコード
Contact Form 7お問い合わせフォームを作るショートコード
Empty Space空白のスペースを作るショートコード
Fancy Quote引用欄を作るショートコード
Teaser文字と画像でティーザーを作るショートコード
Banner文字と画像でバナーを作るショートコード
Blog投稿記事一覧を配置するショートコード
Portfolioポートフォリオ一覧を配置するショートコード
Teamチーム一覧を配置するショートコード
Logotypesロゴ一覧を配置するショートコード
Testimonialsユーザーボイス一覧を配置するショートコード
Fancy Listリストを作るショートコード
Benefits効用一覧を配置するショートコード

色々ありますね~。どれを使うか迷ってしまいますね。

ちなみに,アイコンのイメージが上の方と下の方でずいぶん違っていると思いますが,上の方に並んでいるのが,⁠Visual Composer」で提供されているショートコードで,下の方に並んでいるのが,⁠The7」で提供されているショートコードです。

ここが境界線

ここが境界線

「Visual Composer」「The7」を買うと一緒に付いてきますが,単体のプラグインとしても導入できますので,こういう混在になっているわけです。

みなさんがお使いのテーマに,気に入ったショートコードがない場合は,⁠Visual Composer」さえ導入すれば,⁠Visual Composer」が提供しているショートコードは使えるようになりますので,「テーマは今のヤツを使いたいんだよな~」というアナタも大丈夫です

テンションが上がっていろいろ入れてしまったダメな例

テンションが上がっていろいろ入れてしまったダメな例

ではでは,次回の後編は,この中でも特に便利で使えるものを,詳しく紹介していきますね!

まとめ

いかがでしたか?

まずは「ショートコード」「Visual Composer⁠⁠,それぞれの役割がスッキリ整理できたと思います。

これは「テーマあるある話」なのですが。

テーマのサポートページで見たときに,⁠shortcodes」という名前で紹介がされている機能群が,実際には「Visual Composer」でエレメントとして導入するようになっていて,混乱することが多々あります

同じものなの?

それとも違うものなの?

もしかしたら「Visual Composer」で設定しちゃいけないの?

ただでさえ英語で書いてあるからよくわからないのに,何やら説明がハッキリしていなくて,使うのを躊躇してしまう。

ワタシも最初の頃,超迷子になりました。

フタを開けてみれば,何と言うことはなく。今はまだこの仕組みの「過渡期」なんですね。

「ショートコード」ができて,さらにそれを便利にする形で「Visual Composer」ができて,それらがまだまだ進化の途中なのです。

「ショートコード」は使いこなせば非常に便利な仕組みですので,まずは大枠を覚えて,現状の経緯を知って,怖さをなくしてからガシガシ使ってくださいね。

……おっと。

と,いうところで終了の時間です。

ではでは,今回はここまで!

次回をお楽しみに~。

画像

著者プロフィール

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

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

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

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

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


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