ショートコードの設置・使用方法

2018年11月3日

ネットビジネスD運営者の龍一です!

今回は、ショートコードの設置・使用方法の紹介です。

プラグインで、50以上の装飾機能をショートコードで
利用する方法を紹介したいと思います。

カスタムは、いろいろ個々に出来ますので
とりあえずは、ディフオルトでの例を5つ紹介しながら
色などのカスタムの仕方も、少し解説していきます。

このプラグインを活用してページを
装飾して見た目も、読みやすさも向上して行って下さい。

 1.Shortcodes Ultimateのプラグインをインストール 

まず、ダッシュボードから「プラグイン」「新規追加」
クリックしてください。

検索窓に「Shortcodes Ultimate」コピペしてください。

下のような項目が表示されたら、右下に互換性あり
と表示されてるのを確認して、インストールから
有効化してください。
*互換性が無い場合は残念ですが使用できません。
*画面は、既に使用中なので「今すぐ更新」になっています。(^^:

Shortcodes Ultimate のインストール・有効化が終わると
投稿画面に 「ショートコードを挿入」のボタンが下の赤線ように表示されます。

「ショートコードを挿入」をクリックすると下のように
たくさんのショートカットの機能メニューが、ズラーと表示されます。
*全てがテーマ(テンプレート)に対応出来てないタイプもあります。

 ショートカットの機能表示の方法!
ショートカットの機能メニューは、テキストモードにコードが書き込まれるので
「更新」(新規だと「公開」)を、クリックしないと反映・確認が出来ませんので
注意してください。

 2.アコーディオン 

アコーディオンは、クリックすると下に文字が現れます。
クイズだとか、ページの流れ的には後で見て欲しい長い
文字・文書、コードなどを、上側の下に隠して置くことができます。

クリックしてみてください♪

クリックすると開きます。
開きました。

頭の「+」だと、とじた状態で、「-」は、開いた状態になります。
例は1行ですが、沢山の行が伸びたように出て来て
戻るので「アコーディオン」と言います。

 

 3.ボックス 

ボックスのショートのボタンをクリックすると下のような
箱型のタイプ装飾が作れます。
クリックすると、表示される画面の「タイトル」上側
一番下の「コンテンツ」の文字が下側に表示されます。

またの項目や、タイトルテキストの色を変更できます。

ボックス
内容・解説など

例・ボックス2 オレンジで「泡」を選択、角にアール(数値)を付けました。

ボックス2
内容・解説など

基本的なカラーコード

・#FF0000  ・#0000FF  水色・#00FFFF
・#008000  黄緑・#00FF00 ピンク・#FF00FF
茶色・#800000 オレンジ・#FF4500 黒・#000000

また、色などのコード部分をクリックするとカラーグラデーション
表示されるので好きな色・濃度の箇所を指定する事でも変更は可能ですが
複数(ページ)を統一したい場合は、コードを使用しましょう。

 4.ノート 

ノートタイプのショートのボタンをクリックすると下のような
タイプ装飾が作れます。

ノートタイプです。

コレも「背景」と「テキストの色」が選択・指定できます。
また、半径のスライドバーで角のアールも変更できます。

ノートタイプ例2です。

色や、角のアールなどが変更可能です。

ノートタイプ例3です。
 5.テーブル 

テーブルタイプのショートのボタンをクリックすると下のような
簡単な枠が作れます。

また、レスポンシブも選択できます。

テーブル テーブル
テーブル テーブル

 

 

 6.ボタン 

ボタンタイプのショートのボタンをクリックすると下のような
ボタンが作れます。

ボタン

 

ボタン2

 

コレも「背景」「テキストの色」「影」などが
選択・指定できリンクも入れられます。
サイズもスライドバーや数字で指定できます。
例ボタン2は「15」サイズです。

ボタンは

大きさを変更
文言や背景の色を変更
背景デザインを変更
枠のデザインを変更

も可能です。

また「アイコンピッカー」から沢山のアイコンを
中に下のように、文字の左側に表示できます。

ボタン3(アイコン)

下・選べるアイコン(これでも全部ではありません)(^^:

Shortcodes Ultimateは、50以上のデザインパーツを利用してページを装飾できるWordPressプラグインです。
ショートコードを利用して簡単に綺麗に装飾できますので活用してみて下さい。

このプラグインを活用し、ブログの記事を装飾して行けば見やすく
記事の内容も理解しやすくなると思います。

ブログの記事は文字ばかりだと、記事を読む人に地味な印象を与えてしまいますので
記事を装飾することで、記事の印象が格段に良くなります。
記事の印象が良くなると、成果も上がりやすくなる効果も…実は大事な要素ですので
あなたも実際にページを装飾して試してみましょう。