君でも楽勝! WordPressでオシャレなブログを作ってみよう【Luxeritas編その5】

2020年2月24日ブログ管理Luxeritas,WordPress,WordPress基本設定,ルクセリタス,初心者

オサレブログ5ヘッダー

ぐず夫
ぐず夫
「小学4年生でも作れるオシャレ風ブログの作り方」の第5回目。
進行は今回も、ぐずぐず夫がお送りいたします(カンペ棒読み)。

トリ師匠
トリ師匠
今回は前回の続き、Luxeritasの設定をやるで。
項目としては「カスタマイズ(外観以外)の設定」じゃな。
ぐず夫
ぐず夫
そんなら張り切って行ってみよ~♪

ということで始まりました、「WordPressでオシャレ風ブログを作ってみよう!」の第5回目、「Luxeritas設定編その2」をお送りします。誰でも1から簡単に作れるWordPressブログを是非体験してみてね!

おされ風ブログてなにぃ?

トリ師匠
トリ師匠
そんなら引き続きやってくで。
今回は第8章の続きからやったな。
ぐず夫
ぐず夫
Luxeritasの管理設定やったか。
表には見えへんけど細かい部分の設定やったな。
トリ師匠
トリ師匠
ん、なら8章の「カスタマイズ(外観以外)」を進めるで準備し。
ぐず夫
ぐず夫
なんでもええでさっさと終わらそや。
トリ師匠
トリ師匠
コンセプトは引き続き「誰でも簡単に、誰でもマネできる」で懇切丁寧にやってくつもりじゃ。第8章「Luxeritasのカスタマイズをするで!」の「カスタマイズ(外観以外)を設定」をスタートじゃ!
ぐず夫
ぐず夫
ちなみにLuxeritasの使用バージョンは、
Luxeritas(親テーマ)が3.7.9.1、
Luxeritas Child Theme(子テーマ)が3.0.0
現在てことでヨロシク!

ちなみに作るサイトはこんな感じだぞ!

ブログイメージ

カスタマイズ(外観以外)を設定するで!

トリ師匠
トリ師匠
悪いんやけど、項目が多いで一気にザーッといくで。引き続き設定するパラメータ名は黒字、設定値は 太字 で書いてくから、自分とこの画面と見比べて見たってた。
こっちも細かな設定の中身とかは別に作ってあるでそっちを確認してな。あと先に言うとくけど、…あんまり変更してへんでよろしく。
ぐず夫
ぐず夫
…またまた適当やな
トリ師匠
トリ師匠
ここは設定した内容だけをツラ―っと並べるで。
そんでは早速Luxeritasメニューの「カスタマイズ」からスタートじゃ!
内部カスタマイズ選択
管理メニューの「Luxeritas」→「カスタマイズ」からスタート!

SEOタブ

トリ師匠
トリ師匠
「追加するタブ」の4つ全部チェック
「トップページの meta description」自分とこのサイトの紹介を書いとけばええんちゃうか。
「構造化データの設定」以下の設定初期値のまんまじゃ。ただし今回の例では変更してへんけど、必要に応じて設定したってな。

設定値以外の細かい説明はコチラ!

OGP関連タブ

トリ師匠
トリ師匠
「OGPを追加」チェックを入れて、
FacebookとTwitter必要に応じて設定じゃな。
こちらも個々の設定やで、必要に応じて設定したってな。

設定値以外の細かい説明はコチラ!

タイトルタブ

トリ師匠
トリ師匠
こちらの項目は初期値のまんまじゃ。
完全に好みの項目やから、それぞれで設定したってな。

設定値以外の細かい説明はコチラ!

ページネーションタブ

トリ師匠
トリ師匠
見栄えのために「全部の項目」6件にしてるで。
せやけど、今回は完全に見栄えのためだけにこの設定にしたで、
それぞれ自分の好みに応じて変更したってな!

設定値以外の細かい説明はコチラ!

AMPタブ

トリ師匠
トリ師匠
今回はごめんやけどAMP使ってへんので、項目は初期値やで。
「AMP有効化」未チェックで、
下の項目は全てそのままやな。
ぐず夫
ぐず夫
一度くらいAMP使ってみたらええんちゃうか?
トリ師匠
トリ師匠
そんなら次のサイト作る時は全部やってみよか
ぐず夫
ぐず夫
(やべ、やぶ蛇やった…)

設定値以外の細かい説明はコチラ!

PWAタブ

トリ師匠
トリ師匠
AMPに引き続き、PWAも今回使ってまへん。
「PWA有効化」未チェックで、下の項目も全て初期値でさ~ね。
ぐず夫
ぐず夫
PWAも使ったことないのう。
一度見てみなあかんな。
トリ師匠
トリ師匠
なら次回使ってみよか。
ぐず夫
ぐず夫
(あかん、またやぶ蛇やった…)

設定値以外の細かい説明はコチラ!

圧縮・最適化タブ

トリ師匠
トリ師匠
「HTMLの圧縮率」は、圧縮率・高に設定。
「子テーマのCSS圧縮」は、親と子のCSSを結合して圧縮するを選択したで。
あと今回は子テーマのJavaScriptを使用してへんから、
「子テーマのjavascript圧縮」必要ない(読み込まない)を選択したで。

設定値以外の細かい説明はコチラ!

CSSタブ

