初めてWordPressでサイトを作ってみると、サイトのデザインがテンプレートに依存しすぎて、なかなか自分の思い描くようなサイトを作れないという方もいるのではないでしょうか?

そんな時に利用したいのが今回ご紹介するWordPressプラグイン「Shortcodes Ultimate」です。このプラグインを使うことで、HTMLやCSSが苦手な方でも簡単に、WordPressの見映えを改変することができます。

記事を華やかに装飾する「Shortcodes Ultimate」

Shortcodes Ultimateとは

Shortcodes Ultimate」は、専用のショートコードで記事の見た目を簡単に変更できるプラグインです。サイトの見た目を弄ろうとなると、ある程度CSSが使いこなせなければなりません。

しかしこのプラグインでは、CSSが苦手な方はもちろん、CSSの知識に疎い方でも直感的に記事装飾ができるよう配慮されているため、WordPress初心者の方でもデザイン性のあるサイトを生み出すことが可能です。

「Shortcodes Ultimate」の使い方

それでは早速使い方についても見ていきましょう。まずはWordPressの管理画面から「プラグイン」>「新規追加」で「Shortcodes Ultimate」と検索してプラグインをインストールして有効化します。

Shortcodes Ultimateのインストール

もしWordPress上の検索結果に「Shortcodes Ultimate」が表示されない場合は、下記のサイトからプラグインをダウンロードし、wp-content/pluginsディレクトリにインストールすることでも利用可能です。

Shortcodes Ultimate

ショートコードを挿入

プラグインを導入できたら、投稿画面を開き、マウスポインタを合わせた状態で、左上「メディアを追加」欄の隣にある「ショートコードを挿入」するボタンをクリック。

一覧

するとパーツの名称が一覧表示されるので、使いたいパーツをそれぞれ選びましょう。ここでは例として、ショートコードの中から厳選して3つの機能の設定方法をご紹介していきます。

「タブ」の実装手順

タブ

最初に「タブ」を実装していきます。この機能では、タブごとに異なるメッセージを設定したい時に役立ちます。

ライブプレビュー

「タブ」欄を選択したら、いくつか項目が出てきますが、それらはデフォルトのまま、一度「ライブプレビュー」を実行しましょう。

ショートコード 呼び出し方

するとプレビュー画面で変化を見ながら編集が出来るようになるので、それらと見比べながら「コンテンツ」欄を自由に書き換えていきましょう。

タブ完成版

最後に「ショートコードを挿入」し、実際のサイトで表示されれば、デザイン性のある「タブ」が記事内に追加されます。

「ボタン」の実装手順

ボタン

次に「ボタン」の実装方法について見ていきましょう。「ボタン」は、文中にアフィリンクをキレイに入れたい時などに役立ちます。

ボタン設定

先ほどの「タブ」同様、「ライブプレビュー」を実行し、細かな設定をおこなっていきます。ここでは主に「リンク」「ターゲット」「背景」の3つを設定しましょう。

  • 「リンク」:ボタンのリンク先URLを設定します。
  • 「ターゲット」:「Open in new tab」で、ボタンリンク先を新規タブで開く設定に、「Open in same tab」で、ボタンリンク先を同タブで開く設定に出来ます。
  • 「背景」:ボタンの色を変更することが出来ます。

ボタン 呼び出し方

最後に「コンテンツ」ボックスでボタン内の言葉を書き換え、「ショートコードを挿入」すれば完了です。

「アニメーション」の実装手順

アニメーション

最後に「アニメーション」の実装方法をご紹介します。「アニメーション」機能は、文章中に入れることによって、より言葉を目立たせることが出来ます。

アニメーション設定

「アニメーション」欄を選択したら、「ライブプレビュー」をクリック。「アニメーション」「持続時間」「遅延」を順に設定しましょう。

  • 「アニメーション」:コンテンツの動きを設定します。
  • 「持続時間」:アニメーションの動かす時間を設定します。
  • 「遅延」:アニメーションの開始する時間を遅らせます。

アニメーション 呼び出し方

最後に「コンテンツ」ボックスでボタン内の言葉を書き換え、「ショートコードを挿入」すれば完了です。

 

このようにCSSが苦手な方でも簡単に見映えのあるボタンデザインやボックスを自由に作ることが出来るようになる他、状況に合わせてアニメーションスライダーやレイアウトの調整にも、このプラグイン一つで対応できるものになっています。

まとめ

今回は、記事を見映え良く装飾できるWordPressプラグイン「Shortcodes Ultimate」の機能とその使い方をご紹介しました。プログラミング技術がなくても簡単なアニメーションなら実装出来るのが、このプラグインの良いところでもあります。もし今の自分のサイトのデザインに少し工夫を加えてみたいという要望がある方は、ぜひ使ってみてください。

またTCDのWordPressテーマには、プラグインを挿さずとも「見出し」「タブ」「スライダー」を挿入できるページビルダー機能が搭載されています。こちらはWordPressプラグインの操作自体に慣れていない方でも簡単に扱えるものとなっていますので、気になった方は合わせてチェックしてみましょう