Astra Freeテーマで全幅またはボックス化されたコンテンツをセットアップする

アストラテーマ

Astraは効率的で完全にカスタマイズ可能なWordPressテーマです。 それは美しく高速でもあり、ブログ、ビジネス、個人ポートフォリオ、WooCommerceストアフロントに最適です。 軽量であるため、ウェブサイトの速度が大幅に向上します。 AstraはSEOを念頭に置いて構築されており、検索エンジンでのWebサイトのランクを高くしています。 その特別な機能とテンプレートにより、Elementor、Divi、Beaver Builder、SiteOrigin、Visual Composerなどのページビルダーに最適です。

容器

コンテナはコンテンツを表示する領域であるため、Webサイトのページはコンテナと呼ぶことができます。 簡単に言えば、コンテナはページ全体を包含します。 コンテンツエリアであろうとサイドバーであろうと、コンテナに含まれます。 技術的には、コンテンツ領域をプライマリコンテナと呼び、サイドバーをセカンダリコンテナと呼びます。

Webサイトのコンテナーレイアウトを操作する方法

Astraテーマを使用すると、Webサイト全体にコンテナレイアウトを適用するのが便利になります。 グリッドは、カスタマイザオプションを使用して設定できます。 これは、[外観]タブの[外観]> [カスタマイザ]> [グローバル]> [コンテナ]にあります。

  • メタ設定から、ページや投稿ごとに個別のコンテナを個別に適用することもできます。
  • Webサイト全体に異なる設定を適用し、メタ設定に異なる設定を適用した場合、ページ固有のメタ設定は、ページカスタマイザー設定全体よりも優先されます。

コンテナの幅

グラフィックかテキストかに関係なく、すべてのWebサイトコンテンツがこの幅内に表示されます。 幅とコンテナのレイアウトを組み合わせることで、さまざまなビューを作成できます。

1.png

コンテナのレイアウト

Astra Free Themeは、4種類のコンテナレイアウトを提供します。

「メタ設定」ページの助けを借りて、各ページのコンテナレイアウトをより詳細に制御できます。

コンテナレイアウトには次のタイプがあります。

  • 箱入り
  • コンテンツボックス
  • 全幅/封じ込め
  • 全幅/ストレッチ
  • 専用コンテナレイアウト

専用または特定のレイアウト

上記の4種類のコンテナレイアウトは、特定の投稿タイプで個別に使用できます。 つまり、デフォルトのレイアウト、たとえばボックスレイアウトを選択し、アーカイブの場合は全幅を選択した場合、サイト全体がボックスレイアウトになり、アーカイブページは全幅/含まれるレイアウトになります。

  • ページレイアウト–ページのみ
  • アーカイブのレイアウト–すべてのアーカイブ
  • ブログ投稿のレイアウト–ブログアーカイブおよび単一のブログ投稿ページ
2.png

Astraテーマは、多くの人気のあるpluginの統合を提供します。

WooCommerce

EDD( Easy Digital Downloads )

LearnDash

リフターLMS(3)

上記のpluginをインストールすると、それらのpluginページ専用のコンテナレイアウトオプションにもアクセスできます。

Astra Pro Addon pluginの専用モジュールは、より高度なオプションを提供します。 Astra Pro Addon pluginの専用モジュールには、次のオプションが含まれています。

  • ページのメタ設定は、コンテナのレイアウトよりも優先されます。 メタ設定の優先度はカスタマイザ設定よりも高くなっています。
  • サイトレイアウト設定は、コンテナの幅を決定します。

コンテナレイアウト/全幅レイアウト

全幅のコンテナ設定は、ドキュメントにあるカスタマイザ設定で操作できます。

ドキュメント»カスタマイザ設定»グローバル»全幅/包含–コンテナレイアウト

前に説明したように、Webサイトには2つのコンテナを含めることができます。 プライマリコンテナとセカンダリコンテナ。

プライマリコンテナは、メインコンテンツが表示されるページです。

セカンダリコンテナは、サイドバーとサイドバーのさまざまなウィジェットを構成します。

「全幅/包含」レイアウトの助けを借りて、プライマリコンテナとセカンダリコンテナを組み合わせることができます。 その後、これらのコンテナを単一のコンテナに表示して、見た目を整頓することができます。 「全幅/含まれる」レイアウトでは、コンテンツとサイドバーが1つのコンテナに並べて表示されます。 このコンテナーはコンテナーの幅で表示されるため、コンテナーの周囲にスペースが残ります。

コンテナー設定は、[外観]に移動し、次のパスに従って変更または変更できます。

外観>カスタマイズ>グローバル>コンテナ

4.png

全幅/封じ込めレイアウトは、ボックスやグリッド境界のない、きちんとしたデザインが必要なWebサイトに最適です。 このレイアウトは、WooCommerce、LifterLMSなどのpluginの統合を通じてデフォルトとして設定できます。

Visual Composerなどの多くのページビルダーでは、コンテナーの幅を制御するためにテーマが必要です。 同じ理由で、彼らは全幅/包含レイアウトをお勧めします。

