Duriza –Diviの子テーマの概要
公開: 2021-03-20Duriza Diviの子テーマは、サービス会社を念頭に置いて設計された多目的の子テーマです。 12ページ、アイコントリガー付きのカスタムスライダー、サービスをリンクするためのサイドバーサブメニューが含まれています。 この記事では、Durizaを詳しく見て、ニーズに合ったDiviの子テーマであるかどうかを判断できるようにします。
DurizaDiviの子テーマのインストール
インストールは簡単ですが、従うべきいくつかのステップがあります。 他のテーマと同じように、DurizaDiviの子テーマをインストールしてアクティブ化します。 まず、Diviをアクティブにして、テーマをアップロードしてアクティブにします。 Durizaのデモコンテンツのインストールは手動で行われます。 幸いなことに、手順は単純明快です。
次に、テーマオプション、テーマビルダー、テーマカスタマイザー、およびDiviライブラリの設定をアップロードする必要があります。 これらのファイルは、補足のzipファイルで提供されます。 ファイルにはラベルが付けられているため、簡単に識別できます。 最後に、ライブラリのレイアウトを使用してホームページやその他の必要なページを作成し、メニューに追加する必要があります。
ドキュメントには、グリッドへの画像の追加、ドロップダウンとサイドメニューへの矢印の追加、サイドメニューの作成、色の変更、ライブラリレイアウトを使用したブログ投稿の作成に関する情報が記載されています。
これらはすべて、思ったよりも簡単で、指示に従うのも簡単です。 ただし、少し時間がかかります。
DurizaDiviチャイルドテーマホームページ
Durizaホームページは、多くのテキストモジュール、宣伝文、ボタン、スライド、仕切り、および連絡フォームで構築されました。 ホームページの各セクションを見ていきます。 他のページも同様のデザインを使用しています。 すべてのページには、薄緑色のハイライトが含まれています。
Durizaホームページヒーローセクション
ヒーローセクションには、ページにリンクするヘッダーと大きな画像が表示されます。 ヘッダーはテーマビルダーで作成されます。 画像は複数列のレイアウトで配置され、片側に大きな画像があり、反対側に2つの小さな画像が積み重ねられています。 それらの暗いオーバーレイは、ホバーすると明るくなります。 オーバーレイには、タイトルと詳細を読むためのリンクが含まれています。
Durizaホームページサービスセクション
サービスセクションでは、大きなタイトルと短い説明でサービスを紹介します。 サービスは、画像、タイトル、ボタンを含む宣伝文で4列に表示されます。 この下で、サービスは、下部にタイトルが付いた単一の列のスライドで強調表示されます。 スライドにはボックスシャドウが含まれています。 背景には左側にドット模様があります。 ドキュメントには、画像を追加する方法が示されています。
表示されるスライドは、カーソルを合わせているスライドに対応しています。 これを実現するためにCSSはすでに行に追加されていますが、上記の例で行ったように、画像のURLをCSSスタイルシートに追加する必要があります。 画像はプリロードされているため、トランジションエフェクトを使用してホバーするとすぐに表示されます。
スライドの使用方法の例として、他のDiviレイアウトの画像アイコンとUnsplashの画像を追加しました。 画像はプリロードされるため、ホバーするとすぐに表示されます。 手順はこれをステップスルーします。 ページを更新しても画像が表示されない場合は、キャッシュをクリアすることをお勧めします。 これは、最も目立つセクションの1つです。
Durizaホームページセクションについて
会社とチームメンバーに関する情報は、会社概要ページを表示するボタン付きの全幅メッセージを表示します。 情報は2列のレイアウトで表示され、片側に大きな画像が表示され、反対側にチームメンバーのタイトルが表示されます。 点線の背景パターンは、右側のこのセクションに表示されます。
Durizaホームページプロジェクトセクション
プロジェクトは、オーバーレイを明るくするイントロダクションとホバーアニメーションを備えた3列のグリッドで表示されます。
Durizaホームページの紹介文セクション
テキストモジュール、仕切り、およびボタンは、紹介文のセクションを作成します。 この例が示すように、タイトル、短い紹介文、および紹介文のページにリンクするボタンを表示します。 濃い灰色の背景は他のセクションから際立っています。 緑のハイライトは、濃い灰色とうまく機能します。
Durizaホームページ連絡先セクション
連絡先セクションには、フルスクリーンの背景の上に配置された2つのボックスと、左端を覆うオーバーレイが含まれています。 連絡先情報は、白い背景の上にテキストとアイコンで最初のボックスに表示されます。 お問い合わせフォームは、紹介文のセクションと一致する濃い灰色の背景の上に表示されます。 両方のボックスに緑色のハイライトが含まれています。
DurizaDiviチャイルドテーマAboutUsページ
DurizaDiviの子テーマであるAboutPageは、側面にスタイル付きオーバーレイを備えた画像を含む全幅ヘッダーを備えたページを紹介します。 画像には、ストーリー、ビジョン、ミッションの行までスクロールダウンするリンクが表示されます。 これらの行には、画像とテキストが交互に表示されます。 このページには、ホームページの連絡先セクションも含まれています。
DurizaDiviチャイルドテーマサービスページ
Duriza Diviの子テーマの[サービス]ページには、宣伝文句内のサービスがグリッドに表示されます。 ボタンは個々のサービスページにリンクしています。 このページには、ホームページの連絡先セクションも含まれています。
DurizaDiviチャイルドテーマシングルサービスページ
単一のサービスページには、左側にスタイル付きメニューが表示された単一の列にサービスに関する情報が表示されます。 このメニューには、作成するカスタムウィジェットを表示するサイドバーモジュールが追加されています。 メニューのアニメーションにカーソルを合わせると、ページ名の背景が緑色に変わります。
DurizaDiviの子供向けテーマの声ページ
Duriza Diviの子テーマの紹介文ページには、テキストモジュールで作成された紹介文が3列のセクションに表示されます。 この例に見られるように、それらには星の評価、タイトル、詳細、および名前が含まれています。
DurizaDiviチャイルドテーマプロジェクトページ
Duriza Diviの子テーマ[プロジェクト]ページには、テキストモジュールを含む3列のグリッドにプロジェクトが表示されます。 画像にカーソルを合わせるまで、画像は暗くなります。
DurizaDiviチャイルドテーマシングルプロジェクトページ
Duriza Diviの子テーマの単一プロジェクトページでは、説明の上にプロジェクトのタイトルが表示され、右側のリストに日付、クライアント、タイプ、および請負業者の情報が表示されます。 プロジェクトの画像はこの下に表示されます。
DurizaDiviチャイルドテーマブログページ
Duriza Diviの子テーマのブログページには、右側のサイドバーが付いた1つの列に投稿が表示されます。 投稿には、注目の画像、タイトル、抜粋、スタイル付きの続きを読むボタンが表示されます。 サイドバーのウィジェットには、サイトに一致するスタイル付きの上部境界線と、他の3つの側面にかすかな境界線があります。 ヘッダーはページを紹介します。 ホバーすると、画像の上に緑色のオーバーレイが表示されます。
DurizaDiviチャイルドテーマシングルポスト
ブログ投稿はDiviBuilderで作成され、全幅の投稿タイトル、テキスト、コメント、および右側のサイドバーが含まれます。
フロントエンドでのデザインの外観は次のとおりです。 全幅で表示し、タイトルを表示しないようにDiviページを設定しました。 これにより、ヘッダー、フッター、およびモジュールのみを表示できます。
DurizaDiviチャイルドテーマお問い合わせページ
Duriza Diviの子テーマの連絡先ページには、クリックすると適切な連絡先情報にスクロールするリンクを含む画像が表示されます。 お問い合わせフォームのスタイルは、サイトの残りの部分と一致し、各フィールドの下部に緑色の境界線があります。
Durizaテーマビルダーのレイアウト
Duriza Divi子テーマのテーマビルダーレイアウトには、デフォルトテンプレートのグローバルヘッダーとフッター、すべてのカテゴリページのカスタムレイアウト、および404ページのカスタムレイアウトが含まれます。
Durizaヘッダー
ヘッダーには、ソーシャルメディアを含む2つのセクションと、上部のセクションに2つのボタン、下部のセクションにメニューが含まれています。 上部のセクションには2つの行があります。1つはデスクトップ用で、もう1つは電話とタブレット用です。
Visual Builderは両方の一番上の行を表示するので、それらで作業できます。 電話番号はボタンなのでクリック可能です。
ドゥリザフッター
Durizaのフッターはウィジェットのように見えますが、代わりにテキストと仕切りモジュールで作成されています。
その結果、ロゴ、ヘッダー、スタイル付きの仕切りを含むリンクのフッターリストは、ウィジェットだけでは簡単に実行できません。
Durizaすべてのカテゴリページ
すべてのカテゴリページテンプレートは、ブログページと同じです。 全幅ヘッダー、ブログ、サイドバーモジュールが含まれています。
Duriza404ページ
Durizaの404ページの本文部分は、全幅ヘッダーモジュールで作成されています。 オーバーレイにメッセージとボタンが表示されたフルスクリーンの背景画像が表示されます。
DurizaDiviの子テーマを購入する場所
DiviMarketplaceでDurizaDiviの子テーマを39ドルで購入します。 いつものように、Durizaには無制限のウェブサイトの使用と1年間の更新とサポートが含まれています。
終わりの考え
これが、DurizaDiviの子テーマです。 多目的の子テーマですが、ホームページにサービスを表示するカスタムスライドと、個々のサービスページにカスタムサブメニューがあるため、サービスWebサイトに最適です。 12ページには、サービスやプロジェクトを表示するための十分なページがあります。 スタイリングはシンプルでクリーンで、子供をテーマにしたエレガントなデザインです。
我々はあなたから聞きたい。 Duriza Diviの子テーマを試しましたか？ 以下のコメントであなたがそれについてどう思うか教えてください。
BRO.vector /shutterstock.com経由の注目の画像