お家で「好き」を仕事にしたい!ぱるのブログ

ぱるろぐ

ブログカスタマイズ

『Luxeritas』の初期設定(内部カスタマイズ)を解説!

投稿日:2017年9月7日 更新日:



はいこんにちは!ぱる(@palulog)です。

『Luxeritas』の導入に引き続き、初期設定をやっていきたいと思います。

[aside type="warning"]当ブログ『ぱるくら』は有料のWordPressテーマ「STORK(ストーク)」を使用しています。「Luxeritas」を使用したサイトは『ぱるイラスト』です。参考にしてみてください。[/aside]

『Luxeritas』の初期設定(内部カスタマイズ)をしよう!

まずはワードプレスの管理画面から「Luxeritas」→「カスタマイズ」を選択してください。
この画面になればOKです!

luxeritasカスタマイザー

Headタグで設定したところ

luxeritasのHeadタグ

まずは「Headタグ」で設定したところを解説していきます!

トップページのmeta description

トップページのmeta descriptionを設定しました。
ここはトップページが検索されたときに出てくる説明です。

luxeritasのトップページのmeta description設定
[voice icon="https://palulog.com/wp-content/uploads/2017/07/IMG_2811.png" name="ぱる" type="r palu"]思わずクリックしたくなるような魅力的な文章を考えよう![/voice]

Googleの検索結果に表示させる日付

「Luxeritas」で検索した際にでてきたものをお借りしました。
初期設定では「公開日」になっていますが、「更新日」に変更。

luxeritasのGoogleの検索結果に表示させる日付の設定
[voice icon="https://palulog.com/wp-content/uploads/2017/07/IMG_2811.png" name="ぱる" type="r palu"]新しい情報のほうがクリックしたくなるよね?[/voice]

Twitterカードの設定

Twitterカードを設定すると、ブログのURLをつけて呟いたときに画像つきでリンクが形成されます。
こんな簡単にできるの?びっくりしました。他のテーマで導入しようとするとカナリめんどくさいものです。

Twitterカードのタイプを「サマリー(summary)」から「サマリー(summary_large_image)」に変更しました。

luxeritasでTwitterカードの設定
[voice icon="https://palulog.com/wp-content/uploads/2017/07/IMG_2811.png" name="ぱる" type="r palu"]初期設定の小さい画像から大きな画像になったよ![/voice]
luxeritasでTwitterカードの画像を変更

さらに画像も変更。ひとまず仮画像を!ばいばい猫ちゃん!


[voice icon="https://palulog.com/wp-content/uploads/2017/07/IMG_2811.png" name="ぱる" type="r palu"]クリックしたくなっちゃうねぇ?[/voice]
ちなみにTwitterカードでぴったりに表示されるサイズは横506px × 縦253pxのようです。
参考:Twitter投稿でベストな画像サイズって知ってる?PCにもスマホにも最適な画像サイズとは|ferret [フェレット]

Titleタグで設定したところ

luxeritasのTitleタグ

次は「Titleタグ」で設定したところを解説していきます!

タイトルのセパレーター

タイトルのセパレーターを「|(パイプ記号)」から「-(ハイフン記号)」に変更しました。

検索結果はもちろん、Teitterカードなどにも反映されるところです!

luxeritasでタイトルのセパレーターをハイフン記号に変更
[voice icon="https://palulog.com/wp-content/uploads/2017/07/IMG_2811.png" name="ぱる" type="r palu"]好みで良いと思うけど、私はハイフンが好きです![/voice]

AMPで設定したところ

AMPは設定しませんでした!

『Luxeritas』はAMP設定をしてもデザインが変わらないので、カスタマイズする予定がない人は有効化しても良いと思います。

[voice icon="https://palulog.com/wp-content/uploads/2017/07/IMG_2811.png" name="ぱる" type="r palu"]カスタマイズ……めっちゃしたい![/voice]

私みたいに色々いじりたいあなたは、まだ有効化しない方が無難。自由にカスタマイズできるところが少ないんです。このまま進みましょう!

CSSで設定したところ

luxeritasのCSSタグ

次は「CSS」で設定したところを解説していきます!

アイコンフォントのCSS

「Luxeritasで必要最小限のCSSのみ」から「Font AwesomeオリジナルのCSS」に変更しました!
今後も私の記事を参考にしてくださる人は必要になってくるところなので、判断してください♪

luxeritasのアイコンフォントの設定

おわりに:『Luxeritas』の初期設定(内部カスタマイズ)完了!

私が設定したところは以上です。

「『Luxeritas』にしたけど、どうしていいかわからない~!」ってあなたの参考になれば嬉しいな。

[voice icon="https://palulog.com/wp-content/uploads/2017/07/IMG_2811.png" name="ぱる" type="r palu"]次は外観のカスタマイズいくぞ~[/voice]

あなたがすてきなブログを作れますように。ぱるでした!

おすすめ関連記事

-ブログカスタマイズ

Copyright© ぱるろぐ , 2024 All Rights Reserved.