WordPress用テーマ「Luxeritas」の導入とカスタマイズ

WordPress

さて、当ブログをとりあえずはWordPressに引っ越したものの、テーマ(テンプレート)は何を導入すべきかと、ずっと悩んでおりました。

と、言いますのも…

毎日何十ページ、毎月何百ページと他人様のブログを拝見する日々の中で、(テーマが何であれ)ワードプレスで書かれたブログの表示速度を「速い!」と感じた事が殆ど無いからであります。

もちろん、

SEOと内部構造に強いのはSTINGERシリーズ」(現在ならAFFINGER5)

 

雑記系と特化型、両方に使えるオールラウンダーならSimplicity

という前評判は存じていましたが、どちらも「表示の速さ」に重きを置いた構造ではありません。

前回の記事にも書きましたが、ワタクシが当ブログをWordPressに引っ越す事を決意したのは、あくまでも「独自ドメインのSSL化」の為だけであって、依然としてワタクシの中では、

「やっぱり、BloggerがSimple&Fasterで最高なんやねぇ…」

という認識なのであります。

参照


↑Google御大自身、ワードプレスの表示速度の遅さを認めている。

まぁ、そうは言っても、これからの競争を勝ち抜いていく中で、WordPressの中でも表示速度が比較的に速いテンプレートを探さなければライバル達に置いて行かれますので、ピンからキリまで星の数ほどあるワードプレス用テーマの中でも、唯一、「速さ」を念頭に置いて設計されたテンプレートである「Luxeritas」(ルクセリタス)を導入した次第です。

SEO最適化済み、多機能なのに高速、しかも無料!!

リクセリタス
https://thk.kanzae.net/wp/

なんと、このテーマの開発・提供者である「るな」氏は、NTTグループやGMOグループに在籍していた(現在は独立)、バリバリのSE・プログラマーです!

参照 開発者プロフィール

改訂履歴も、実に細かく更新されています。たとえ有料であっても、ここまで細かくバージョンアップ対応しているテーマは見た事ないですよ??

参照 改訂履歴

つまり、このルクセリタスというテーマは、本来であれば有料で販売されていてもおかしくない程の高機能を、更に相応の工数を掛けて改善しているという事です。

ブログ運営を始めて間もない初心者や、WordPressに引っ越したばかりで有料テーマを購入して細かく造り込むまでの段階には達していないブロガーにとっては、まさに「神のテーマ」と呼ぶべき頼もしい存在です。

Luxeritasの特徴

もちろん、他のホスト型のブログサービスと違い、「プラグイン」という仕組みでソーシャルボタンを始めとする各種ウィジェット類を自由に脱着できる事に、WordPressというブログメディアの最大のメリットがあるワケですが、プラグインを増やせば増やすほど、それに反比例して表示速度が遅くなるという本質的な欠点を抱えています。

しかし、このルクセリタスは、それらのプラグインに頼らずとも最初から必要にして十分な機能を備えており、なおかつ表示速度を犠牲にせずに個性的なレイアウトを組めるのが最大の特徴です。

以下に挙げた3サイトは、いずれもルクセリタスを実際に適用している方のブログです。
(2018年2月現在)

①通常型

まずは、「通常型」と呼ばれるカラムレイアウトです。

Luxeritas -通常型-
https://ytrsdijun.com/

各エントリーカードの横幅を広く取り、余白(padding)も大きく設けて抜粋文を読みやすくしているのが特徴です。

②グリッド型

昨今のブログシーンに於ける一つの流行に、各エントリーカードを正方形に近い形にして横に2列(あるいは、それ以上)並べるスタイルである「グリッド型」が挙げられます。

Luxeritas -グリッド型-
https://moni0623.net/

グリッドとは、一般に車のレースなどで使われるサーキット場に於けるスタート位置の「配列」を指す言葉として定着していますが、その形に似ている事からウェブ用語としても浸透してきたのではないかと思われます。

このグリッド型の特徴は、先述の通常型とは違いアイキャッチ画像の方を目立たせるのが主目的であり、旅行日記や食レポなど、画像そのものがメインのコンテンツであるブログに向いています。

③カード型

Luxeritas -カード型-
https://makiriri.com/

各エントリーカードを横に細長く設定するカード型は、ニュースサイトなどで多く見られるレイアウトであり、上記の例のように抜粋文すら省略するケースも珍しくありません。

