アストラテーマのメニュー設定を詳しく解説：基本メニューからメガメニューまで (04)

以前の記事で、私たちは次のことを詳しく調べた。 アストラのテーマなテンプレートインポート付き有料版その違い今号の記事では、その違いについて掘り下げる。 アストラのテーマメニューの設定すべてのウェブサイトにとって、メニューは重要なナビゲーションツールであり、ユーザーのブラウジング体験を決定するだけでなく、ウェブサイトの全体的なレイアウトや美観にも直接影響します。Astraのテーマの強力な機能を使用すると、簡単にあなたのウェブサイトの質感とユーザーエクスペリエンスを向上させるために、美しく実用的なメガメニューを設定することができます。

以前の様々なテーマでメニューをお伝えしてきましたが、メニューの設定は似ていて、追加ページ（ページ）で、2番目はカスタムリンクで、3番目は商品カテゴリーなどの項目を追加することです。

ステップ： ウェブサイトのバックエンド → 外観 → メニュー

なぜElementorが表示されるかというと、ページがElementorで編集されていることが表示され、デフォルトのエディタが表示されないからです。

また、ホーム、ブログ、ショップ、カート、チェックアウトなど、設定のメインとなるページを表示するページもある。

もし、シングルで表示したくない場合は、以下のように、より美しく、ユニークな効果を得たい。

様々なエフェクトは、通常のエフェクトよりも優れているわけではありませんが、次にスーパーメニューの設定方法をお教えします！

上図のように、スーパーメニューのオプションをオンにするには、メインナビゲーション名の下にセカンダリーメニューを設定する必要があります。Linkは、「●」または「●#」に設定可能。

上の写真のように、まずこのスーパーメニューボタンを開く！

その後、適切な表示幅を選択し、フルスクリーン幅またはメニュー幅、カスタム幅を選択することができ、非常にスマートです！

次に、メニューの背景の色を設定するか、背景画像を入れて適切に調整します。

もちろん、見出しやテキスト、リンクの色調整も。

最後に「保留」をクリックすれば、最初のステップは完了だ。

次に、メガメニューのタイトルを設定する必要があります。

そしてリンクアドレス\ または#次にスーパーメニューをクリックします。

彼をタイトルとして設定し、それは彼のサブアイテムから区別する方が良いでしょう。また、リンクがある場合、フロントエンドのマウスタッチで動的な効果がありますが、それが単に表示されている場合は、リンクを無効にします。

また、セパレーターの色もあるので、この人は次の2つを区別しやすいだろう。

もちろん、セパレーターを設定する別の方法もあるが、次のようなスーパーメニューの方がシンプルで適応性が高いだろう。

上記同様、カスタムリンクによるものだが、これでは長さをうまくコントロールできないので、参考までに。

その後、そのサブ項目は、通常の行に追加し、スーパーメニューを移動する必要はありませんが、非常に単純ではありません！

もうひとつのスーパーメニューについて話そう。

私たちは、フロントエンドの効果がタイトルを表示しないことを参照してください、あなたは、タイトルが隠されているスーパーメニューで、実際には、質問があるかもしれません。

下図のように、スーパーメニューの位置に画像が追加されている。

下図のように、画像を選択するためにステップバイステップで設定する必要があります。

概要
この記事の詳しい説明で、Astraテーマでメガメニューを設定する方法はマスターできたと思います。メニューのデザインは単純なナビゲーションの設定だけでなく、ユーザーエクスペリエンスとウェブサイトのプロフェッショナリズムを高める重要な部分でもあります。次回は、スライドショーやその他の詳細な設定を含む、Astraテーマのより多くの機能を探求し続け、より良いウェブサイトを作成するお手伝いをします。