WordPress Elementor ページビルダーでアニメーション効果を使用する

無料ページビルダーである Elementorは、さまざまなアニメーション効果を適用することができるオプションが提供されます。

Elementorでアニメーション効果を適用するには、アニメーション効果を適用するセクションまたは列の上にマウスカーソルを置きます。 セクション編集 또는 列の編集 ボタンをクリックします(下の図で、(1))。

WordPress Elementor ページビルダーでアニメーション効果を使用する

その後、上記の図のように左のパネルに編集可能なオプションが表示されます。

上部のLayout(レイアウト)、Style(スタイル)、Advanced(詳細)]タブの中で 高機能 タブをクリックします(2)。

その後、高度なオプションが表示されます。 Entrance Animationでは、次のような効果を選択することができます。

  • Fading(フェード):Fade in、fade in up、down、left、right
  • Zooming(拡大/縮小):Zoom in、zoom in up、down、left、right、
  • Bouncing(バウンス):Bounce in、bounce in up、down、left、right
  • Sliding(スライド):Slide in up、down、left、right
  • Rotating(回転):Rotate in、rotate in down left、down right、up left、up right
  • Attention seekers:Bounce、flash、pulse、rubber band、shake、head shake、swing、tada、wobble、jello
  • Light speed in
  • Roll in

Entrance Animationでアニメーション効果を選択すると、すぐ下に Animation Duration(アニメーションの継続時間)Animation Delay(アニメーション遅延) オプションが表示されます。

Elementor ページビルダーアニメーション効果

例えば、 Slide in upを適用すると、下から上にスライド方式で上がってくる効果が適用されます。

Elementor アニメーション効果

Elementor無料ページビルダーが、まともな機能を提供することです。

メモ:

一部の記事にはアフィリエイトリンクが含まれている場合があり、パートナーの活動で一定額の手数料を受け取ることがあります。

2のコメント

  1. 私もエレメンタルビルダーとオーシャンwpテーマを主に使用します。 まあまあのウェブサイトの実装は、多可能と思われる。!! イチオシ!

    1. OceanWPは無料ながらスピードも大丈夫なので、ブログに一つインストールしてテストしています。

      Elementorは無料ですが、機能がかなり大丈夫だと感じました。

コメントを残す

*メールアドレスは公開されません。