はじめに

  1. プラグイン利用の注意事項
    • WordPressの利用では、プラグインによる機能追加は必須です。しかし、プラグインにより、ホームページに不具合が発生することもあります。一般のユーザーは、プラグインの内部プログラムまで確認することはできません。そこで、プラグイン導入後は、サイトの機能が正しく動作するかを確認するようにしましょう。
    • プラグインを導入する際は、事前に必ずバックアップを取りましょう。重大な不具合が発生した場合、元の環境に戻せるようにしましょう。
    • プラグインが正しく動作しない場合は、無効化して利用を中断し、動作の不具合を開発元に連絡するようにします。そうすることで不具合の解決とプラグインの品質向上につながります。
  2. 『Blocks Animation』と『Animated Blocks』
    • 『Blocks Animation』『Animated Blocks』はグーテンベルクのブロック単位でブロックにアニメーションを追加できます。
    • 『Blocks Animation』『Animated Blocks』は、両方とも使い方が簡単で、投稿ページと固定ページに効果的なアニメーションがすぐに追加できます。
    • 本稿では『Blocks Animation』『Animated Blocks』の概要と使い方について解説します。

『Blocks Animation』『Animated Blocks』 の概要

アニメーションのサンプル(ラバーバンドアニメーション)

左からBounceアニメーション

下からBounceアニメーション

右からBounceアニメーション

プラグイン名        Blocks Animation       Animated Blocks
機能・70種類以上ののアニメーションがグーテンベルクの中で設定できます。
・編集時にプレヴューできます
・アニメーションの動きの遅れと速さを設定できます。
・76種類のアニメーションがグーテンベルクの中で設定できます。
・編集時にプレヴューできます
・アニメーションの動きの遅れを設定できます。
開発元Themeisle(多国籍チーム)Virgiliu Diaconu(個人開発者)
特徴・WordPressのバージョンは5.8.1に対応
・評価は5星で10,000以上の有効利用がある。
・WordPressのバージョンは5.7.3に対応
・評価は5星で1000以上の有効利用がある。

『Blocks Animation』『Animated Blocks』 の利用手順

『Blocks Animation』と『Animated Blocks』を用いて以下のアニメーション設定を行う。(Rotate in down left 表示)

Bounce in Down表示(遅れなし、スロー)
Fade in表示(1秒遅れ、スロー)
Jack in the box表示(2秒遅れ、スロー)
  1. プラグイン『Blocks Animation』のインストールと有効化
    • キーワードにAnimationを入力してプラグインを選択する。
  2. グーテンベルグの中でアニメーションを設定
    • ブロックにアニメーションを設定できる。
  3. プラグイン『Animated Blocks』のインストールと有効化
    • キーワードにAnimationを入力してプラグインを選択する。
  4. グーテンベルグの中でアニメーションを設定
    • Animated Blockを作成し、その子ブロックにアニメーションを設定できる。
【WordPress応用講座】『Blocks Animation』と『Animated Blocks』の使い方

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)