ポップアップするプレビュー畫像や動(dòng)畫は、ウェブサイトをデザインする際にとても便利なインタラクションです。Elementor用ハッピーアドオン 無料で強(qiáng)力なウィジェットが提供されています。ライトボックス(ライトボックス）ガジェット畫像や動(dòng)畫のポップアップ?ウインドウ表示効果をコーディングなしで簡単に実現(xiàn)し、ページのインタラクティブ性とビジュアル?アピールを高めることができます。

この記事ではハッピーアドオン畫像や動(dòng)畫のポップアップを?qū)g裝し、より魅力的なページにするための実踐的なヒントを提供する。

ElementorのHappy Addonsとは何ですか？

Elementor用ハッピーアドオン ElementorはElementorの拡張プラグインです。ウィジェットやエフェクトのパワフルで柔軟なデザインを多數(shù)提供し、ユーザーがより効率的にプロフェッショナルなレベルのウェブサイトページを構(gòu)築できるようサポートします。個(gè)人ブログ、Eコマースサイト、企業(yè)サイト、クリエイティブポートフォリオなど、用途は様々です。ハッピーアドオン どちらも非常に役に立つ。

プラグインの特徴

• リッチ?ウィジェット?コンポーネント::ハッピーアドオン 以上內(nèi)蔵 100ウィジェット(ウィジェット)、コンテンツ?プレゼンテーション、インタラクティブ機(jī)能、レイアウト支援など幅広い側(cè)面をカバーしている。

• 無料で、Proバージョンと互換性があります：プラグイン無料版歌で応えるプロフェッショナル版2つのモードがあります。無料版にはすでに多くの実用的な機(jī)能が含まれており、ウェブサイト構(gòu)築の基本的なニーズのほとんどに適しています。プロフェッショナル版では、より高度な特殊効果と商用利用コンポーネントをアンロックし、複雑なページや企業(yè)レベルのプロジェクトに適しています。
• 豊富なスタイルとアニメーションのサポートフローティングアニメーション、回転、拡大縮小、透明度、フィルターなどがサポートされています。 CSSアニメーション効果その結(jié)果、より視覚的に魅力的なページになります。コーディングなしでダイナミックなページ効果を作成できます。
• 既製のテンプレート?スニペット：Happy Addons オフィシャルサイトではプレハブ?デザイン?テンプレートユーザーは ライブコピーの特徴自分のウェブサイトにワンクリックでコピーできるので、デザインや開発の効率が劇的に向上します。

ハッピーアドンの仕組み

使い方1：ボタントリガー式ライトボックス（ボタンタイプ）

1.ウィジェットの追加

ある エレメンタ エディターで "ライトボックス"をクリックし、ページ?キャンバスにドラッグする。

2.ボタンテキストとアイコンの設(shè)定

クリック "タイプ"を選択します。ボタン"タイプです。ボタンのテキストはカスタマイズ可能で、アイコンはアイコンライブラリから適切なものを選ぶことができる。

3.ポップアップ?コンテンツの種類を選択する

クリック "ライトボックス?タイプ"オプションで、表示するコンテンツの種類を選択できる：

• ビデオ
• 寫真（イメージ）

ビデオ設(shè)定（ビデオライトボックス）：

• バッキング ユーチューブそしてヴィデオそしてセルフホスト
• 動(dòng)畫ファイルはメディアライブラリから直接アップロード可能
• ビデオ再生の開始時(shí)間と停止時(shí)間を設(shè)定し、必要なクリップのみを表示することができます。

畫像設(shè)定（畫像ライトボックス）：

• メディアライブラリーから選択可能寫真コンテンツのポップアッププレビューとして

4.スタイルのカスタマイズ

で "タイプ"タブでは、ボタンの色、ボーダー、タイポグラフィ、ホバー狀態(tài)などを設(shè)定して、ウェブサイトのスタイルに合ったビジュアルスタイルを作成できます。

使い方2：畫像トリガーライトボックス（畫像タイプ）

1.トリガータイプの切り替え

左側(cè)の設(shè)定パネルの一番上のドロップダウンメニューで、トリガータイプを"畫像".

2.畫像の選択

2つの畫像を設(shè)定する必要がある：

• ページに表示される畫像(トリガー）
• クリックするとプレビュー畫像が表示されます。(ポップアップウィンドウの內(nèi)容）

どちらの畫像もメディアライブラリーから選択できる。

3.スタイル設(shè)定

スタイル]タブでは、畫像ボタンに角丸、ボーダー、シャドウを追加したり、CSSフィルタを使用して高度な畫像効果を得ることもできます。

上級(jí)者向けヒント：テキストのみのボタントリガーを作成する

背景色のついたボタンは使いたくないが、テキストでライトボックスをトリガーしたい場合は、次のようにします：

• ボタンの內(nèi)側(cè)の余白（パディング）を取り除く
• 背景色を透明に設(shè)定する
• カスタム?フォント?カラーとホバー?ステート

これにより、ハイパーリンクのように見えるテキストのみのボタンが作成され、ポップアップ効果が発動(dòng)する。

ディスプレイ効果

概要

レバレッジ Elementor用ハッピーアドオン 提供 ライトボックス ウィジェットは、コードを一行も書くことなく、ページにインタラクティブ性と美しさを加えることができ、訪問者がコンテンツの表示にもっと集中できるようにし、全體的なユーザーエクスペリエンスを向上させます。もっとWordPress関連の知識(shí)を知りたい方は光子ゆらぎネットワーク毎日の更新はいつでも可能だ。WordPressチュートリアルと情報(bào)、そして最も雰囲気のある交流のコミュニティお互いにコミュニケーションを取り、一緒に前進(jìn)していくことができるだろう！

お問い合わせ
チュートリアルが読めない？無料でお答えします！個(gè)人サイト、中小企業(yè)サイトのための無料ヘルプ！	カスタマーサービス WeChat
① 電話：020-2206-9892
② QQ咨詢：1025174874
三 Eメール：info@361sale.com
④ 勤務(wù)時(shí)間: 月～金、9:30～18:30、祝日休み