ルクセリタスでキャッチフレーズ変更表示とサイトアイコンやタイトルの設定方法

今回は、サイトタイトルやロゴなどヘッダーまわりの設定と、サイトアイコン(ファビコン)の設定方法などです。

タイトルやキャッチフレーズの設定はワードプレスの一般設定で行える基本の設定ですが、ルクセリタスでは、ワードプレスで設定するキャッチフレーズとは別にもうひとつサイトに表示できるキャッチフレーズを設定出来ます。

 

 

 


 

ルクセリタスのヘッダー構造

 

ルクセリタスのヘッダーは、ヘッダー背景、ワンポイント、サイトタイトル、ロゴのそれぞれの画像もセットすると上図のような配置になっています。

  • ヘッダー上の帯状メニュー
  • ヘッダー背景画像
  • ワンポイント画像
  • サイトタイトル(テキストまたは画像)
  • キャッチフレーズ
  • グローバルナビメニュー
  • ロゴ画像(ナビの上または下に配置可能)

 

 

タイトル・キャッチフレーズ

ワードプレスの「設定」→「一般」で設定。

 

ここで設定しているものが、以下のカスタマイザーでの初期表示になります。

 

「外観」→「カスタマイズ」からカスタマイザーを開きます。

 

「サイト情報/サイトアイコン」を選択します。

サイトタイトル・キャッチフレーズを入力します。

 

ここで設定変更すると、ワードプレス設定も変わります。

 

↓ 自動で変わる

 

キャッチフレーズの表示・非表示

「外観」→「カスタマイズ」→「細部の見た目」

「ヘッダーのキャッチフレーズを表示」にチェックを入れると表示されます。

 

キャッチフレーズを独自に変更してサイト表示

冒頭でも記載した通り、タイトルとキャッチフレーズの設定はワードプレスの設定と連動していて、検索結果などに表示されたり、ページタイトルとしてブラウザのタブに表示されるものです。

このキャッチフレーズの部分を変更して、サイト内にのみ表示させることが出来るルクセリタス独自の機能があります。

 

「外観」→「カスタマイズ」→「細部の見た目」

「ヘッダーのキャッチフレーズを表示」にチェックを入れ、

「ヘッダーのキャッチフレーズ変更」にサイトで表示させたいキャッチフレーズを入力します。

 

ページのタイトルは通常のキャッチフレーズに設定されたものがブラウザのタブに出ています。

 

キャッチフレーズをサイト名(またはロゴ)と並列で表示する方法は以下をご覧下さい。

ルクセリタスのヘッダーカスタマイズ:キャッチフレーズを横並びに表示
ルクセリタスのキャッチフレーズを、サイト名やサイトロゴの右側に並列して表示する方法です。 ルクセリタスのキャッチフレーズは、WordPressで設定するものとは別にも設定可能で、便利です。 キャッチフレーズ設定方法 通常のキャッチフレーズ ...

 

タイトルの表示方法設定

 

「Luxeritas」→「カスタマイズ」から「タイトル」タブを選択
セパレーターの記号、タイトルの表示スタイルを選択します。

 

タイトル・ロゴのアニメーション設定

カスタマイザーの「アニメーション」を選択します。

 

動きの詳細は開発者るなさんの以下の記事をご覧ください。
パララックス・オープニングアニメの追加など Luxeritas 3.6.9

上記ページの中央あたりに各アニメーションのデモを見れるリンクがあります。

 

サイト名のアニメーションは以下で設定します。

 

サイトアイコン

「外観」→「カスタマイズ」からカスタマイザーを開きます。

 

「サイト情報/サイトアイコン」を選択します。

「画像を選択」から設定します。

 

 

サイトアイコンに適した画像をセットする

サイトアイコンはブラウザのタブに表示できるサイト独自のアイコンです。

正方形や円のものや透過処理した画像がGood★

Web上で透過や丸抜きできる便利なサイトなどもあります。

PEKO STEP(透過)
画像丸抜きくん

 

白いアイコンの例

 

白いアイコンは背景をつけて丸抜きにするときれいに表示されます。

 

黒いデザインのブラウザでは

 

透過画像の例

黒いデザインのブラウザでは

 

 

タイトルをロゴ(画像)にする

サイトタイトルは文字のままでもOKですし、ロゴなどの画像にする事も出来ます。

画像か文字かどちらか1つなので、画像の設定をすれば画像、しなければ文字で表示されます。

 

「背景・タイトル・ロゴ画像」を選択します。

 

サイトタイトル画像をセットします。

 

 

ワンポイント画像

 

上記のように、ワンポイント画像も設定すると、タイトルの左側に表示されます。

 

ロゴ画像

 

サイトタイトル画像以外に、ロゴ画像も設定できます。

グローバルナビの上または下に配置可能。

 

 

タイトルまわりの設定は以上です!

 

 

綾糸: 綾糸 主婦 1990年代、汎用機時代のエンジニア 趣味で長くやっていたweb制作は、未だにエディタでの手コーティング 現在は自宅でゆるりとweb制作やライターをしています