Shortcodes Ultimateの使い方。WordPress初心者におすすめの、何でもできるプラグイン

このブログとメインブログはWordpressで運営しています。
記事の装飾にはShortcodes Ultimateという便利なプラグインを使っています。

スポンサーリンク

Shortcodes Ultimateとは

Shortcodes Ultimateは分かりやすく、簡単な操作できれいな記事装飾パーツを使うことができるプラグインです。

Shortcodes Ultimateで決められているショートコードを入力することで、様々なパーツを使うことができます。

また、Wordpress投稿画面のビジュアルエディタから任意のパーツを選んでショートコードを生成することもできるので、初心者の人に特におすすめです。

Shortcodes Ultimateでできること

見たほうが早いと思うので、具体的な例をいくつかあげます。
このようなパーツを簡単に使うことができます。

タブ

タブ1タブ2タブ3
タブコンテンツ1
タブコンテンツ2
タブコンテンツ3

スポイラー

スポイラーのタイトル
スポイラー内のコンテンツ

ラベル

参考ラベル

リスト

  • リスト項目1
  • リスト項目2
  • リスト項目3

ボタン

ボタン

(トップページに飛びます)

サービスボックス

サービスタイトル
サービスの説明

ボックス

これはボックスのタイトルです。
ボックスのコンテンツ

ノート

ノートテキスト

スライダー

プラグインの導入方法

WordPress管理画面左側のメニューから[プラグイン]→[新規追加]をクリックします。

[プラグインを追加]画面が表示されるので、右上の[プラグインの検索]にShortcodes Ultimateと入力します。

Shortcodes Ultimateが表示されたら、[今すぐインストール]をクリックしてプラグインのインストールをします。

この画像では既にインストール済みのため、[有効]と表示されています。

プラグインをインストール後、有効化すると使えるようになります。

Shortcodes Ultimateをインストールすると、Wordpress管理画面の左側に「[]ショートコード」というメニューが追加されます。

この中のAvailable Shortcodesをクリックすると、使用可能なパーツの一覧を見ることができます。

各パーツを選択すると、プレビューとショートコード、オプション項目を確認することができます。

この画面に書いてあるショートコードを入力することでパーツを使うことができますが、覚えなくてもビジュアルエディタから生成することができるので大丈夫です。

使い方

WordPress記事投稿画面のビジュアルエディタでの使い方を説明します。

ビジュアルエディタの「[]ショートコードを挿入」というボタンをクリックすると、Shortcodes Ultimateのメニューが表示されます。

タブの設定

メニューから「タブ」を選択します。

タブの設定画面です。

コンテンツという箇所の「タブ名」、「タブコンテンツ」を任意の文字列に書き換えます。

「ライブプレビュー」を有効にすると、挿入前にプレビューを確認することができます。

[ショートコードを挿入]をクリックするとこのようなショートコードが挿入されます。

↓実際はこのように表示されます。

タブ1タブ2タブ3
タブコンテンツ
タブコンテンツ
タブコンテンツ

スポイラーの設定

スポイラーは、このようにアイコンを選択します。

スポイラー
スポイラー内のコンテンツ

リストの設定

リストでは使うアイコンを選択することができます。
[アイコンピッカー]をクリックすると、アイコン一覧が表示されます。

アイコンの色も変更できます。
カラーコードを入力するか、カラーピッカーから選択します。

リストのコンテンツはこのようになっています。
必要に応じて項目を増やしたり、内容を書き換えて使います。

リストの内容はショートコードの挿入後にも変更可能です。

  • リスト項目1
  • リスト項目2
  • リスト項目3

ボタンの設定

ボタンのスタイルを選択します。

ボタンの背景色やテキスト色、サイズなどを設定することができます。

Simplicity Hacksへ

(トップページに飛びます)

スライダーの設定

スライダーはメディア内の画像を使用することができます。
「画像ソースを選択」からメディアライブラリーを選択します。

続いて、「画像を追加」をクリックすると画像を選択できます。

「レスポンシブ」、「タイトルを表示」などは、デフォルトでは「はい」になっています。
クリックすると「いいえ」に変わります。

 

Photo by Finan Akbar
Photo by Paul Gaudriault
Photo by Pana Vasquez
Photo by Daniel Zacatenco
Photo by Andrea Cau

さらに便利な活用法

紹介した機能は単体でも十分便利なのですが、ショートコード同士や他のプラグインと組み合わせることで、より多くの表現をすることができます。

僕が使っている組み合わせを紹介します。

スポイラーの中にタブ(の中にList Category Postsプラグイン)

世界一周 中国
旅行記旅のコラム宿情報旅の情報
タブコンテンツ
タブコンテンツ
タブコンテンツ
タブコンテンツ

これはメインブログで使っています。

世界一周ページ

記事ページ

実際は、「タブコンテンツ」のところに、List Category Postsというプラグインを使って表示したい記事一覧を表示しています。

さらにこれらのコード全てをまとめて、Post Snipettsというプラグインにショートコードを登録しています。

Post Snippetsの使い方。簡単な操作でショートコードを作成するプラグイン
任意の文章やHTML、PHPのコードなどを簡単にショートコード化することができるWordpressプラグイン、Post Snippetsの使い方を紹介します。

List Category Postsを使わずに、Shortcodes Ultimateの「投稿」でも似たようなことができます。

ボックスの中にリスト

これはボックスのタイトルです。
  • リスト項目1
  • リスト項目2
  • リスト項目3

Shortcodes Ultimateで作ったボックスの中に、Shortcodes Ultimateのリストを入れるとこんな風になります。

これをCSSでやろうとすると、上級者ではない僕には少し面倒なのですが、Shortcodes Ultimateを使えばわずか1分足らずで完成します。

しかも、ショートコード生成時の設定を変えれば、記事ごとに好きな色やスタイルで使うことができます。

さいごに

Shortcodes Ultimateでは、ここで紹介した以外にも全部で50種類の記事装飾パーツを使うことができます。
また、中級者以上ならカスタムCSSを使ってさらに細かいカスタマイズをすることも可能です。

簡単に記事を彩ることができるので、Wordpress初心者の人におすすめのプラグインです。

Comments

  1. […] 筆者は初め「Shortcodes Ultimate」 と「Simplicity専用人気記事ウィジェット」を使ってタブ表示に挑戦したが「現在の集計」を表示させることができなかった。その後「Wordpress Popular Posts」と […]

タイトルとURLをコピーしました