トリ師匠
トリ師匠
「モード選択」Luxeritas Modeを選択。
「テーマのCSSを~」チェックを入れて、
「WordPressのブロックライブラリ用CSS」CSSをHTMLに埋め込むを選択したで。
「子テーマのCSSを読み込み」チェックを入れて、
「シンタックスハイライターのCSS」は使用してへんで初期値のまま。
「ウィジェット用のCSS」は、今回【検索フォーム】【SNSフォローボタン】だけ使用してるでチェックしたで。
ぐず夫
ぐず夫
ブロックライブラリ用CSSて何?
トリ師匠
トリ師匠
Gutenberg(WordPress5)になってブロックて概念入ったやろ。そん中でブロックライブラリ用のCSSってのが自動で読み込まれるようになったんやけど、そいつの扱いどないしますってことなんやけどな。
ぐず夫
ぐず夫
(…なんのこっちゃ)
トリ師匠
トリ師匠
Gutenbergで普通にブロック使うなら必要ない以外を選べばええんやろけど、今回は非同期でなきゃあかん必要性も感じてへんから、埋め込みを選択した感じやな。意味わからへんのやったら、埋め込みにしとくのが無難やで。
ぐず夫
ぐず夫
な、ならそれでええわ。
トリ師匠
トリ師匠
あとブロックライブラリ用CSSの説明項目が追記されてへんから、
ちゃんと下のページに追加しとくんやで。わかったな!
ぐず夫
ぐず夫
うへへぇ…

設定値以外の細かい説明はコチラ!

javascriptタブ

トリ師匠
トリ師匠
「jQuery の読み込み方法」Google CDN jQuery v3を選択したで。
「Migrateを読み込み」「非同期にする」ともに未チェックや。
「bootstrap.jsの読み込み方法」は今回使用しないので必要ない(読み込まない)を選択。
「その他」の項目も全部使わないので3つとも未チェックやな。
ぐず夫
ぐず夫
全部使わへんくてええんか?
トリ師匠
トリ師匠
そもそも今回のコンセプトが「誰でもできる」じゃからの。
『ガッツリjavascript使いま~す』なんてこと言うわけにもいかんやん?
じゃからこれでええと思うわ。

設定値以外の細かい説明はコチラ!

Font Awesomeタブ

トリ師匠
トリ師匠
「Font Awesomeバージョン」Font Awesome5を選択。
「アイコンの読み込み方法」Web Fonts with CSSで、
「下位互換」チェックを入れたで。こうしとけば4の互換も効くからな。
ぐず夫
ぐず夫
ふむふむ
トリ師匠
トリ師匠
「CSS の読み込み方法」非同期
「CSSの読み込み元」ローカル
「フォントファイル本体の読み込み元」CDNにしたで。
ぐず夫
ぐず夫
ところでWeb FontsとSVGてなんやの?
トリ師匠
トリ師匠
う~ん、これぐず夫にどう説明してええんやろか。
根本的な話をすれば、アイコンを表示するのに『画像(WebFonts側)』を使うか『コード(SVG側)』を使うかって話なんやけどな。う~ん、1行で説明するにはムズいで…
ぐず夫
ぐず夫
(…な、なんのこっちゃ)
トリ師匠
トリ師匠
将来的にはSVGが主流になるんやろけど、現状は作者さんが推奨としてるWeb Fontsを選択しとけばええ思うで。今んとこ機能差ないみたいやし、初心者さんはあまり気にせんでええ思うわ。あとぐず夫、この項目も説明の章があらへんから、下にちゃんと追記しとくんやで!
ぐず夫
ぐず夫
うへぇ…

設定値以外の一部説明はコチラ!

検索タブ

トリ師匠
トリ師匠
今回は特に変更してへんで。
検索結果の見た目的な表示は、「外観カスタマイズ」の「グリッドレイアウト」の項目も関係してるから、細かな見た目(文字色とか表示文字数とか)については、各自必要に応じて触ったってな。

設定値以外の細かい説明はコチラ!
グリッドレイアウト設定はコチラ!

画像認証タブ

トリ師匠
トリ師匠
今回はコメント機能をオフにしてるで、特に変更の必要はなしや。
コメント機能を使用する場合は、別途下のページ見ながら準備したってな!

設定値以外の細かい説明はコチラ!

コピーライトタブ

トリ師匠
トリ師匠
こちらも初期値のままやな。
自分好みの表示にしたらええと思うで。

設定値以外の細かい説明はコチラ!

その他タブ

トリ師匠
トリ師匠
今回は全部初期値のままやな。
「リンクへの自動変換防止」なんかは好みやから、必要なら変更したってな。

設定値以外の細かい説明はコチラ!

ひとまずカスタマイズ終了

ぐず夫
ぐず夫
項目が多い!
それにまだいくつか残ってるで!
トリ師匠
トリ師匠
「管理機能」「高速化一括設定」の項目は、サイトのバックアップを設定してからのがええから最後に回させてもらうで。よくよく考えると、最後に調整の項目足りてへんから、ちぃとだけ最後に追加するかもしれんでよろしく。

そんなら次回は、いよいよCSSで細かい部分を見ていくで。ではまた~♪

☆ 引き続きCSSの設定に行くで!


この記事はワシが書いたで !!
ぐず夫ちゃん

誰もがWordPressでサイトを作れたらええな~!と思ってブログを始めたで。記事のやり取りはふざけてるけど、中身はいたって真面目やで堪忍な! 要望はTwitterで受け付け中♪

オリジナルグッズも売ってるでコチラからどぞ!

Posted by ぐず夫