Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03)

現代のウェブサイトデザインにおいて、ホームページ上の画像やスライダーは訪問者の目を引く重要な要素のひとつです。スライダーの使用は、ウェブサイトのダイナミクスを高めるだけでなく、コアコンテンツと視覚情報をよりよく表示します。強力なWordPressテーマとしてアバダ このテーマにはエディタといくつかのスライダーツールが付属しているので、リッチな画像やスライダー効果を実現するためにサードパーティのプラグインを使用する必要はありません。今号では、より魅力的なウェブサイトのホームを作成するために、すぐに始めるのを助けるために、ホームページの画像やスライダーを設定するためにアバダテーマを使用する方法をお伝えします。今号では

アバダ・テーマには独自のエディターがあり、サードパーティ製エディターは必要ない。ライブ編集赤い矢印をクリックして入力すると、黄色のボックスは、サイトのヘッダーとフッターであり、対応するをクリックする必要がある場合も、対応する編集ページを入力することができます!

ステップ:サイトのフロントエンド → ライブ編集

画像[1]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Volatility|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!
画像[2]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

以下のように、これはサイトのトップページです。両側が編集されていないことに注意してください。

画像[3]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

をクリックしてください。

画像[4]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

テンプレートのインポートがトップページの画像だけだったり、1枚の画像だけで効果を得たい場合は、トップページの画像の真ん中にあるペンのマークをクリックして編集すると、次のような画面になります。

画像[5]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Volatility|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

あなたはそれを置き換えるか、削除(Remove)、編集(Edit)するだけで、メディアライブラリまたはローカルファイルに移動し、あなたが適するように調整されます。

もちろん、画像の効果はあなたを満足させることができない場合、我々は独自のスライダー(スライダー)を追加することを選択できます。またはスライダーのテンプレートを持っていることを選択するか、もちろん、より便利に自分自身を追加するには、時間のビューでテンプレートが同じではありませんが見つけることができます!

スライダーの追加方法について説明しよう。

画像[6]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Volatility|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

アドオンモジュールにはたくさんの種類のスライダーがありますが、どのように選べばいいのでしょうか?

1. アバダ・スライダー

Avadaテーマ用にデザインされたAvada独自のスライダーは、高度に統合されています。

基本的なテキスト、画像、ボタン、リンク、スライダーのアニメーション効果はすべて揃っています!

下記のように、サイトのバックエンドにあるAvadaでスライダーを見つけてください。

ステップ: ウェブサイトのバックエンド → アバダ → スライダー

画像[7]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Volatility|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

その後、以下の画像に移動し、スライダーの名前を設定し、他のいくつかの設定を行います。オプションの下部に説明がありますので、説明に従って、設定の実際のニーズに従います。

スライダーを作成し、そのスライダーに複数のスライドを追加します。下図のように、まずスライダーを作成します。

画像[8]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

そのまま(スライダーを追加)

画像[9]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

次に、スライダーのリストで、以下のように名前が1に設定されていることがわかります。

画像[10]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

それからスライドをセットアップする。

画像[11]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

次に、次のようにスライドを追加する。

画像[12]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

次に、スライドショーの編集ページに移動し、スライドショーのソースがIMAGEかVIDEOか、YoutubeかVimeoビデオプラットフォームか、そしてスライドショーの名前を設定する必要があります。

画像[13]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

そして、あなたはスライダーにスライドショーにチェックを入れる必要があり、ここでスライダーの名前とスライドが1であり、デモとして、我々は後で変更する必要があり、次に注目の画像(注目の画像)を設定し、あなたが背景として画像を選択した場合、次のグラフになります。

画像[14]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

次に、アバダ・スライダーを追加するために編集ページであるサイトのフロントエンドに行きます。

画像[15]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

次に、設定したスライドの名前を選択し、スライドのフルハイト、要素の可視性を3つのデバイスにするか1つのデバイスにするかなどを設定します。

画像[16]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

すると、次のような初期スライドの内容が表示されます。

画像[17]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

