Wordpressコンテンツ管理システム(CMS)

  1. メイン
  2. ドキュメンテーション
  3. WordPressコンテンツ管理システム(CMS)
  4. WooCommerce
  5. スライダの使い方WordPress(Revolution Slider)

スライダの使い方WordPress(Revolution Slider)

サイトを作成したいですか? 検索 フリーワードプレスのテーマ およびプラグイン。

新しいスライダを作成します。開いているページの2セクションで、次のように指定します。

  • 名前
  • 別名(ラテン文字で - これは一種のログインです)
  • ショートコード(エイリアスに基づいて自動的に作成されます - サイトの任意の場所に挿入できます)

をクリックした後、設定を保存します。

スライダが、[新規スライダ]、[テンプレートからスライダを追加]、[スライダを適用]の各要素と共に表示されます。 また、スターアイコンをクリックして追加することもできます:

各スライダのドロップダウンリストには、スライダを使用するためのオプションもあります。

6点のアイコンをクリックすると、鉛筆のアイコンをクリックしてスライド自体をカスタマイズすることができます。

スライダ革命:スライドショーエディタ

指定したパラメータで設定された各スライダには、スライダがあります。 各スライド - 名前を指定したり、複製したり、テンプレートに追加したり、削除したりすることができます。 また、フロントエンドにスライダを表示するための赤と緑のアイコンがあります:

Add Slideブロック(一度に複数のスライドを追加できます):

追加されたすべてのスライドは、スライダでの出力の順番を変更することによって、それらの間でドラッグできます。

1.Homeの背景

スライダのソースを選択します。

次に、ソース設定(各ソース+透明度と色が異なっています)が異なります。

Filtresでは、スライドに適用できるすべてのエフェクト:

Parallax / 3D(スライダの設定で事前に有効にする必要があります):

その後、必要な%パララックスを選択します。

ケンバーンズ(主/背景画像と外部リンク用) スムーズなスケーリングとプローテーションの変更:

ただし、このエフェクトはアニメーションでは機能しません。

2。 一般設定

一般的な設定では、特定のスライダ設定を個別に設定できます。

何も変更しない場合、デフォルト設定がスライダに適用されます(スライダ設定 - 一般設定のセクションから):

3。 サムネイル

ここでは、スライドへのサムネイルが設定されます(デフォルトでは何も挿入されていないと、サムネイルはスライド自体と同じになります)。

4。 アニメーションスライド

通常、ナビゲーションのスライダ設定のアニメーションには、矢印が含まれます:

スライドのアニメーションでは、4列からなるブロックがあります。

  1. アニメーションカテゴリ。
  2. 選択したオプションのデモ・アニメーション。
  3. 使用されたアニメーション(各サイクルでスライドがスクロールされます)。
  4. アニメーション設定(1スライドの数、回転角度、アニメーションの持続時間、外観および消滅)。

5。 リンクとSEO

クラスとIDを作成してCSSプロパティを付けることができます。スライドをクリックすると、指定したURLアドレスまたは次のスライドにリダイレクトされるように、リンクも含めています。 また、新しいスライダへの転送は水平方向ではなく垂直方向に行われます。

また、前面が選択されます(レイヤーがクリック不可能な場合)。レイヤーがクリック可能な場合は背面が選択されます。

6。 スライドに関する情報

ここでは、サイトまたはテンプレートのカテゴリの名前(ナビゲーションタブで推測される)が登録されます。 タイトルに表示される最大文字数で、番号を指定します。

7。 Nav.overwrite

ナビゲーション設定を設定します(グローバル設定とは異なります)。

  • 矢印
  • マーカー
  • タブ
  • サムネイル

これは、様々なスライドのコントラストの違いの可能性があるために行われます。

スライダー革命:層

スライダー設定の一番下には、スライドのレイヤーを操作します

1920x1080のサイズでスライドを撮るようにしてください.XNUMXxXNUMXは最大解像度で表示することができます+このフォーマットで編集するのが便利です。

レイヤーを追加する2の方法:

  1. 青いボタンをクリックします。 - レイヤーを追加します(レイヤータイプを選択します)
  2. エディタ内でAddLayerをクリックします(目的のレイヤータイプを選択します)

紫色のボタンObjectレイヤーをクリックすると、オブジェクトのライブラリにアクセスして追加することもできます。

レイヤーエディタのトップメニューにある3アイテムをクリックすると、作業するレイヤーから特定のレイヤーを選択できます。

これらの設定のレイヤー名とレイヤー自体のテキストは異なる場合があります。 スライド上のレイヤーを編集するには - 鉛筆アイコンをクリックします:

レイヤーのメタテンプレートを設定できます。

レイヤーテンプレートをタグに挿入すると、レイヤーはクリック可能になります。

  • <ahref=»"{{current_page_link}}">>テキスト</a>
  • <ahref=»"{{home_url}}">テキスト</a>

この効果は、スライダーが複数のレイヤーを重ね合わせているときで、スライダーの小さな部分だけをクリックすると、別のウィンドウが開き、目的のURLに移動します。

エディタ内では、単にそれらをクリックすることで、示唆にラインを置くことができ、その後、エディタでこのラインを統合(そして、あなたはドラッグ&ドロップするか、削除することができます):