これは、ブログ運営を始めて間もない初心者の方からすると、あまりにもシンプル過ぎてユーザビリティーが下がるのではないかと思われるかもしれません。

しかし、検索から飛んで来る訪問者の場合、アイキャッチ画像などには目もくれずに記事タイトルのみに注目している場合が多いので、画面をスクロールさせない範囲でのエントリー数を多く設定できるカード型の方が、逆にユーザビリティーが上がる(滞在時間が長くなる)傾向があります。

記事数が多いブログに向いているレイアウトです。

高速化設定

さすが、本業のSE・プログラマーの方が開発・提供しているだけあって、Luxeritasの高速化への取り組みに関する説明は、どれもこれも説得力が強いものばかりです。

出典

高速化に関する具体的な技術論は上記の説明を読んで頂くとして、ここでは、当ブログに採用している高速化設定を下記に挙げていきます。

圧縮・最適化

高速化設定 -圧縮・最適化-
・HTMLの圧縮→圧縮率・高を選択

・CSSの最適化→親と子のCSSを結合して圧縮するを選択

・Javascriptの最適化→必要ない(読み込まない)を選択

CSS

高速化設定 -CSS-
・モード選択→Luxeritas Modeをチェックオンして選択

・外部CSSの直接出力→テーマのCSSをHTMLに埋め込むをチェックオン

・子テーマのCSS→子テーマのCSSを読み込むをチェックオン

・アイコンフォントのCSS
アイコンフォント(Font Awesome)の読み込み方法→非同期(レンダリング高速)を選択
アイコンフォントのCSS→Luxeritasで必用最小限のCSSのみをチェックオンして選択

・ウィジェット用のCSS
検索フォームウィジェット
アドセンス (Luxeritas オリジナル)
SNS フォローボタン (Luxeritas オリジナル)の三点をチェックオンして選択

Javascript

高速化設定 -Javascript-
・jQuery
jQueryの読み込み方法→Google CDN – jQuery v3(高速/IE8以下未対応)を選択
jQueryを非同期にする(高速化するが注意が必要)をチェックオン

・Bootstrapプラグイン
bootstrap.jsの読み込み方法→必要ない(読み込まない)を選択

・その他のJavascript設定
子テーマのJavascript(luxech.js)を読み込まない
WordPressの絵文字用スクリプトを読み込まないようにする
WordPressのEmbed機能をOFFにするの三点をチェックオンして選択

高速化用 htaccess

高速化設定 -htaccess-
上記の画像は、Luxeritasのカスタマイズウィザード(カスタマイザー)にテンプレートとして付記されている「.htaccess」の設定例です。

.htaccessとは、サーバーにインストールされているWordPress自体ではなく、サーバーそのものを制御する為の設定ファイル(Windowsのレジストリファイルのようなもの)ですので、これを上手く設定すれば劇的な表示速度の向上が望めます。

しかし、実際には自分が借りているレンタルサーバーの種類(これはApacheと呼ばれるサーバー専用)や、そのバージョン、更にはレンタルサーバー会社が独自に設定している制約などによっては、上記のテンプレートをそのままコピー&ペーストして適用してもエラーになる(もしくは無視される)場合がありますので、他のブログサービスからワードプレスへ引っ越したばかりの人はイジらない方が無難です。

以下に挙げるソースは、ワタクシがお名前.comで借りているレンタルサーバー(SD-12プラン)で実際に設定している.htaccessファイルですので、同じくお名前.comでサーバーを借りている方はそのままコピー&ペーストして頂いて構いませんが、他社のレンタルサーバーを借りている方は、各社のサポートページやQ&Aページを参照して下さい。

# ETags(Configure entity tags) を無視する設定
<IfModule mod_headers.c>
Header unset ETag
</IfModule>
FileETag None

# Enable Keep-Alive を設定
<IfModule mod_headers.c>
Header set Connection keep-alive
</IfModule>

# MIME Type 追加
<IfModule mime_module>
AddType text/cache-manifest .appcache
AddType image/x-icon .ico
AddType image/svg+xml .svg
AddType application/x-font-ttf .ttf
AddType application/x-font-woff .woff
AddType application/x-font-woff2 .woff2
AddType application/x-font-opentype .otf
AddType application/vnd.ms-fontobject .eot
</IfModule>

