高速WordPressテーマ『Luxeritas』を使ってみたので忘れないうちにメモ

        Luxeritas-theme
高速と名高いWordpressテーマ『Luxeritas』を使ってみたので忘れないうちにメモ。

いずれきちんと書き直しますが、調べている人がいるかもしれないので公開しておきます。

 

ワードプレス用テーマ『Luxeritas』は、ツイッターフレームワークBootstrapをベースにした、高速Wordpressテーマです。ページ表示速度に命をかけているような気がしてくるレベルです。

ちなみにルクセリタスと読むようです。なかなか覚えられなかった。

ワードプレス用テーマ『Luxelitas』

Luxeritasは海外では大人気の『Genesis Framework(ジェネシス フレームワーク)』を参考にしているというだけあって確かに早い。そしてSEOもバッチり。

構造もスッキリしていているので class名 も把握しやすくカスタマイズもしやすいです。

カスタマイズはしやすいし使いやすいんですが、初心者にはお勧めできないかな。難しいというより、テーマ非依存性が高いためにめんどくさいという感じ。

Bootstrapベースなので、手軽に外観をいじるならそちらを使えばいいじゃない、という香りがします。

その分ほかのテーマへの乗り換えも簡単そうです。気になるのはBootstrap4への移行くらいかな。Panelが使えなくなるのにCardsもまだだめだから中途半端なんですね。

そして本題のメモです。

投稿ページにCSSやScriptを挿入するためのhead/foot用カスタムフィールド

</head>の前にスクリプトやCSSを挿入するためのカスタムフィールドは用意されています。

<head>挿入用カスタムフィールド名  addhead

カスタムフィールドって何?という人はこちらの記事を参照してください。

 Wordpressで記事ごとに個別のCSSを設定する方法
カスタムフィールドをInsert PHP Snippetを使って活用する

addhead で簡単にスクリプトやCSSは挿入できたのですが、ここに書かれたものは圧縮や結合の対象とならないようです。せっかく高速なテーマなのだから、jsがレンダリングをブロックしないよう<foot>も使えるようにしました。

参考にしたのはWebShufuさんのこの記事。

 1記事限定で反映させたいcssやjavascriptをカスタムフィールドで読み込む

 

スクリプトは<foot>の中でなく</body>の直前に書くほうが構造的にはいいですが、footerの中でもいいやってことで子テーマの方に書きました。

addfoot は Luxeritas アップデートで使われる可能性を考慮して、フィールド名は add_footに。

よく分からなかったり、うまくいかないようなら、こちらの記事も参照下さい。

Luxeritasのフッターにカスタムフィールドを挿入する方法

 

Luxeritas-theme

<?php
{
$add_foot = get_post_meta($post->ID,add_foot,true);
if($add_foot) {
echo $add_foot;
}
}
?>

画像をちいさく切り取りすぎて分かりにくいですが、ソースです。うまくいきました。

Luxeritas-theme

高速化用 .htaccess

テーマに同梱されているドキュメントにも書かれていますが、.htaccessに追記するための圧縮・キャッシュ設定が記載されています。

Luxeritas-Costomizer-panel

.htaccess の一番最後に追記すればいいだけなので失敗はないなず。

うまく行ったかはCheck GZIP compressionこういうところでチェック。

Apache Web Serverのみ有効です。Mixhostならサーバパネルやプラグイン LiteSpeed Cache で設定できます。

mix-host-compression

圧縮・最適化

Autoptimizeの(キャッシュ部分以外は)不要になります。圧縮率・高でも可読性は高いです。

Javascrip / CSS の最適化はサーバが HTTP/2.0 に対応しているかどうかで効果が代わります。HTTP/2.0に対応していたらファイル数の多価の影響が小さくなるので、それほど気にしなくていいかも。

AMP対応

AMP完全対応。AMPページで有効化できるプラグインを選択できる。外観もオリジナルのイメージに近くなってる。もちろんAdsenseも自動でAMP用に変換してくれる(ウィジェット内のみのよう)。

Bootstrap

ベースとなるBootstrap フレームワークは Luxeritasで使っている最低限のセットとフルセットが選べる。

現在はBootstrap3かLuxeritasセットの2択。4は薄表示でComming Soonとなってる。プラグインも別途読み込む設定が必要。

Luxeritasの著作権表記

フッターに出ているLuxeritasコピーライトの文字は見えなくしてもOK。ただ、おおっぴらにいうことではないです。作者のるなさん自身が書いてるように フッター の フィルターフック をごにょごにょすると消える。

有料でもいいから消させてくれという問い合わせへの婉曲な回答かな?と思ったりしました。

2017年9月頃?からフッターから著作権表示(コピーライト)を消せる有料プラグインがリリースされてます。

Luxeritas 提供元表示消去プラグイン

テーマの更新用テーマがある

外観でアップデート用テーマを適用するメンテナンスモードになる。ほかのテーマに切り替えるよりいい感じ。

更新用テーマを有効化した状態で新バージョンをアップロードすると、古いほうが自動的に消されます。ありがたい配慮です。

Luxeritas Update Theme

 

いじればいじるほど馴染む感じのテーマ

今はまだ把握するだけ&AddQuickTag登録で手一杯でおなかいっぱいという感じですが、Luxeritasはいじればいじるほど面白そうです。

ここもきちんとしないといかんと思っているところなので、デザインをいじる時にはLuxeritasにする予定でいます。やはり早いのは気持ちいいです。

ワードプレス用テーマ『Luxelitas』

スポンサーリンク

WordPress, ルクセリタス