エディタの一番下には、特定のオブジェクト/レイヤーをバインドして次のことができます。

  • 補助線(境界線を超えることはできません)
  • 他の層に

1。 テキスト/ HTML

私たちはテキストを書き留め、色、サイズを調整し、アイコンを挿入して緑のダニを保存することができます:

2。 イメージ画像

ここではすべて同じですが、画像の幅と高さを指定することができます:

3。 オーディオ

ここでは、外部URLを指定します。コンポジションはメディアライブラリから取得されます。

4。 ビデオ

ここでは、ビデオに必要なURLを挿入します:

5。 ボタン

ここにボタンがあります:

6。 図

ここでは、%で指定されたFigureを独自に作成します。

7。 オブジェクト

パープルボタンを選択するときと同じ - ライブラリオブジェクトに入る:

8。 インポート

以前作成したオブジェクトをスライド、スライダ、レイヤーからインポートすることができます。

Slider Revolutionの静的レイヤー

スライダのビジュアルエディタでは、必要なスライド数に変更されない固定レイヤーを指定することもできます。

ドロップダウンリストでは、何も選択しないで、下のエディタ(静的レイヤータブに表示されます)で自分でスタティックレイヤーを作成できます。

レイヤーを作成したら、次のように指定します。

  • どのスライドから開始するかを示します。
  • 彼のショーを終えるためのスライド。

さらに、目的のプロパティを設定することもできます。

Slider Revolutionのレイヤーのグループ

便宜上、いくつかのレイヤーを組み合わせることができます - 下部にあるADD GROUPをクリックしてください。

次に、エディタ内に矩形が表示されます。ここで結合するレイヤーをドラッグする必要があります。 コンテナ自体を必要なサイズに拡大することができます。

スライダ革命:タブ付きビジュアルエディタ

スライドのビジュアルエディタの上には、設定された一連のタブもあります。

スタイル

ここでは、テキストの所望のスタイルを調整することができますが、最も重要なのは、次の行(アイコンW-長ラインとTダウン矢印 - 転送)にテキストラップが含まれていないだけ。

高度なスタイル設定では、次のことができます。

  • 背景レイヤを設定し、
  • ホバリング時の色の変化。
  • レイヤーの境界線を設定する(スタイル、太さ、色、境界線の丸め)
  • レイヤー自体を引き伸ばしてから、エッジまたは中央に沿ってテキストを配置することができます
  • あなたは3-dのテキスト効果を作ることができます
  • 前/後のコンテンツの切り替え

そして他の多くの要素

アニメーション

  • 各レイヤーは、どのように見えるかを見るためにアニメーション化され、エディター内で直接操作することができます。
  • アニメーションの速度を設定することもできます
  • 文字の出現を文字で、単語で、行で分ける
  • 分離アニメーションの方向
  • 分割要素間のアニメーション遅延

高度な設定

  • 戦闘/左翼を残す
  • 上/下の出口
  • 規模の縮小または縮小

また、透明度、回転、交番、スケーリング、傾斜、マスク(マスク領域に入るときのみレイヤの可視性)

ループ

円形アニメーションのさまざまなオプションを作成します。

可視性

デバイス上の特定のレイヤーの可視性を有効/無効にします。

  • コンピュータ(> 980px)
  • タブレット(> 778 = 980px)
  • ワイドスマートフォン(> 480 = 778)
  • ナロースマートフォン(<480px)

行動

  • これには、自動応答性(画面サイズへの適合性)が含まれます。
  • 通常はすべてを含みます。

アクション

レイヤー上でマウスをホバーしたり、押したりタップしたりするときのアクション。

属性

ID、クラス、ラッパーID、ラッパークラス、Rel、Name、Tabindexなどを設定します。

視差| 3D

含まれる内容に応じて:

  • 視差強度/ 3Dを調整する
  • エフェクトは、スライド自体とその上の特定のレイヤの両方に設定できます。

タイムライン

ここで、スケールでの再生をクリックした後:

  1. ここで何秒間何分の1秒間何が起こったかを示す赤いスライダを実行します(手動でも移動できます)
  2. また、青いスライダがあります - スライドの遅延を意味します(スライダを引くと、スライダの変更の標準的な遅延が変更されます)

さらに、それは個別に構成されています。

  • Blue scale - スライドの背景アニメーションの長さ
  • 他のスケール - レイヤー用(レイヤーを作成したものと同じ数だけあります)

また、タイムラインの下に - 灰色のスライダがあり、長いタイムラインを巻き戻すことができます。
編集ボタンをクリックすると、必要なミリ秒でレイヤーの外観とアニメーション効果の持続時間を指定することができます。

同じ操作は、スケールの終わりに行うことができます。 ここで、最後まで層が消えないようにするには、丸い矢印のアイコンをクリックします。

また、ここでは、レイヤーをピックアップし、別のレイヤーの上または上にドラッグするだけで、レイヤーのレイアウトを変更できます。

あなたはアンドロイドのためのapkを見つけましたか? あなたは新しい 無料Androidのゲーム とアプリ。
この記事は役に立ちましたか? はい 8 ノー 2

どうすれば助けますか?