# プロクシキャッシュの設定 (画像とフォントをキャッシュ)
<IfModule mod_headers.c>
<FilesMatch "\.(ico|jpe?g|png|gif|svg|swf|pdf|ttf|woff|woff2|otf|eot)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
# プロキシサーバーが間違ったコンテンツを配布しないようにする
Header append Vary Accept-Encoding env=!dont-vary
</IfModule>

# ブラウザキャッシュの設定
<IfModule mod_expires.c>
ExpiresActive On

# キャッシュ初期化 (1秒に設定)
ExpiresDefault "access plus 1 seconds"

# MIME Type ごとの設定
ExpiresByType text/css "access plus 1 weeks"
ExpiresByType text/js "access plus 1 weeks"
ExpiresByType text/javascript "access plus 1 weeks"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType application/pdf "access plus 1 weeks"
ExpiresByType application/javascript "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/x-font-ttf "access plus 1 year"
ExpiresByType application/x-font-woff "access plus 1 year"
ExpiresByType application/x-font-woff2 "access plus 1 year"
ExpiresByType application/x-font-opentype "access plus 1 year"
ExpiresByType application/vnd.ms-fontobject "access plus 1 year"
</IfModule>

# Gzip圧縮の設定
<IfModule mod_deflate.c>
SetOutputFilter DEFLATE

# 古いブラウザでは無効
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch \bMSIE\s(7|8) !no-gzip !gzip-only-text/html

# 画像など圧縮済みのコンテンツは再圧縮しない
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico|eot|woff|woff2)$ no-gzip dont-vary

AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/js
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE application/x-font-ttf
#AddOutputFilterByType DEFLATE application/x-font-woff
#AddOutputFilterByType DEFLATE application/x-font-woff2
AddOutputFilterByType DEFLATE application/x-font-opentype
#AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
</IfModule>

注意 制作者も注意していますが、上記のテキストを.htaccessファイルに元から記述されている以下のテキストの手前、もしくは後ろに必ず「追記」して下さい。
万が一、追記ではなく「上書き」てしまうと、各記事のURLの表示形式が変更されてしまう恐れがあり、最悪の場合、記事が表示されなくなってしまいます。

# BEGIN WordPress
↓
# END WordPress

.htaccessをイジらずに、キャッシュ系のプラグインで解決したい場合は下記記事を参照。

導入したプラグイン

さて、当然の事ではありますが、「速さ」を最重要の指針として開発されているルクセリタスに、アレもコレもと欲張ってプラグインを突っ込むのは本末転倒です。

当ブログでは、プラグインを厳選して以下の4点のみ導入しています。

キャッシュ系

ワタクシ自身、ウェブサイトとブラウザの関係に於けるキャッシュという概念そのもの、つまり、「どんな情報を」「何処に」保持して、「どんな時に」参照するのか?という事については、未だ完全には理解していません。

しかし、基本的に入れれば入れるほど重くなるプラグインという仕組みの中でも、唯一、表示の高速化を助けるのがキャッシュ系のプラグインであり、適切に導入すれば他のシステムで作られたブログやサイトに対して大きく差をつける事が可能です。

当ブログでは、Luxeritasの開発者が推奨している「Cache Enabler」(キャッシュ・エンネイブラーと読むのか?)を導入しています。

サイトマップ出力

今回のワタクシのように、BloggerからWordPressへと引越した場合に起こってくる問題の一つに「Bloggerでは標準装備だったのに、WordPressではプラグインを入れないと利用できない機能」というのが幾つかあります。

その中の一つが、XMLによるサイトマップの出力です。

Bloggerの時には、トップページのURLの後ろに「/sitemap.xml」と付加すれば簡単にサイトマップを出力してくれたのに、ワードプレス本体には標準装備されていないという…
ちょっと呆れてしまいましたが、さりとてこれを導入しなければ、記事を大量に削除した時や記事タイトルを変更した場合などに、検索に反映されるのが大幅に遅れてしまいます。

よって、「仕方なく」ではありますが、このプラグインの導入を推奨します。
設定等はデフォルトのままでも特に問題はなさそうです。

セキュリティー系

そもそも、このWordPressというシステム自体が今以て改良の途上であり、攻撃者の標的になりそうな脆弱性を残しているという事なのだと思いますが、管理画面への不正ログインによってサイト内容が書き換えられたり、企業サイトのデータベース(SQL)に登録されている顧客情報が盗まれるといった事件が過去に何度もありました。

