君でも楽勝！ WordPressでオシャレなブログを作ってみよう【Luxeritas編その5】
「小学4年生でも作れるオシャレ風ブログの作り方」の第5回目。
進行は今回も、ぐずぐず夫がお送りいたします(カンペ棒読み)。
進行は今回も、ぐずぐず夫がお送りいたします(カンペ棒読み)。
今回は前回の続き、Luxeritasの設定をやるで。
項目としては「カスタマイズ(外観以外)の設定」じゃな。
項目としては「カスタマイズ(外観以外)の設定」じゃな。
そんなら張り切って行ってみよ～♪
ということで始まりました、「WordPressでオシャレ風ブログを作ってみよう！」の第5回目、「Luxeritas設定編その2」をお送りします。誰でも1から簡単に作れるWordPressブログを是非体験してみてね！
目次やん
おされ風ブログてなにぃ？
全体の構成はコチラ！！
1．WordPressの簡単なおさらいや！
2．ドメインを購入するで！
3．サーバーを借りるで！
4．WordPressをインストールするで！
5．テーマをインストールするで！
6．ブログの基本的設定をするで！
7．プラグインを追加するで！
8．Luxeritasのカスタマイズをするで！
9．CSSで細かい見た目の設定するで！
10.Search ConsoleとAnalyticsも導入や！
11.バックアップ作成までで完了や！
Ex.やり残し作業をちょいちょいと！
そんなら引き続きやってくで。
今回は第8章の続きからやったな。
今回は第8章の続きからやったな。
Luxeritasの管理設定やったか。
表には見えへんけど細かい部分の設定やったな。
表には見えへんけど細かい部分の設定やったな。
ん、なら8章の「カスタマイズ(外観以外)」を進めるで準備し。
なんでもええでさっさと終わらそや。
コンセプトは引き続き「誰でも簡単に、誰でもマネできる」で懇切丁寧にやってくつもりじゃ。第8章「Luxeritasのカスタマイズをするで！」の「カスタマイズ(外観以外)を設定」をスタートじゃ！
ちなみにLuxeritasの使用バージョンは、
Luxeritas(親テーマ)が3.7.9.1、
Luxeritas Child Theme(子テーマ)が3.0.0
現在てことでヨロシク！
Luxeritas(親テーマ)が3.7.9.1、
Luxeritas Child Theme(子テーマ)が3.0.0
現在てことでヨロシク！
8章の小項目！
カスタマイズ(外観以外)を設定するで！
悪いんやけど、項目が多いで一気にザーッといくで。引き続き設定するパラメータ名は黒字、設定値は 太字 で書いてくから、自分とこの画面と見比べて見たってた。
こっちも細かな設定の中身とかは別に作ってあるでそっちを確認してな。あと先に言うとくけど、…あんまり変更してへんでよろしく。
こっちも細かな設定の中身とかは別に作ってあるでそっちを確認してな。あと先に言うとくけど、…あんまり変更してへんでよろしく。
…またまた適当やな
ここは設定した内容だけをツラ―っと並べるで。
そんでは早速Luxeritasメニューの「カスタマイズ」からスタートじゃ！
そんでは早速Luxeritasメニューの「カスタマイズ」からスタートじゃ！
SEOタブ
「追加するタブ」の4つは全部チェック。
「トップページの meta description」は自分とこのサイトの紹介を書いとけばええんちゃうか。
「構造化データの設定」以下の設定は初期値のまんまじゃ。ただし今回の例では変更してへんけど、必要に応じて設定したってな。
「トップページの meta description」は自分とこのサイトの紹介を書いとけばええんちゃうか。
「構造化データの設定」以下の設定は初期値のまんまじゃ。ただし今回の例では変更してへんけど、必要に応じて設定したってな。
OGP関連タブ
「OGPを追加」にチェックを入れて、
FacebookとTwitterは必要に応じて設定じゃな。
こちらも個々の設定やで、必要に応じて設定したってな。
FacebookとTwitterは必要に応じて設定じゃな。
こちらも個々の設定やで、必要に応じて設定したってな。
タイトルタブ
こちらの項目は初期値のまんまじゃ。
完全に好みの項目やから、それぞれで設定したってな。
完全に好みの項目やから、それぞれで設定したってな。
ページネーションタブ
見栄えのために「全部の項目」を6件にしてるで。
せやけど、今回は完全に見栄えのためだけにこの設定にしたで、
それぞれ自分の好みに応じて変更したってな！
せやけど、今回は完全に見栄えのためだけにこの設定にしたで、
それぞれ自分の好みに応じて変更したってな！
AMPタブ
今回はごめんやけどAMP使ってへんので、項目は初期値やで。
「AMP有効化」を未チェックで、
下の項目は全てそのままやな。
「AMP有効化」を未チェックで、
下の項目は全てそのままやな。
一度くらいAMP使ってみたらええんちゃうか？
そんなら次のサイト作る時は全部やってみよか
(やべ、やぶ蛇やった…)
PWAタブ
AMPに引き続き、PWAも今回使ってまへん。
「PWA有効化」は未チェックで、下の項目も全て初期値でさ～ね。
「PWA有効化」は未チェックで、下の項目も全て初期値でさ～ね。
PWAも使ったことないのう。
一度見てみなあかんな。
一度見てみなあかんな。
なら次回使ってみよか。
(あかん、またやぶ蛇やった…)
圧縮・最適化タブ
「HTMLの圧縮率」は、圧縮率・高に設定。
「子テーマのCSS圧縮」は、親と子のCSSを結合して圧縮するを選択したで。
あと今回は子テーマのJavaScriptを使用してへんから、
「子テーマのjavascript圧縮」は必要ない(読み込まない)を選択したで。
「子テーマのCSS圧縮」は、親と子のCSSを結合して圧縮するを選択したで。
あと今回は子テーマのJavaScriptを使用してへんから、
「子テーマのjavascript圧縮」は必要ない(読み込まない)を選択したで。
CSSタブ
「モード選択」はLuxeritas Modeを選択。
「テーマのCSSを～」はチェックを入れて、
「WordPressのブロックライブラリ用CSS」はCSSをHTMLに埋め込むを選択したで。
「子テーマのCSSを読み込み」はチェックを入れて、
「シンタックスハイライターのCSS」は使用してへんで初期値のまま。
「ウィジェット用のCSS」は、今回【検索フォーム】と【SNSフォローボタン】だけ使用してるでチェックしたで。
「テーマの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つとも未チェックやな。
「Migrateを読み込み」と「非同期にする」はともに未チェックや。
「bootstrap.jsの読み込み方法」は今回使用しないので必要ない(読み込まない)を選択。
「その他」の項目も全部使わないので3つとも未チェックやな。
全部使わへんくてええんか？
そもそも今回のコンセプトが「誰でもできる」じゃからの。
『ガッツリjavascript使いま～す』なんてこと言うわけにもいかんやん？
じゃからこれでええと思うわ。
『ガッツリjavascript使いま～す』なんてこと言うわけにもいかんやん？
じゃからこれでええと思うわ。
Font Awesomeタブ
「Font Awesomeバージョン」はFont Awesome5を選択。
「アイコンの読み込み方法」はWeb Fonts with CSSで、
「下位互換」にチェックを入れたで。こうしとけば4の互換も効くからな。
「アイコンの読み込み方法」はWeb Fonts with CSSで、
「下位互換」にチェックを入れたで。こうしとけば4の互換も効くからな。
ふむふむ
「CSS の読み込み方法」は非同期、
「CSSの読み込み元」はローカル、
「フォントファイル本体の読み込み元」はCDNにしたで。
「CSSの読み込み元」はローカル、
「フォントファイル本体の読み込み元」はCDNにしたで。
ところでWeb FontsとSVGてなんやの？
う～ん、これぐず夫にどう説明してええんやろか。
根本的な話をすれば、アイコンを表示するのに『画像(WebFonts側)』を使うか『コード(SVG側)』を使うかって話なんやけどな。う～ん、1行で説明するにはムズいで…
根本的な話をすれば、アイコンを表示するのに『画像(WebFonts側)』を使うか『コード(SVG側)』を使うかって話なんやけどな。う～ん、1行で説明するにはムズいで…
(…な、なんのこっちゃ)
将来的にはSVGが主流になるんやろけど、現状は作者さんが推奨としてるWeb Fontsを選択しとけばええ思うで。今んとこ機能差ないみたいやし、初心者さんはあまり気にせんでええ思うわ。あとぐず夫、この項目も説明の章があらへんから、下にちゃんと追記しとくんやで！
うへぇ…
検索タブ
今回は特に変更してへんで。
検索結果の見た目的な表示は、「外観カスタマイズ」の「グリッドレイアウト」の項目も関係してるから、細かな見た目(文字色とか表示文字数とか)については、各自必要に応じて触ったってな。
検索結果の見た目的な表示は、「外観カスタマイズ」の「グリッドレイアウト」の項目も関係してるから、細かな見た目(文字色とか表示文字数とか)については、各自必要に応じて触ったってな。
→ 設定値以外の細かい説明はコチラ！
→ グリッドレイアウト設定はコチラ！
画像認証タブ
今回はコメント機能をオフにしてるで、特に変更の必要はなしや。
コメント機能を使用する場合は、別途下のページ見ながら準備したってな！
コメント機能を使用する場合は、別途下のページ見ながら準備したってな！
コピーライトタブ
こちらも初期値のままやな。
自分好みの表示にしたらええと思うで。
自分好みの表示にしたらええと思うで。
その他タブ
今回は全部初期値のままやな。
「リンクへの自動変換防止」なんかは好みやから、必要なら変更したってな。
「リンクへの自動変換防止」なんかは好みやから、必要なら変更したってな。
ひとまずカスタマイズ終了
項目が多い！
それにまだいくつか残ってるで！
それにまだいくつか残ってるで！
「管理機能」と「高速化一括設定」の項目は、サイトのバックアップを設定してからのがええから最後に回させてもらうで。よくよく考えると、最後に調整の項目足りてへんから、ちぃとだけ最後に追加するかもしれんでよろしく。
そんなら次回は、いよいよCSSで細かい部分を見ていくで。ではまた～♪
☆ 引き続きCSSの設定に行くで！
https://wordpress-beginner.net/fashionablesite-create6/#toc_...