ロード画面を表示&カスタマイズできるTCDテーマオプション

多くのTCDテーマには、ロード画面を表示&カスタマイズできる機能が備わっています。

サイト訪問時やページ読み込み時に表示されるロード画面を、お好みに合わせて設定可能です。

当記事では、TCDテーマオプション「ロード画面」の設定方法を解説いたします。

設定方法

まずは、ダッシュボード内の下記箇所を開きます。

中に「ロード画面を表示する」というチェックボックスがあります。

チェックを入れると、次の設定項目が展開します。

こちらで諸設定を行なって「設定を保存」すると、ロード画面が表示されるようになります。

次の3ステップで各設定を進めます。

1. ロード画面のタイプを選ぶ。
2. タイプに応じた詳細を設定する。
3. その他の設定を行う。

1. ロード画面のタイプを選ぶ。

比較的新しいTCDテーマには、次の5タイプが用意されています。

• サークル（アイコン）
• スクエア（アイコン）
• ドットサークル（アイコン）
• ロゴとキャッチフレーズ（オリジナル画像やテキスト）
• キャッチフレーズとロゴを別々の画面に表示

ここで選択したロード画面のタイプに応じて設定を進めていきます。

2. タイプに応じた詳細を設定する。

3種のアイコンの設定

テーマ内蔵のアイコン3種のいずれかを選択した場合は、アイコンの色を設定します。

「その他の設定」内で背景色も設定可能です。

ロゴとキャッチフレーズ

ロゴとキャッチフレーズを選択すると、オリジナルのロゴ画像やテキストを登録できます。

ロゴとキャッチフレーズの両方もしくは、いずれかを登録して設定を保存します。キャッチフレーズは、フォントタイプ、フォントサイズ、カラーも変更可能です。

キャッチフレーズとロゴを別々の画面に表示

こちらのタイプもキャッチフレーズとオリジナルのロゴ画像を登録できます。

先ほどのタイプと、設定項目こそ似ていますが、それぞれが別の画面に表示されます。冒頭でご覧いただいたこちらのタイプです。

キャッチフレーズが表示された後、別の画面でロゴが表示されていますね。

そのため、次のセクションの「その他の設定」内にて

• キャッチフレーズ画面の背景色
• ロゴ画面の背景色

という2種類の背景色を登録できるようになっているわけです。上の例では黒とオレンジを設定しています。

3. その他の設定を行う。

最後に「その他の設定」を行います。

ここでは以下の設定が用意されています。

表示回数を「一度だけ」に設定すると、クッキーによって制御される仕様です。そのため、一度でもロード画面を表示したユーザーには、クッキーが消えるまで表示されなくなります。

「初回訪問時のみロード画面を表示する」という動作を実現できるわけです。

ロード完了後のアニメーションの各種サンプル（WordPressテーマ「REHUB」の設定例）を貼っておきます。動きの参考程度にご覧ください。

これはgifアニメーションなので、実際の動きはもっと綺麗です。

その場でフェード表示されます。

上からふわっと降りてくる動きです。

横にスライドアウトする躍動感のある動きです。

上にスライドアウトする動きです。緞帳が上がるような動きですね。

TCDテーマのロード画面を活用しよう。

ロード画面を表示&カスタマイズできるTCDテーマオプションについてご紹介いたしました。プラグイン無しで、幅広いカスタマイズが可能です。

毎回表示されると煩わしいロード画面ですが、表示するページや表示回数を制御できれば、サイトのブランディングにも活かせます。「トップページにだけ毎回表示する」というようなウェルカムページのような使い方も可能です。

サイトのキャッチフレーズやロゴ画像がある方は、ぜひかっこいいロード画面をつくってみてください。

ロード画面の役割についてはこちらの記事も参考にご覧ください。