この世に泥棒さえいなければ、家の玄関に鍵をかける必要もなくなるのと同じで、こういったセキュリティー関連のプラグインも、管理画面の軽快な操作を考えるのであれば「入れたくない」というのが本音です。

しかし、自分のサイトが悪意ある第三者に乗っ取られるという事は、金銭的な損失よりもむしろ、レイアウトのデザインや記事の執筆に費やしてきた私達の「人生の時間」が全て水の泡と化すという事であり、これもまた「仕方なく」導入せざるを得ません。

その他

インターネットに限らず、コンピューター上で構築される大半のメディアやシステムが、半角英数字を表示する事を大前提として設計されています。

なので、当然の事ながら全角の漢字や平仮名を表示する為には、一度「文字コード」に置き換えて送受信する必要が生じるワケですが…

インターネットが開通して既に20年以上もの年月が経過していますが、送受信した日本語が正しく表示されない、いわゆる「文字化け」の問題は根本的には解決していない様子です。

もちろん、それはWordPressに於いても例外ではありませんので、日本語版のWordPressを導入したら、まず最初に適用する事を推奨されているのが本プラグインです、

このプラグインは、

・文字化け防止機能:wordpressのUTF-8の文字コードから特定デバイスへのメッセージで文字化けを防止する

・トラックバックの文字化け防止:ほとんどUTF-8コード文字コードを使用していると思いますが、その他の文字コードからトラックバックを受けると文字化けするのでそれを防止します

・ピンバックのバグ防止:UTF-8以外の文字コードからピンバックを受ける際バグが発生することを防ぐ

・文字数カウント機能のバグ防止:投稿画面に書いた文字数を正しく計測させる機能

・検索時のスペース誤認識の防止:全角スペースが正しく認識されないことを防ぐ

・ファイル名のマルチバイト部分の変換バグ防止:ファイル名のマルチバイト部分が変換されずにアップロードされます。

等の総合的な文字化け対策が施されています。

PageSpeed Insightsでの計測結果

さて、皆さま、大変お待たせ致しました…
ルクセリタスを導入した当ブログのスコアは、何点になったでしょうか…(ゴクリ)

Luxeritas -PageSpeed Insights- -モバイル-
モバイルページ

なんと、モバイルページで、いきなり99点です!!

 

では、PCページではどうでしょうか…

Luxeritas -PageSpeed Insights- -PC-
PCページ

PCページでも95点です!!

もちろん、上記の計測結果は、あくまでもトップページのものですので、当然の事ながら各記事ページに於いては、もう少しスコアが下がります。

しかし、逆を言えば、トップページでさえ80点に満たないサイトは、各記事ページではもっと遅いという事ですので、これからの競争を勝ち抜いていくのは難しくなるでしょう。

有料テーマは不要なのか??

さて、このLuxeritasに限らず、最近は無料であっても有料テーマに負けない機能やデザインを誇る”神作”テーマがチラホラと見受けられます。

この記事に加筆している2018年4月4日現在、日本のワードプレスユーザーであれば知らぬ人のいない名作「Simplicity」の作者である「わいひら」氏が、その後継となるテーマ「Cocoon」(コクーン)をリリースしていますが、未だベータ版でありながら既に多くのユーザーが導入し、絶賛の声を上げています。

その結果、仕方のない流れではありますが、「有料テーマ不要論」がボチボチと聞こえてくるようになりました。

まぁ、言わんとする事も、そう言いたくなる気持ちも理解はできるのですが…
少なくとも現時点では、高機能の無料テーマが登場したからといって、既存の有料テーマが全て無価値になったと断ずるのは早計かと思います。

何故かと言いますと、ブログのテーマ(テンプレート)というものは、最終的には「有料か、無料か?」で選ぶものではなく、「自分が欲している機能を全て備えているか?」で決めるべきものだからです。

当然の事ですが、有料だろうと無料だろうと、自分が欲している機能(例:カルーセルスライダーやLINE風吹き出し会話など)が備わっていなければ無用の長物です。

最初に選んだテーマが自分にピッタリと合っていて、一度も変更した事が無い…という人ならばともかく、3テーマなり5テーマなりと試行錯誤していく内には、「有料、無料」「日本製、海外製」「多機能主義、速度第一主義」等、色々な特徴のものを試す事になります。

もちろん、ワタクシ自身はBloggerから引っ越してきたぐらいですから、言うまでもなく「速度第一主義」ですし、ルクセリタスはそのニーズを満たしています。

