
コロナによる自粛、自粛…世の中には今、「動き」が足りない、、、。
せめて、ネットの世界ぐらいは派手に動こうよ。
ということで、文字や画像にアニメーションをつけられるWordPressプラグイン「Shortcodes Ultimate」をご紹介します。
61種類ものアニメーションがショートコードのみでつけられるので、うまく使えば読者に強烈な印象を残すことができますよ。
説明より見てもらう方が早いですね。
今回は運動不足の「課長・中西」に、がんばって動いてもらいます。

痩せるぞ〜!おぉ〜!
WordPressの文字&画像にアニメーションをつける

以下がShortcodes Ultimateで表現できるエクササイズ、いやアニメーションの全61種です。
■flash
■bounce
■shake
■tada
■swing
■wobble
■pulse
■flip
■flipInX
■flipOutX
■flipInY
■flipOutY
■fadeIn
■fadeInUp
■fadeInDown
■fadeInLeft
■fadeInRight
■fadeInUpBig
■fadeInDownBig
■fadeInLeftBig
■fadeInRightBig
■fadeOut
■fadeOutUp
■fadeOutDown
■fadeOutLeft
■fadeOutRight
■fadeOutUpBig
■fadeOutDownBig
■fadeOutLeftBig
■fadeOutRightBig
■slideInDown
■slideInLeft
■slideInRight
■slideInRight
■slideOutUp
■slideOutLeft
■slideOutRight
■bounceInDown
■bounceInUp
■bounceInLeft
■bounceInRight
■bounceOut
■bounceOutDown
■bounceOutUp
■bounceOutLeft
■bounceOutRight
■rotateIn
■rotateInDownLeft
■rotateInDownRight
■rotateInUpLeft
■rotateInUpRight
■rotateOut
■rotateOutDownLeft
■rotateOutDownRight
■rotateOutUpLeft
■rotateOutUpRight
■lightSpeedIn
■lightSpeedOut
■hinge
■rollIn
■rollOut
WordPressプラグイン「Shortcodes Ultimate」の使い方

では「Shortcodes Ultimate」の使い方をご紹介します。
「Shortcodes Ultimate」をインストール
①管理画面左側のプラグイン「新規追加」をクリック

②検索窓に「Shortcodes Ultimate」と入力する

③今すぐインストールをクリック

④Activate/有効化をクリック

インストールは以上です。
続いて、投稿画面にいきます。
「Shortcodes Ultimate」を挿入する
①「ショートコードを挿入」をクリック

②アニメーションを選択

③アニメーションの種類を選択

④動く時間と遅延(←アニメーションが始まるタイミング)を設定する

⑤ここは無視!(よくわからん^^;…でも影響なし)

⑥「内容」に動かしたい文字や画像を入れ、「ショートコードを挿入」を押したら完了!
挿入前にプレビューも見れますよ。

画像を動かすにはimgタグ挿入
画像を動かしたければ、ショートコードの間に画像タグを入れます。
「su_animate type=”wobble” duration=”4″]画像タグ[/su_animate]
画像タグの挿入方法を解説します。
①使用する画像をアップします。

②「︙」から「htmlとして編集」を選択

③青の下線部分<img〜/>をコピーして、画像タグの部分に貼り付ければ完成です!

WordPressの文字&画像にアニメーションをつける
課長、お疲れさまでした。
ご意見ご感想ぜひ!