スライダー革命からスマートスライダー3へ

スライダーの作成には、Smart Slider と Slider Revolution の 2 つのプラグインが高く評価されています。 どちらも非常に強力で、素晴らしいスライダーを作成できます。 一方、Smart Slider に切り替えることもできます。 これにより、Slider Revolution から切り替える方法について問い合わせが発生する可能性があります。

スライダーを動作させる最も簡単な方法は何ですか?

スライダー回転から移行するにはどうすればよいですか?

移行手順を開始する前に、Smart Slider と Slider Revolution の主な違いを理解することが重要です。 作業する「レベル」は、2 つのプラグイン間の最も重要な違いの 1 つです。 ダッシュボードとスライド エディターは、Slider Revolution の 2 つのレイヤーです。

作成した各モジュールはダッシュボードに表示されます。 任意のモジュールを選択して、その構成にアクセスできます。 単一の画面上ですべてが行われます。 レイヤーを変更する右側のパネルでは、サイズやレイアウトなどのモジュールを設定することもできます。

スマート スライダーは 3 つの層で構成されています。ダッシュボードは、作成したスライダーを最初に確認できる場所です。 いずれかのスライダーにアクセスすると、[スライダー設定] ページが表示されます。 ここで、スライダーの寸法、デザイン、またはコントロールを変更してカスタマイズできます。

スライドのリストはこのページの上部にあります。 レイヤーを操作するには、まずスライド エディターにアクセスする必要があります。 いずれかのスライドをクリックすると、それを行うことができます。 ここでスライドの背景を変更できます。 このページでは、レイヤー構成を追加および変更することもできます。

2 つのプラグインは両方とも同じ機能の多くを提供しますが、両者には大きな違いがあります。

たとえば、ユーザー インターフェイスが大きく異なるため、それらの間を移動することが困難になります。 このガイドでは、スライダーの構築を開始できるように、2 つのプラグインの最も重要な違いについて説明します。

このブログでは、次の点について説明します。

スマートスライダーはスライダー回転時にスライダーを自動認識できますか？

各プラグインには、データの処理と保存のための独自の方法があります。 このため、1 つのプラグインで作成したスライダーは、Smart Slider または Revolution Slider のどちらでも認識されません。

残念ながら、Slider Revolution スライダーを手動で動かすことはできません。 以前に革命スライダーで生成したスライダーをスマート スライダーで使用するには、それらを新たに構築する必要があります。

初めてのスライダー作成

スライダーの作成は、スライダー プログラムの最も重要な仕事の 1 つです。 ただし、各スライダー プラグインの正確な手順は多少異なります。 スライダーを構築する前に、たとえば、さらなる情報 (名前や寸法など) を要求することができます。 または、何も質問せずにデフォルト設定を使用することもできます。

スライダーはどのように構築できますか?

Smart Slider でスライダーの構築を開始するには、[新しいプロジェクト] アイコンをクリックします。 次に、プラグインは、最初から開始するかテンプレートをインポートするかを選択するように求めます。 最初から始める場合は、どのような種類のスライダーを作成するかを決める必要があります。 たとえば、スライダーのタイプ、サイズ、レイアウトを決定する必要があります。

Smart Slider が提供するスライダーは、シンプル スライダー、ブロック、ショーケース、カルーセルの 4 種類です。 Slider RevolutionのSliderタイプはSimpleタイプと同等です。 ブロックとシーンは同一です。 ショーケースは、Smart Slider が Revolution Slider のカルーセルと呼ぶものです。

Smart Slider が使用するカルーセル タイプは、ショーケース タイプに相当します。 主な違いは、トリミングされていないスライドのみを表示できることです。 偶数のスライドを表示する機能もあります。

(画像 - カルーセルと単一スライダー画像)

スライダーのサイズはどのように変更できますか?

新しいスライダーを作成する前に、スマート スライダーはサイズを指定するように求めます。 必要に応じて、スライダー設定の [サイズ] タブでいつでも調整できます。

スライダーのレイアウトと種類を変更する

