<>

サイト画面の各名称と ルクセリタスの外観カスタマイズの設定|WordPress

WordPressテーマ ルクセリタスの機能のひとつに 外観カスタマイズがあります。

ルクセリタスでは 外観カスタマイズから かんたんに設定することができるのですが
サイト運営を始めたばかりでは それぞれの名称と役割など 分かりにくい項目などが多数あると思いますので
まずは これらの各名称などをしっかりと把握したうえで 設定していきたいと思います。

サイト画面の各名称とそれぞれの機能について

ここに これからカスタマイズに出てくる項目、サイト画面の主な項目を書いてみました。サイト画面- 各ブロックの位置と名称の図

① ブルーの部分 帯状メニューバーとグローバルナビゲーションは サイト内の情報を
分かりやすく伝えるためのメニュー表示になります。

パンくずリンクは ユーザーが 今どこにいるのかを 分かりやすくするために必要なリンク。

サイドバーと 記事の部分を 1カラム・2カラムと表現します。
両サイドに サイドバーを表示する場合 3カラム、サイドバーを設置しない場合は1カラムを選択します。

④ サイドバーには カテゴリー・新着記事・広告などを 自由に設置できるウィジェットがあります。

外観のイメージは これらのブロックや背景色などで 幾通りにも変化させることができます。

外観カスタマイズ

テーマによって外観カスタマイズの項目や設定・編集方法などがかなり違ってきます。

ルクセリタスの場合、かなりの項目を 外観カスタマイズから 仕上がりのイメージを確認しながら指定していくことができます。

外観カスタマイズへのアクセス

外観カスタマイズへは いろいろな場所から移動できるようになっています。

外観カスタマイズへのアクセス方法 - ① 管理画面 > Luxeritas > カスタマイズ(外観)、 ② 外観 > カスタマイズ から ③ サイト画面上部のバーに カスタマイズのリンクからアクセス

サイト画面をチェックしている最中でも 気になる箇所があればすぐに カスタマイズ画面へ移動できます。

外観カスタマイズは 画面左に編集項目の一覧があり 右側のサイト画面が
カスタマイズに合わせて画面が変更され表示されます。

主なカスタマイズ項目の使いかた

各項目の名称と使いかたの分かりにくいものを ピックアップしています。

それぞれの詳しい使い方などは 別記事にまとめていますので
合わせてご紹介させていただきます。

サイト情報とサイトアイコン

サイトのタイトル・キャッチフレーズは 管理画面の設定 >一般設定からも編集することが出来ます。

サイトアイコンは ブラウザーのタブや ブックマークバー・モバイルでは 検索表示リストに このアイコンが表示されます。

全体レイアウト

全体レイアウトでは コンテナのサイズや サイト画面に使用されるベースの色のほか4つの表示方法を選択します。

記事一覧
TOPページ・カテゴリーなどに記事の一覧が表示されますが
このデザインは グリッドレイアウトにも関連のある項目になります。

ページャー表示
サイト1ページに表示させる記事数は 管理画面の設定 > 表示設定から行います。


そこで設定された 記事数よりも多い場合は ページを付けてあげないと
一覧表示が分かりづらく 不親切な状態になってしまいます。

関連記事
記事に設定した カテゴリーや タグをもとに 関連記事が設定されます。

Next/Prev
Next/Prev は 記事の下に設置される ナビゲーションリンクです。

サイト内で使用するアイコンイメージ - ページ移動(prev)のアイコン

関連記事と Next/Prevは 投稿ページ・固定ページ それぞれに違う設定にすることが出来ます。

グリッドレイアウトと サムネイル画像(アイキャッチ)

先ほど出てきました記事一覧 の表示方法で タイル型やカード型といった
レイアウトや画像・タイトル・冒頭の文章などの表示方法を選んだりすることでグリッドレイアウトを作成します。

グリッドレイアウトに画像を入れる場合、とサムネイルの設定も関連していますので まとめて書かせて頂きます。

サムネイル画像を入れると 全体に色が入りすぎて嫌がられる場合もありますが
個人的には 文字ばかりのサイトよりも 画面が見やすくなるように思います。

記事一覧で使用される グリッドレイアウトでは横長の画像を使うことができますが
ルクセリタスでは サイドバーや 関連記事のサムネイルのサイズは正方形のままです。

注意
サイズの変更は CSSカスタマイズすることで変更可能ですが、
他の機能がうまく作動しなくなったりと危険ですので 初心者には おすすめしません。
変更する場合は気を付けて行ってください。

グリッドレイアウトのカスタマイズはこちら↓
【ルクセリタス】グリッドレイアウトとサムネイル(アイキャッチ)の組み合わせ

カラム操作

サイト画面- 各ブロックの位置と名称の図

先ほどの画像の③ カラムですが、投稿記事とサイドバーをどのような配置にするのかを
設定する項目で こちらも 投稿ページと固定ページを違うデザインで設定することが出来ます。

コンテンツ領域とサイドバー

コンテンツ領域は お好みで設定してもらえますが サイドバーに広告を設置する場合、
広告の画像(バナー)のサイズがありますので 良く使用されるサイズに合わせておくことをお勧めします。

ディスカッション

コメント欄やトラックバックの表示・非表示設定するのが ディスカッションの項目です。

ディスカッションの設定は こちらの外観カスタマイズと 管理画面のディスカッションから行います。
【ディスカッション】コメント欄の表示方法とウィジェットの設定 | WordPress – ルクセリタス

パンくずリンク

パンくずリンクは サイトの案内役のようなものです。
パンぐずリンクとカスタマイズの使いかた

ここでは、パンくずリンクを設置する場所やカラーを指定します。

色の選択が難しいと感じたら…カラーの色見本のサイトがありますので 色に迷った場合に役に立ちます!
無料で使用できる 色見本サイト→ WEB 色見本 原色大辞典

メニュー ( グローバルナビゲーション )と帯状のバー

サイトタイトルの下にあるバーが グローバルナビゲーション で 管理画面の外観 >メニューから 表示したい項目を作成します。

サイト画面の上部にある帯状のバーもメニューを設置することが出来る場所になります。

外観カスタマイズ-メニューの場所の画像

メニュー・グローバルナビ については こちらの記事にまとめています。
WordPressテーマ ルクセリタス|メニュー作成でグローバルナビゲーションを表示する

目次

目次は 見出しが多い記事の時にあると便利な機能です。

目次の設定やカスタマイズに関する項目はこちらにまとめました。
CSSで目次をカスタマイズしてみる – WordPress【 Luxeritas 】ルクセリタス

ブログカード

ブログカードは カード型になった URL(リンク)のことです。

最近は このスタイルがすごく多いですが、すべてのURLをカード型にしたくない場合は
直書きのURLをブログカード化する のチェックは付けずに 投稿画面から その都度設定し使い分けることができます。

追加CSS

追加CSS では さらにサイトのイメージに合わせて スタイルチェンジしたい場合、
実際のサイト画面を見ながら 色やサイズ感などの調整をすることができます。

外観カスタマイズ-追加CSS記述画面

以上、ルクセリタスの外観カスタマイズ 各項目の使いかたについてまとめてみました。