ステップ: ウェブサイトのバックエンド → アバダ → スライダー → スライド

テキストだけでなく、ボタンやリンクもスライドに設定する必要があります。

画像[18]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

それはアバダごかんけいせいぼおんアバダ・スライダーセッティングは上がっている。

画像[19]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

2、レイヤー・スライダー

Layer Sliderは複雑なアニメーション効果をサポートする非常に強力なスライダープラグインで、画像、テキスト、ボタンなどのレイヤー(層)ごとに異なるアニメーションを追加することができ、より複雑な表示効果を作成するのに適しています。アニメーションエフェクトも豊富で、マルチレイヤーアニメーションのコンテンツなど、より高度なスライダーエフェクトが必要な場合、このプラグインは理想的です。プラグインは多数のプリセットテンプレートを提供し、素早くスライダーを作成し、パーソナライズすることができます。ただし、プラグインをインストールする必要があります。

画像[20]-Avadaテーマのトップページ画像とスライダーを設定する方法:詳細チュートリアル(03) - Photon Flux|WordPress修理のプロフェッショナル、ワールドワイド、迅速な対応!

3、メディアスライダー

メディアスライダーは、フォトギャラリー、ビデオなどのマルチメディアコンテンツを表示するために設計されています。スライダー内で各メディアファイルのレイアウトと配置を設定することができ、異なるデバイスで良好な表示を保証します。複雑な設定をすることなく、素早くメディアコンテンツの回転表示を作成することができるので、スライダーを通してビデオ、オーディオ、その他のメディアファイルを表示したい場合、このスライダーは非常に適しています!

4、ポストスライダー

Post SliderはWordPressの投稿にスライダーを表示するために使用され、ブログ投稿やカスタム投稿タイプの表示に適しています。記事、製品、プロジェクトを表示するのに最適なツールで、自動更新により、投稿が更新されるとすぐにスライダーも同期されます!

5, スライダー革命

Slider Revolutionはプレミアムスライダープラグインです。複雑なアニメーションやトランジションエフェクトを作成したり、ページ全体のレイアウトを作成することもできます。最もパワフルなスライダー機能と非常に高いレベルのカスタマイズが必要な場合、Slider Revolutionは最良の選択です。基本的に、それはすべての機能を統合しています

意見だ:

アバダ・スライダーシンプルで軽量、基本的なスライドエフェクトを素早く作成するのに適しています。

レイヤー・スライダーマルチレイヤーアニメーションをサポートし、複雑なアニメーションやマルチレイヤー表現が必要なシナリオに適しています。

メディア・スライダー写真やビデオなどのマルチメディアコンテンツを表示するために設計されています。

ポストスライダーブログや動的なコンテンツ表示に適しています。

スライダー革命最もパワフルで、高度にカスタマイズ可能で複雑なスライダー・エフェクトに適しています。

概要

しかし、私のアドバイスとしてはアバダ・スライダーなぜなら、最も相性が良いからだ。アバダこの記事で、Avadaテーマでスライダー付きのトップページ画像を設定する方法を学びました。基本的なアバダ・スライダーそれとも、もっと複雑なものがお好きですか?レイヤー・スライダー もしかしたら スライダー革命あなたの特定のニーズに応じてウェブサイトのプレゼンテーションを最適化するために柔軟に適用することができます。次号では、よりプロフェッショナルなWordPressウェブサイトを作成するためのより実践的なヒントやチュートリアルをもたらす、Avadaテーマのより多くの機能を探求し続けます。ご期待ください!


お問い合わせ
記事が読めない?無料でお答えします!個人サイト、中小企業サイトのための無料ヘルプ!
電話:020-2206-9892
QQ咨询:1025174874
Eメール:info@361sale.com
勤務時間: 月~金、9:30~18:30、祝日休み
© 複製に関する声明
この記事はハリーが執筆しました。
終わり
好きなら応援してください。
クドス0 分かち合う
おすすめ
解説 ソファ購入

コメントを投稿するにはログインしてください

    コメントなし