Diviプラグインのハイライト–Diviロゴマネージャー

公開: 2017-07-30

ロゴはすべてのウェブサイトの重要な部分です。彼らはあなたの読者にあなたのブランドについて話し、ブランド認知度を提供します。ウェブサイトがロゴでできることは通常制限されています。 Diviを使用して、サイズを調整し、スクロール時に縮小または非表示にすることができます。これは大多数のWebサイトにとっては素晴らしいことですが、ロゴをさらに活用したい場合はどうでしょうか。 Divi LogoManagerと呼ばれるサードパーティのプラグインに興味があるかもしれません。

Divi Logo Managerは、Webサイト全体でロゴを変更できるDiviのプレミアムプラグインです。デバイス（モバイル、タブレット、またはデスクトップ）に基づいて異なるロゴを使用したり、スクロールで別のロゴに変更したり、ページごとにロゴを設定したり、オーバーハングの量を調整したりできます。ページ、プロジェクト、およびWooCommerce製品ページと互換性があります。

このプラグインのハイライトでは、プラグインで何ができるかを見ていきます。例の画像はUnsplash.comから取得されています。

Divi LogoManagerのインストールと設定

zipプラグインをアップロードしてアクティブ化します。有効にすると、使用できるようになります。すべての作業は、[設定]メニュー、個々のページ、およびWooCommerce製品ページで行われます。ダッシュボードで、[設定]に移動し、[Diviロゴマネージャー]を選択します。ここから、張り出したサイズ、モバイルロゴ、タブレットロゴ、デスクトップロゴ、スクロールロゴを選択できます。

デスクトップロゴは、Diviテーマオプションに追加されます。他のすべてのロゴは、このページまたは各ページに個別に追加されます。

オーバーハング

オーバーハングオプションには、なしから想像を絶するほど大きく、その間のさまざまなレベルまで、9つの異なるオーバーハングオプションがあります。これにより、ロゴを変更する必要がない場合でも、使用する価値のある新しいデザイン要素が追加されます。

1ページあたり

Divi Logo Managerは、ページ、プロジェクト、およびWooCommerce製品ページに新しい設定セットを追加します。これにより、メインメニューで設定した設定を上書きして、ページごとに特定のロゴを選択できます。デスクトップ、モバイル、タブレット、スクロール用に設定できます。これは、ランディングページ、特別オファー、ポートフォリオページ、製品などに最適です。

Diviロゴマネージャーの例

各デバイスのロゴとさまざまなレベルのオーバーハングを見てみましょう。 Google Chromeの開発者ツールを使用して、モバイルデバイスとタブレットデバイスをエミュレートします。

デスクトップ

デスクトップのロゴには、ライオンの芸術的なイメージを使用しました。これは、オーバーハングのないロゴの標準バージョンです。このロゴは、Diviのテーマ設定にロードする必要があります。

ロゴをアップロードしたので、プラグイン設定に表示されます。

オーバーハング

オーバーハングのいくつかを見てみましょう。これは小さな張り出しがあります。丁度可知です。

これは少し大きいオーバーハングを使用しています。それはより目立ち、私はそれがページに対して見える方法が好きです。

これはミディアムラージです。全体的に良いサイズです。

これは巨大なオーバーハングを使用しています。一部のデザインには大きすぎる可能性があります。

これは、想像を絶するほど大きなオーバーハングを使用しています。すべてのデザインに合うわけではありませんが、デザインの場合は見栄えがよく、目立ちます。このレベルの選択肢を使用すると、どのWebサイトでも機能するオーバーハングを簡単に見つけることができます。

オーバーハング機能はExtraで機能しますが、ロゴスワッピング機能では機能しません。これが大きなオーバーハングのあるエクストラです。

スクロールロゴ

ロゴのスクロール機能を使用すると、スクロールでのみ表示されるロゴを指定できます。この例では、スクロールロゴを追加しました。

ヘッダーが縮小するとすぐにロゴが変更されます。

