Divi でサイトを作成したら、ぜひオプション設定も変更しましょう。Divi はテーマのオプションを専用のメニューでいろいろと変更できるようになっています。今回はぜひ設定しておいた方が良いおすすめの設定を図解します。

Divi レッスン9 テーマのオプションのおすすめ設定

1.テーマのオプション設定の場所

テーマのオプションを設定するには、ワードプレスダッシュボードの、

「Divi」>「テーマのオプション」をクリックします。

下記のパネルが表示されるので、それぞれGeneral、Navigation、ビルダー、Layout、Ads、SEO、Integration、Updatesをタブで切り替えて選択し表示させることができます。

2.サイトのロゴをオプション設定する

まずはウェブサイトのロゴを設定します。Divi は標準状態では、下記の赤枠ように Divi のアイコンが表示されていると思います。そのロゴを変更します。

General(一般)でロゴをアップロードする

テーマのオプションの General(一般)を開き、

「ロゴ」の「アップロード」をクリックすると、メディアライブラリが表示されるので、

表示させたい画像を選択して「ロゴとして設定」をクリックします。
「変更を保存」をクリックして保存します。

サイトのロゴがアップロードした画像に変更されます。またこのロゴ画像はファビコンとしても利用されます。

3.サイト高速化のためのオプション設定をする

1)Javascript と CSS を圧縮する

Divi には Javascript と CSS の圧縮を特にプラグインを追加することなく設定できます。

テーマのオプションの General(一般)を開き、

  • Minify And Combine Javascript Files
  • Minify And Combine CSS Files

を有効にします。

「変更を保存」をクリックして保存します。

2)使わない Google Fonts を消すオプション設定

Google Fonts(フォント)の読み込みにも多少は時間を使うので、必要なければ消しましょう。今回、フォントは「游ゴシック」を使うことにして、使わない Google Fonts は消すことにします。

この設定もテーマのオプションの General(一般)にあります。

「Use Google Fonts」をクリックして無効にします。
「Google Fonts のサブセット」をクリックして無効にします。
「変更を保存」をクリックして保存します。

3)静的 CSS ファイルを生成させる

CSS ファイルのキャッシュを作成しておくことで、速度を上げることができます。Divi では特にプラグインを追加することなく設定できる機能があります。

テーマのオプションの「ビルダー」>「詳細設定」を開き、静的 CSS ファイルの生成を有効にします。

「変更を保存」をクリックして保存します。

4.SNS と RSS をオプション設定する

Divi だけで Facebook、Twitter、Google+、Instagram のフォローボタン、RSS フィードを設定できます。

テーマのオプションの General(一般)を開き、

使用したいアイコンのみにしましょう。Google+ は個人向けのサービスを終了したので、抜いても良いかもしれません。

各 SNS のプロフィール URL を入力する枠があるので、そこに設定します。

ところで、RSS フィードは特に設定しなければ、標準で「ドメイン/feed/」になります。

「変更を保存」をクリックして保存します。

5.SEO のためのオプション設定をする

1)正規化 URL’s を設定する

SEO 対策の一つとして、URL の正規化があります。Divi では特にプラグインを追加することなく設定できます。

テーマのオプションの「SEO」>「ホームページSEO」「シングル記事ページSEO」「インデックスページSEO」をそれぞれ開き、

「正規化 URL’s を有効にする」を有効にします。
「変更を保存」をクリックして保存します。

以上はぜひ設定しておいた方が良いでしょう。おすすめします。

ワードプレス Divi レッスン Diviの使い方図解

写真サイトを構築する際に、役に立ちそうな設定や情報をまとめています。こちらは、ワードプレステーマ Divi に関連する記事の目次ページとしています。なるべく図を用いて簡単に説明するようにしています。参考にどうぞ。

Divi モジュールの使い方7 投稿タイトルと投稿ナビゲーション

今回は Diviの各種モジュールのうちから「投稿タイトル」と「投稿ナビゲーション」のモジュールの使い方について、Divi初心者向けに図解したいと思います。Divi モジュールの使い方7...

Diviの使い方10-5 お問い合わせフォームモジュールの利用方法

今回は Divi の各種モジュールのうちから、お問い合わせフォームモジュール(Contact Form)について図解したいと思います。 Diviの使い方10-5...
divi-reference2-logo

ワードプレス Divi リファレンス2 テーマのオプションの設定方法

Divi では専用のオプションメニューを利用して様々な設定を行えるようになっています。今回はその「テーマのオプション」の設定方法について図解します。Diviの使い方9...

動画 と 動画スライダーモジュール Diviの使い方10-3

今回は Divi の各種モジュールのうちから、動画モジュールと動画スライダーモジュールについて図解したいと思います。 動画と動画スライダーモジュール Diviの使い方10-3...

ワードプレス Diviの使い方 7-2 イラストの形にグラデーション画像を表示する

前回は文字の形に画像を切り抜いて表示させましたが、今回はイラストの形にグラデーション画像を切り抜いてみましょう。Divi Builder...
divi-lesson1-logo

ワードプレステーマ Diviの使い方1 Diviとは?~インストールまで

WordPress(ワードプレス)のテーマは数多くあるのですが、世界で一番多くインストールされ利用されているテーマはこの「 Divi 」になるのではないかと思います。入門講座として、...

Pin It on Pinterest