Astra Pro Addon pluginの専用モジュールは、より多くのスタイリングオプションを提供します。

コンテンツボックス-コンテナーレイアウト

ドキュメント»カスタマイザ設定»グローバル»コンテンツボックス-コンテナレイアウト

通常、Webサイトには2つのコンテナが存在する可能性があることを前述しました。

プライマリコンテナ:メインコンテンツが表示される場所

セカンダリコンテナ:サイドバーとさまざまなウィジェットで構成されます

「コンテンツボックスレイアウト」を選択すると、プライマリコンテナーのみがボックス形式で表示されます。 一方、セカンダリコンテナは背景なしのままです。

5.png

Webサイトのコンテンツ領域をサイドバーよりも目立たせたい場合は、このレイアウトを選択するのが理想的です。 簡単に言えば、コンテンツボックスレイアウトはコンテンツのウェブサイトやブログに最適です。

ボックスレイアウトの設定は次のようにあります。

 外観>カスタマイズ>グローバル>コンテナ

さらに、個々のページに異なるコンテナーを適用する場合は、メタ設定から行うことができます。

  • コンテンツボックスコンテナーは、メタ設定から、選択したページまたは投稿に適用できます。
  • サイトレイアウト設定は、コンテナの幅を決定します。
  • Astra Pro Addon pluginの助けを借りて、Colors&Backgroundsモジュールを介してサイトの背景色を変更できます。

アストラフリーテーマの特徴

アストラは間違いなくElementorにとって最高のテーマです。 Elementorとの相性も抜群で、ウェブサイト構築に最適な無料テーマです。 以下では、Astraを最高のテーマにする機能について説明しました。

全幅/ストレッチレイアウト

Astraは全幅/ストレッチレイアウトを提供します。これはElementorのために特別に作成されました。 Elementorはこのレイアウトを使用してレイアウトを完全に制御し、複雑なJavaScriptメソッドを組み込んで行またはセクションを全幅に拡張するという問題から解放されます。

全幅またはstretched.png

Astraを使用すると、サイドバー、ページタイトル、ブレッドクラム、特集画像を簡単に無効にして、Elementorで自由にデザインできます。 これらの機能を無効にすることで、空白のキャンバスを作成できます。これにより、Webサイトを最初から好きな方法でデザインできます。 Elementorがページを完全に制御できるように、カスタムランディングページを作成してAstraのヘッダーとフッターを無効にすることもできます。

ほとんどのテーマは、デフォルトでこれらの機能を出力するため、サイトを設計するユーザーの制御が減少します。

disable.png

カスタマイザのグローバルオプション

Astraのグローバルオプションを使用すると、必要なレイアウト、サイドバー、およびカスタマイザーのElementorに適したその他のカスタム設定を設定できます。 Elementorを使用してほとんどのページが設計されているWebサイトを構築している場合は特に、グローバルオプションが理想的です。

繰り返しになりますが、個々のページに異なる設定が必要な場合は、グローバルオプションがこれらの個別の設定によって上書きされます。

Global options.png

Elementor Pro2.0互換

Astraは、Elementor2.0テーマビルダーと完全に互換性のある数少ないテーマの1つです。 AstraとElementorPro 2.0 Theme Builderを使用することで、Webサイトのあらゆる側面をマイクロデザインできます。

elementor.png

Elementor統合

AstraはElementorとのスマートな統合を提供します。 Elementorでページを作成している場合、AstraはElementorに最適なオプションを自動的に設定します。 このスマートな統合により、他の重要なことに使用できる時間とエネルギーをかなり節約できます。

Astraは、30種類以上のヘッダーと、10種類以上のフッターを提供しています。 Astra Proアドオンを使用すると、カスタム要件に従って、elementorでヘッダーを最初から作成することもできます。

header footer.png

モバイルヘッダーオプション

Astraでモバイルレスポンシブサイトを作成できます。 Astraは、モバイルレスポンシブメニューに便利なソリューションを提供します。 これにより、美しいモバイルメニューを制御およびデザインできます。 カスタムコードなしでメニュー全体を構築できます。

mobile header.png

軽量&ブロートフリー

AstraはElementorをサポートしています。 Astraは軽量でモジュール式のテーマです。

light weight.png

「AstraFreeをテーマにした全幅またはボックス化されたコンテンツのセットアップ」に関する2つの考え

  1. Ik heb een vraag over het aanpassen van decontainer。 Dieはtestellenのdebreedteにあります。 Maar nergens lees ik hoe je de hoogte van de container box(blok)kuntinstellen。 Bijmijnサイトはerteveelwitです。 Ik zou de body tekst dichter op de header willen hebben door het blok waarin deze staat minder hoog temaken。

    1. こんにちは、高さの設定はありません。すべてのページセクションのコンテンツと余白によって定義されます。 あなたの場合、それはあなたのヘッダーまたは最初のセクションのマージン/パディングの問題だと思います。

コメントを残す

あなたのメールアドレスが公開されることはありません。 必須フィールドには*