2019年のトップ10Diviチュートリアル

今年は、ElegantThemesブログのDiviコンテンツにとって史上最大の年でした。 これまでで最高のチュートリアルのいくつかを含む何百もの投稿を公開しました。 この投稿では、私たちの編集スタッフの優れた仕事を強調する機会を利用して、最も人気のある（その年に最も訪問された）10のDiviチュートリアルを強調したいと思いました。 そしてもちろん、コミュニティの皆さんに、自由に使える最高のDiviリソースのほんの一部を思い出させてください。

2019年のトップ10Diviチュートリアル

1.あなたのDiviウェブサイトをスピードアップするための究極のガイド

実際、Diviには、以前の更新で追加された多くのパフォーマンスの強化があり、Diviサイト（およびDivi Builder）の実行がこれまでになく高速になっています。 さらに、Diviはサードパーティの最適化を念頭に置いて構築されています。 WordPressに使用されるパフォーマンス最適化プラグインの多くは、DiviWebサイトの速度パフォーマンスを向上させるためにも使用できます。

この投稿では、Diviを高速化するためにすでに行われていることと、それをさらに高速化するために何ができるかを探ります。

この投稿を読む

2.DiviまたはExtraとWPMLを使用して多言語Webサイトを作成する方法

DiviとExtraを使用して多言語Webサイトを作成するのは簡単です。 どちらもWPMLに対応しているため、DiviとExtraを使用して多言語のWebサイトを作成できます。 WPMLは、DiviおよびExtraとの互換性を向上させる変更を加え、Webサイトの翻訳をさらに簡単にする機能を追加しました。 この記事では、DiviまたはExtraとWPMLを使用して多言語Webサイトを作成する方法を説明します。

この投稿を読む

3.組み込み設定を使用して実現できる5つのクリエイティブDiviヘッダーモジュールスタイル

箱から出して、Diviヘッダーモジュールは、わずかな調整で印象的なヘッダーデザインを作成できます。 これにより、DiviでWebサイトのヘッダーをデザインするときに非常に人気のあるモジュールになります。 そして、少し独創的な考え方で、組み込みの設定のみを使用して（カスタムCSSなしで）いくつかの本当にユニークなデザインを作成できます。 それで、いくつかの新しいヘッダーデザインを探求したい人のために、私はあなたにインスピレーションを与えるかもしれない5つのDiviヘッダーモジュールスタイルをあなたに紹介するつもりです。

この投稿を読む

4.異なるブレークポイントでのDiviGalleryモジュールの列数の変更

Divi Gallery Moduleを使用すると、レスポンシブグリッドレイアウトで美しい画像ギャラリーを作成できます。 ギャラリーは、画像のサイズを拡大縮小し、さまざまなブラウザの幅に応じてグリッドの列数を調整するため、応答性が高いと見なされます。

デフォルトでは、ギャラリーモジュールには、グリッド内の列数を調整する3つのブレークポイント（特定のブラウザー幅でスタイルが変更されるポイント）があります。 画像ギャラリーはデスクトップでは4列で表示され、タブレットでは3列、小型タブレット（および大型電話）では2列、電話では1列に分割されます。

このデフォルト設定は通常ほとんどの場合に機能しますが、特定のブラウザ幅で表示される列の数をより細かく制御する必要がある場合もあります。 そのため、このチュートリアルでは、デスクトップだけでなく、3つの追加のブラウザーブレークポイントについても、Divi GalleryModuleに表示される列の数を完全に制御する方法を示します。

この投稿を読む

5.Diviのテーマビルダーを使用してカスタムグローバルヘッダーを作成する方法

テーマビルダーがここにあるので、WebサイトをAからZにセットアップするのに役立つ新しいチュートリアルに飛び込むのが待ちきれません。これには、Diviの組み込みオプションを使用したカスタムヘッダーの作成が含まれます。 このチュートリアルでは、Diviのテーマビルダーを使用してグローバルヘッダーを作成することに焦点を当てます。 そのページまたは投稿に別のヘッダーを割り当てていない限り、グローバルヘッダーはWebサイトのいたるところに表示されます。

この投稿を読む

6.プラグインなしでDiviの任意のモジュールでフリップカードを作成する方法