タブレット

これは、タブレットにのみ表示される新しいロゴです。 GoogleChromeの開発者ツールを使用したいくつかの例を見てみましょう。

これはiPadです。モバイルデバイスとデスクトップデバイスでもオーバーラップを保持します。タブレットの設定に合わせてロゴが変更されました。

これが水平モードのiPadです。一部のタブレットでは、画面が十分に大きい場合にデスクトップのロゴが表示されます。

これはポートレートモードのNexus10です。

これが水平モードのNexus10です。デスクトップのロゴが表示されます。

これがNexus10の巻物です。タブレットでもデスクトップと同じようにロゴが変わります。

これは、iPhone 6Plusでは考えられないほど大きなオーバーハングです。

これはiPhone6Plusでミディアムオーバーハングを使用しています。

これはラージオーバーハングを使用しています。

これは小さなオーバーハングを使用しています。

モバイル

モバイル用のロゴを追加しました。

これは大きなオーバーハングのあるレスポンシブを使用しています。

これはiPhone6Plusでラージオーバーハングを使用しています。

これは、水平モードのiPhone 6Plusです。

これはGalaxyNote3です。

これは、水平モードのGalaxy Note3です。モバイルのサイトに最適な選択肢を見つけるには、オーバーハングを試す必要があるかもしれません。

WooCommerce製品ページ

また、WooCommerceの製品ページでも機能します。デフォルトでは通常のページとまったく同じように機能するため、設定する必要はありません。これは、大きなオーバーハングのある通常のロゴです。

プロジェクトページ

Divi Logo Managerは、デフォルトでプロジェクトページでも機能します。これは、新しいデスクトップロゴのあるプロジェクトページです。通常のページと同様に、プロジェクトページには、ページごとにロゴを選択するためのカスタマイズが含まれています。

1ページあたり

選択した個々のページにのみ表示されるカスタムロゴを選択できます。ビジュアルエディターでは、右側にDivi LogoManagerと呼ばれる新しいカスタマイズ領域が表示されます。ここでは、デスクトップ、モバイル、タブレット、およびスクロールのロゴをページごとに選択できます。

この例では、新しい製品を作成しました。この商品は他の商品とは大きく異なり、標準のロゴが一致していません。この製品ページは、独自の個別のロゴを持つことで恩恵を受ける可能性があります。

このページに表示するために選択したロゴを見てみましょう。

ラージオーバーハングを使用したデスクトップロゴは次のとおりです。

これがスクロールのロゴです。

これはiPhone6Plusを使用したモバイルロゴです。

これは、水平モードのiPhone 6Plusです。

これがNexus10を使用したタブレットのロゴです。

元のページに戻る…このページにのみ表示したいスクロール用の新しいロゴを追加しました。

このページでは、スクロール時にカスタムロゴを使用するようになりました。

ライセンス、アップデート、およびサポート

プラグインはあなたとあなたのクライアントのために無制限のウェブサイトにインストールすることができます。これには、ライフタイムアップデートと6か月のサポートが含まれます。

詳細については、出版社のWebサイトKiwiWeb.co.ukを参照してください。

最終的な考え

Divi Logo Managerは、簡単で使いやすいです。デバイスごとおよびスクロール用に表示するロゴを選択し、オーバーハングの量を設定するだけです。ロゴは、ページごとに個別に上書きできます。オーバーハングは、ちょっとした魅力を加えてサイトを目立たせるのに最適な方法です。オーバーハングは、必要に応じて非表示にすることも、明白にすることもできます。オーバーハング機能だけでも、プラグインを使用する価値があります。

デバイスに基づいてロゴを選択したり、スクロールでロゴを変更したり、オーバーハング機能を追加したりすることに興味がある場合は、Divi LogoManagerが必要なプラグインである可能性があります。

ご意見をお聞かせください。 Divi Logo Managerを使用しましたか？ 以下のコメントであなたの考えを教えてください！

SiuWing /shutterstock.com経由の注目の画像