しかし、ルクセリタスではサポートしていない機能が備わっている、他のテーマを羨ましいと思う時もチラホラとありますので、今後、WordPressで別ブログを立ち上げる機会があれば、その時は有料テーマを導入する事になるかもしれません。

まぁ、テーマの衣替えはWordPressに限った事ではないと思いますが…
現在、適用しているテーマをフルに活用して、それでも機能面での限界を感じたら、その時初めて変えればよろしいのではないでしょうか。

当ブログのカスタマイズ内容

【2018年07月07日】現在、当ブログに適用している子テーマのCSS(/luxech/style.css)全文。

/* Indexページ */
.sitename a {font-weight:600;text-shadow: 2px 3px 2px #999999;}
.sitename img {float: right;margin: 0 0 -30px;}
div[id^=card-] h2 {position: relative;margin: 0 0 10px 120px;padding: 10px 15px;background-color: #a0d8ef;border-top: solid 1px #0076a3;border-bottom: solid 1px #0076a3;}
#side h3, #col3 h3, #side h4, #col3 h4 {margin: 4px 0 15px;}
div.author-img {width: 75%;margin: auto !important;padding-top: 25px;background: url("data:image/png;base64,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") top right no-repeat;}
.tagcloud a {font-size: 12px !important;line-height: 1em;border: solid 1px #0076a3;background: #fff;color: #00adee;display: inline-block;white-space: nowrap;padding: 8px 8px;margin-top: 3px;border-radius: 4px;text-decoration: none;}
.tagcloud a:hover {background: #00adee;color: #fff !important;}
.tagcloud a:before {font-family: "FontAwesome";content: "\f02b";padding-right: 4px;}
/* 記事ページ */
.post h2 {position: relative;padding: 10px 15px;background-color: #a0d8ef;border-top: solid 2px #0076a3;border-bottom: solid 2px #0076a3;border-left: none;}
.post h3 {border-bottom: solid 2px rgba(78,146,223,.9);border-left: solid 5px rgba(65,105,225,.8);}
.post h4 {border-left: solid 12px #4169e1;}
blockquote {position: relative;max-width: 100%;margin: 15px 5px;padding: 15px;border: 1px solid #ddd;border-radius: 10px;background: #fefefe;overflow: hidden;}
pre {background-color: #fff0f5;border: 1px solid #ddd;padding: 10px 20px 10px 15px;}
code {font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, Meiryo, 'MS ゴシック', monospace;}
.badge-bl {color: #fff;background-color: #0000ff;padding: 2px 6px;border-radius: 4px;font-size: inherit;}
.badge-gr {color: #fff;background-color: #008000;padding: 2px 6px;border-radius: 4px;font-size: inherit;}
.badge-rd {color: #fff;background-color: #f00000;padding: 2px 6px;border-radius: 4px;font-size: inherit;}
.under-marker1 {background: linear-gradient(transparent 60%,#ffff66 60%);}
.under-marker2 {background: linear-gradient(transparent 60%,#f09199 60%);}
.under-marker3 {background: linear-gradient(transparent 60%,#a0d8ef 60%);}
.btn {display: block;position: relative;padding: 14px 30px 14px 16px;border: 1px solid #999999;color: #fff;text-decoration: none !important;background-color: #3156b9;box-shadow: 0 2px 2px rgba(0,0,0,.4);-webkit-transition: all .3s;transition: all 0.3s;border-radius: 6px;text-align: center;}
.btn:hover {box-shadow:none;background:#008fde;}
.balloon {margin-bottom: 20px;}
.balloon-left {margin-left: 80px;}
.balloon-right {margin-right: 80px;}
.sns-msg h2:before {content: '';display: inline-block;position: relative;height: 42px;margin: 0;width: 47px;background: url("data:image/png;base64,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")no-repeat;}
.sns-msg h2 {display: inline-flex;margin: 0;padding: 0;line-height: 1.3em;font-size: 16px;font-size: 1.6rem;background: 0 0;border: none;border-bottom: 3px solid #ccc;}

解説

Indexページ

.sitename a {font-weight:600;text-shadow: 2px 3px 2px #999999;}

「text-shadow」でブログタイトルに影を付けました。

.sitename img {float: right;margin: 0 0 -30px;}

通常はブログタイトルの左側に表示される「ワンポイント画像」を右側に変更。