スライダーを生成する前に、スマート スライダーはそのタイプとレイアウトを選択するよう求めます。 間違った選択をした場合や気が変わった場合には、後で変更することができます。

[スライダー設定のサイズ] タブに移動して、スライダーのレイアウトを変更します。 別のスライダー タイプが必要な場合は、[スライダー アクション] でスライダー タイプを変更します。

(レイアウト付きの画像スライダー)

自動再生の有効化とカスタマイズ

Smart Slider では、デフォルトでは自動再生機能が有効になっていません。 スライダーを自動的に回転させたい場合は、スライダー オプションの自動再生で自動再生を有効にする必要があります。 ここでは、スライドを一時停止および再開するアクションとスライドの長さを選択できます。

スマート スライダーはレイヤーをどのように処理しますか?

Slider Revolution では、画像エディターと同様の方法でレイヤーを操作できます。 レイヤーはキャンバス上で自由に移動できます。 ただし、スマート スライダーには、デフォルト配置と呼ばれる特別な編集モードが含まれています。 この編集により、ページビルダーと同じようにレイヤーを操作できます。

スライドの中央にある 5 つのレベルを左側に移動するとします。 Slider Revolution のレイヤーは一度に 1 つずつ移動する必要があります。 さらに、選択した距離が変更されないように注意する必要があります。

スマート スライダーを使用すると、プロセス全体がはるかに簡単になります。 各レイヤーを個別にシフトするのではなく、各レイヤーの親要素の内部配置を変更できます。 その結果、すべてのレイヤーは互いに接触することなく左にスライドします。 さらに、すべての間隔は一定になります。

最も頻繁に使用されるレイヤー

個別の見出しとテキスト レイヤーはスマート スライダーにあります。 h1 ～ h6 の見出しまたは div は、見出しレイヤーを使用して作成できます。

ビデオ層はもう 1 つの重要な違いです。 Slider Revolutionにはビデオレイヤーが1つ存在します。 このレイヤーで HTML、YouTube、または Vimeo ビデオを表示するかどうかを選択できます。 ただし、各ビデオにはスマート スライダー内に独自のレイヤーがあります。 したがって、YouTube ビデオを表示したい場合は、YouTube レイヤーを追加する必要があります。

レイヤーはどのように設計されていますか?

レイヤ ウィンドウのカスタマイズ タブを選択すると、レイヤをカスタマイズできます。 ここでメッセージの色、フォント ファミリー、サイズ、太さを選択できます。 読みやすさを向上させるために背景色を選択することもできます。 ボタンを作成するときに、[スタイル] メニューで境界線の半径オプションを設定して角を丸くすることもできます。

レイヤーにアニメーションを追加する

スマート スライダーのすべてのレイヤーにレイヤー アニメーションを追加できます。 レイヤー ウィンドウの [アニメーション] タブに移動して、レイヤーにアニメーションを追加します。

3 つの異なるアニメーションを各レイヤーに追加できます。

In –レイヤーをスライド上に表示するアニメーション。
ループ –この動きは連続的です。 たとえば、画像を回転するために使用できます。
Out –このアニメーションによってレイヤーがビューから「非表示」になり、見えなくなります。

Web サイトにスライダーを配置する

あとはスライダーの作成が完了したら公開するだけです。 スライダーのショートコードまたは Gutenberg モジュールを使用して公開できます。 スライダーのショートコードは、[スライダー設定] ウィンドウの [全般] タブにあります。

Divi や Elementor など、最も人気のあるページ ビルダーの一部には、Smart Slider プラグインもあります。 Slider Revolution から移行するときは、古いスライダーをすべて新しいスライダーと交換するように注意してください。

結論

優れたスライダー作成ツールには、Smart Slider や Slider Revolution などがあります。 ただし、ユーザー インターフェイス、機能の名前と場所、その他の要素の点で大きく異なります。

スライダーを手動で変換するのは、大規模で困難な作業です。 この手順により、Revolution Slider からの切り替えが簡単になることを願っています。