フリップカードは、ユーザーがWebサイトを操作するための楽しい方法です。 クールなフリップアニメーションを提供するだけでなく、1つの簡潔な場所で追加情報を提供することもできます。 このチュートリアルでは、プラグインを使用せずにDiviモジュールをフリップカードに変換する方法を紹介します。 この方法では、1つのDiviモジュールをカードの前面として使用し、別のDiviモジュールをカードの背面として使用できます。 diviビルダーを使用して、各モジュール（前面と背面）を好きなように設計することもできます。 この機能は、CSSのほんの数スニペット（jqueryなし）によって実現されます。

この投稿を読む

7.Diviで会社のロゴを表示するシンプルでクリエイティブな方法

あなたのウェブサイトに会社のロゴを表示する理由はたくさんあります。 会社のロゴの「注目」セクションは、潜在的な投資家やパートナーに影響を与える可能性があります。 または、「クライアントに含める」セクションは、訪問者との貴重な社会的証明を確立することができます。 しかし、理由が何であれ、これらのロゴをWebサイトに追加する方法を知ることは重要です。 このチュートリアルでは、Diviを使用してWebサイトに会社のロゴを追加するための3つの異なる方法について説明します。 Diviモジュールにロゴギャラリーを追加する方法も紹介します。

この投稿を読む

8.Diviの紹介文モジュールをスタイリングできる5つの素晴らしい方法

訪問者が常にウェブサイトで探しに行く1つのことは、推薦状です。 それらは信頼性を表し、あなたのウェブサイトを訪問するときにリードまたは潜在的なクライアントが持つ意思決定プロセスに影響を与えます。 共有する強力な紹介文があることを確認するだけでなく、視覚的に魅力的なものにすることも重要な役割を果たします。 この投稿では、組み込みのオプションのみを使用して、Divi証言モジュールのスタイルを設定できる5つの素晴らしい方法を紹介します。

この投稿を読む

9.各スライドで特定の要素を変更するためにDiviスライダーをカスタマイズする方法

スライダーは、ウェブサイトの折り畳み上にある主要なセクションを最大化するのに最適であることは誰もが知っています。 彼らはすごい！ ユーザーは、ページを下にスクロールしなくてもスライドして表示される複数のCTAと重要な機能で歓迎されます。 ただし、スライドごとにデザインやコンテンツを変更しすぎると、訪問者の注意をそらしたり、圧倒したりすることがあります。 そのため、このチュートリアルでは、スライドの遷移ごとに特定の要素のみを変更するようにDiviスライダーをカスタマイズする方法を紹介します。 これにより、各スライドで特定の要素（1つの単語やボタンなど）のみを変更しながら、スライダーのコアコンテンツとデザインコンポーネントの一貫性を保つことができます。 訪問者は変更を簡単に処理し、行動を促すフレーズを明確に理解できるようになります。

この投稿を読む

10.Diviでカスタムフォトギャラリースライダーを作成する方法

スライダーは、折り目の上の1つの便利な場所にある注目のサービス、製品、またはページでユーザーを引き付けるのに最適であることは誰もが知っています。 一部のサイト（写真家だと思います）では、ホームページに1つ以上のフォトギャラリーを掲載する必要があります。 これにスライダーを使用するのは良いオプションかもしれません。 ただし、このようなスライダーでフォトギャラリーを表示することを検討していない可能性があります。

このチュートリアルでは、Diviイメージギャラリーをスライドに埋め込んで、Diviで完全にカスタムのフォトギャラリースライダーを作成する簡単な方法を紹介します。 秘訣は、スライダーのコンテンツ領域にWordPress画像ギャラリーを作成することです。 次に、デフォルトのWordPressギャラリースタイルの代わりにDiviギャラリーを使用するオプションを確認して選択する必要があります。 実装がとても簡単で楽しいです。

この投稿を読む

結論は

毎年、私たちが焦点を当てているDiviコンテンツの種類は、リリースされる新機能に大きく依存します。 新しい機能のリリースを、それを使用する方法を人々に教える多くの新しいチュートリアルで補完し、興味深い方法でそれらの機能を限界まで押し上げることが最善であると私たちは感じています。 ただし、このアプローチは、私たちが多くのことを飛び回ることを意味し、いくつかのトピックがカバーされていない可能性があります。 したがって、新年に取り組むことができるDiviチュートリアルのリクエストがある場合は、以下のコメントセクションで共有してください。キューに追加されます！

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