「php」タグアーカイブ

カテゴリをアクセスアップの導線と考えているなら、徹底的なカスタマイズが必要じゃないかしら

当サイトで一番力を入れているのはカテゴリの「見た目」です。

私のサイトのコンセプトは「私に都合の良い総合データベース」なので、各アクセス記事に高速でアクセス出来る事が絶対条件なのです。

まだまだ現在進行形でカスタマイズしている最中ではありますが・・・。

カテゴリからアクセスを考えていくとき、どういったカスタマイズが必要なのか考えていきましょう。

小説カテゴリには画像と概要は要らない

私のサイトでは、小説カテゴリは子カテゴリに分けて名前順で出力されるようになっています。そうすることで連載も1から順序よく整列して見渡しやすくなっております。

小説には基本画像は必要ないのでサムネイル表示はありません。また、概要も縦に長くなるだけなので除外。

コードスニペット、素材カテゴリは一つにまとめてタイトルで振り分け

コードスニペットの場合はカテゴリが全て「コードスニペット」で統一されており、タイトルでそれぞれのプログラム言語などに振り分けています。

php – amazon_assie – アマゾンAPI利用アフェリエイトコード » aoringo works

phpのコードスニペットならタイトルの最初に「php – 」と入れておくと、カテゴリ上ではそれを削って整列させています。素材も同様。

カテゴリごとに最適な表示方法を決めていくことでカテゴリ自体がサイトマップの役割を果たし、ユーザーをそれぞれの目的にあった誘導を想像していけると良いですね。

私もサイト構築頑張っていかなきゃ。

jetpackの人気記事ウィジェットをカスタマイズする

jetpackはとても便利ですね。人気記事ウィジェットなんてのもあるのですから。

しかしこのウィジェット、cssがあまりイケてません。画像も小さいんですよね。というわけでカスタマイズしちゃいましょう。

画像の解像度を変更する

人気記事ウィジェットを司ってるのは「top-posts.php」です。「jetpack/modules/widgets/」に入っています。ここで画像の解像度が決定づけられています。

$get_image_options['avatar_size'] = 200;
} else {
$get_image_options['avatar_size'] = 40;

「40」で検索して出た部分を好みの数字に変更します。

CSSを除外する

jetpackに含まれるcssファイル「widget-grid-and-list.css」を直接編集しても見た目を変更する事が出来ますが、jetpackをアップデートしてしまうと、上書きされてしまいます。影響はできるだけ少なくありたいものですね。というわけでこのCSSファイルはそもそもwordpressで読み込まないように除外してしまいましょう。

add_action('wp_print_styles', 'deregister_styles', 100);
function deregister_styles() {
wp_deregister_style('widget-grid-and-list');
}

テーマのfunction.phpに上記コードを追加しましょう。これでcssファイルを読み込まなくなります。あとはテーマファイルの方のstyle.cssの方で見た目をカスタマイズしていきましょう!

完全保存版 この組み合わせで完璧!wordpress高速化プラグインまとめ

試行錯誤してきたwordpressの高速化プラグイン。その総括をしようかなと思います。

ああでもない、こうでもないと色々とやってきましたが、ようやく落ち着いたという感じです。

私が関わっているwordpressサイトにはこの組み合わせで運営されておりますよ。

キャッシュ系

その名の通りキャッシュ系プラグイン。これが無いと始まりませんね。

Head Cleaner

WordPress › Head Cleaner « WordPress Plugins

ソース整理といえばこれ。ヘッダー部分のお掃除をしてくれます。jsファイルやcssファイルを圧縮してキャッシュ化しておくことも可能。cssファイルを編集してもその都度新しいcssキャッシュファイルを作成してくれるので他キャッシュ系プラグインの影響でレイアウトが崩れる心配も無し。

本当助かってます。ありがとうございます。ふがふが。

WP Super Cache

WordPress › WP Super Cache « WordPress Plugins

wordpressの出力画面をhtmlに出力してそれを見せちゃうというページキャッシュプラグイン。動的な処理を常時やるようなサイトに向きませんが、このサイトのような普通のブログにはモアベターなプラグインとなります。

キャッシュの有効期限が切れても、切れたキャッシュをユーザーに提供しつつ新しいキャッシュを裏で生成したりと痒いところに手が届きます。設定が豊富で取っつきにくいかも知れませんが、その分細やかな設定が可能です。

wordpressのキャッシュを制御できるプラグイン「WP Super Cache」の設定項目解説 » aoringo works

モバイルモードをオンにすれば、別にスマフォ用のキャッシュを作りそれを見せるようになります→wp super cacheのモバイルモードはスマフォ用のキャッシュファイルも生成してくれる! » aoringo works

DB Cache Reloaded Fix

WordPress › DB Cache Reloaded Fix « WordPress Plugins

mysqlリクエストをキャッシュするプラグインです。私は検索ページをキャッシュしないようにしているので、そういう時はこいつが働くようになっています。wordpressはmysqlで全ての設定やデータを管理するので、このプラグインはもはや必須と言っていいでしょうね。

WP File Cache

WordPress › WP File Cache « WordPress Plugins

php関数の出力をキャッシュします。これが有ると無いとではかなり動きに差があります。

キャッシュプラグインの組み合わせの最適回答を求めて – aoringo works

DB Cache Reloaded Fix同様、静的キャッシュが動かない所で強力にサポートしてくれます。

001 Prime Strategy Translate Accelerator

WordPress › 001 Prime Strategy Translate Accelerator « WordPress Plugins

wordpressは多言語に対応しており、ページを表示する度にどの言語で表示するべきかをphpにより判定しております。

このプラグインはその部分をキャッシュ化する事で高速化を図りますよ。同様のプラグインはいくつかありますが、このプラグインは閲覧ページ、ログインページ、管理者ページでキャッシュを使うかどうか設定する事が出来ます!! 管理者ページでキャッシュをオンにすると恐ろしい事になるので、私は閲覧ページのみオンにしております。

「MO cache」はもしかするとすさまじい容量を食うかもしれない。 » aoringo works

処理系

wordpressの各種処理を手助けするプラグインです。縁の下の力持ちといった所。

WP Hyper Response

WordPress › WP Hyper Response « WordPress Plugins

phpというのは、普通処理が全て終わってからクライアント側に送信しますが、このプラグインを利用すればphpの処理をリアルタイムでクライアントへと送信するようになります。

結果的に閲覧者はすぐに画面に反応があるのでストレスが減るというわけですね。

サーバーによっては利用できない場合があるので気をつけてくださいね。

画像系

ブログの画像はいつだって頭を悩ませる所ですね。ここでもプラグインは活躍します。

Imsanity

WordPress › Imsanity « WordPress Plugins

アップロードする画像を自動リサイズ! 過去の画像もリサイズできるwordpressプラグイン「Imsanity」が素敵 » aoringo works

アップロードする画像を指定の解像度へリサイズしてくれるプラグインです。どんなに巨大な画像をあげようが、これで「1024px」等と設定しておけば、そのサイズになるのです!!ブログの解像度に合わせて設定しておけばなにより強力な速度対策になるでしょう。

過去にアップロードした画像を一括変換する機能もついてます。

EWWW Image Optimizer

アップロードされた画像を圧縮してくれるプラグイン。場合によっては50%以上も容量を抑える事が出来ます。また、アップロードされたpngをjpgに変換したりする機能もあります。至れり尽くせりですね。このプラグインも過去にアップロードした画像を圧縮する事が出来ます。

また、テーマファイルに含まれている画像も圧縮する事が出来るんですよ!! ワザマエ!

Unveil Lazy Load

WordPress › Unveil Lazy Load « WordPress Plugins

画面に表示されるであろう画像だけを読み込むようにして、下へとスクロールを始めたら画像の読み込みを開始する「遅延ロード」をさせる事ができるプラグインです。

どれだけ写真を大量に載せようが、これでかなり負荷を減らすことが出来ますよ!

Jetpack by WordPress.com

WordPress › Jetpack by WordPress.com « WordPress Plugins

CDN設定って面倒くさいですよね・・・このプラグインを導入することによってボタン一個でCDNを導入する事が出来ます。他にも沢山の便利機能が一個に集約されているので、プラグインの節約にもなります。

まとめ

どうですかね。結構な数のプラグインを導入しています。

高速化といっても色々なプラグインの組み合わせ、設定があるのでとても大変だとは思いますが、是非参考にしてみてくださいね!

 

google adsenseの広告をPC用とスマフォで振り分ける

サイトを運営していると、各閲覧環境である程度の見た目を保証しないといけなくなります。

google adsenseもその一つ。広告収入なんて雀の涙ですが、ある方がやはりやりがいが出ます。そのついでにこうやって記事のネタにもなります。

今回はphpで閲覧者のブラウザを判定してPC用とスマフォ用に振り分けて広告を表示しましょう。

参考にしたのはこちら。
[WP] wp_is_mobile と iPad と WP Super Cache の怖い関係 – @mekemoke

function is_mobile(){
$useragents = array(
'iPhone', // iPhone
'iPod', // iPod touch
'Android.*Mobile', // 1.5+ Android *** Only mobile
'Windows.*Phone', // *** Windows Phone
'dream', // Pre 1.5 Android
'CUPCAKE', // 1.5+ Android
'blackberry9500', // Storm
'blackberry9530', // Storm
'blackberry9520', // Storm v2
'blackberry9550', // Storm v2
'blackberry9800', // Torch
'webOS', // Palm Pre Experimental
'incognito', // Other iPhone browser
'webmate' // Other iPhone browser
'webmate' // Other iPhone browser
);
$pattern = '/'.implode('|', $useragents).'/i';
return preg_match($pattern, $_SERVER['HTTP_USER_AGENT']);
}

自分でユーザーエージェントをそれぞれ調べるのは大変だったので、大変助かりました。そのままお借りして、こうします。

function googlead() {
if(is_mobile()) { //携帯デバイス
$ad = <<<"EOD"
<div class="googlead">
<!-- aowork mobile -->
<ins class="adsbygoogle"
style="display:inline-block;width:320px;height:100px"
data-ad-client="ca-pub-6633816946643511"
data-ad-slot="9684763319"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
EOD;
} else {
$ad = <<<"EOD"
<div class="googlead">
<!-- aoringo worksS -->
<ins class="adsbygoogle"
style="display:inline-block;width:468px;height:60px"
data-ad-client="ca-pub-6633816946643511"
data-ad-slot="6565776112"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
EOD;
}

return $ad;
}

これでスマフォとPCで広告表示を変える事が出来ますね。広告以外にも、色々な場所で利用する事がでできるかと思います。

php stormでプラグインの追加

phpの開発にはphp stormを使っています。素人なりに色々やっていますが、いかんせん英語なのと高性能すぎてまだ上手く扱えません。よぼよぼ。

プラグインの追加の仕方をメモしておきます。

メニューより「file>setting>plugin」でプラグイン検索メニューを出します。

次に、下部にある「install plugin from disc」からウインドウを出し、プラグインを設置してある場所を探します。

見つけたらOKを押し、プラグイン一覧に該当プラグインが表示されてればこれもOKを押します。

リスタートすれば導入完了です!

wp super cacheとhead cleanerを同時使用する場合の注意

wp super cache、head cleanerは、設定によっては競合してお互いにベストな状態を発揮できなくなります。

mod_rewrite モードだとブラウザキャッシュが上手くいかなくなる

mod_rewrite モードのキャッシュはとても強力ですが、wordpressの.htaccessに変更を加えるという点では注意が必要です。さらに、wp super cacheとhead cleanerは同じディレクトリにキャッシュファイルを保管しています。

head cleanerディレクトリ内のcssやjsファイルのブラウザキャッシュが上手く動かない場合があるのです。ウゴゴゴ。

というわけで、この二つのプラグインを導入している時は、head cleanerのディレクトリを別に移すのが無難な選択ですね。

方法は公式でもアナウンスされています→Head Cleaner を使用する場合の設定 | dogmap.jp

wp-config.phpに下記コードを追加しましょう。

define('HC_CACHE_DIR', 'minify');

これで「wp-content/minify」にキャッシュファイルを生成するようになります。

出来てます。OKですね!

wordpressのエディター表示をcssによって変更する方法

wordpressのエディタはとても便利ですが、エディタでの編集時と実際に投稿後ではデザインが変わる事が多々あります。

エディタとブログ上で適応されるcssが違うわけですね。というわけで、エディタ画面で利用できるcssを作りましょう。

テーマによっては既に用意されてる場合もある

「editor-style.css」というファイルがテーマフォルダに入ってますか? 入っているなら既にエディター用のcssが設定済みです。直接このファイルの内容を変更していけばOKです。簡単ですね。

用意されてない場合

さて、入っていない場合です。この場合、cssファイルを追加してもwordpressは認識しません。function.phpにコードを一行追加しましょう。

add_editor_style('editor-style.css');

これでエディターでcssファイルを利用する事が出来ますよ!

キャッシュプラグイン組み合わせの最適回答を求めて「Quick Cache」「WP File Cache」「DB Cache Reloaded Fix」「WP Super Cache」

前提条件

wordpressのプラグインといえばキャッシュプラグイン。何よりもまずキャッシュ。それほど重要な要素です。こんかいは「Quick Cache」「WP File Cache」「DB Cache Reloaded Fix」「WP Super Cache」の四つのプラグインを利用してどの組み合わせがこのサイトに最適なのかを考えていきます。

「Head Cleaner」「WP Hyper Response」は導入済みとします。

「Head Cleaner」はヘッダーを整理、js/cssを動的出力・キャッシュ・圧縮・結合する事が出来るプラグインです。超お勧めです。→WordPress › Head Cleaner « WordPress Plugins

「WP Hyper Response」はphpの処理が全て終わってから結果を出力するのではなく、処理をしつつ出力もするようになります。こちらもお勧め→WordPress › WP Hyper Response « WordPress Plugins

各種プラグインおさらい

各種プラグインがどういったものなのか、軽くおさらいしましょう。どのキャッシュプラグインがどういう機能があるのか抑えていないと事故になります。

Quick Cache

ページそのものを静的ファイルに出力し、利用者がページを見る場合そのファイルを閲覧する事になります。デフォルトのwordpressでは毎回mysqlに問い合わせてphpが出力・整形を繰り返すので、この部分をスキップしよう。という物ですね。最近有料化しました。→WordPress › Quick Cache (Speed Without Compromise) « WordPress Plugins

WP Super Cache

quick cache同様の効果、というよりWP Super Cacheから派生したのがQuick Cacheです。設定の内容に違いがあります。→WordPress › WP Super Cache « WordPress Plugins

WP File Cache

オブジェクトキャッシュというもので、php関数の結果をキャッシュします。→WordPress › WP File Cache « WordPress Plugins

DB Cache Reloaded Fix

はmysqlからの出力結果をキャッシュし、mysqlへの問い合わせを減らしてくれます。→WordPress › DB Cache Reloaded Fix « WordPress Plugins

全体の流れ

つまりイメージとしては、ページを表示すると記事データを問い合わせの際に「DB Cache Reloaded Fix」を参照し、記事出力の際に「WP File Cache」を参照し、ページ全体の表示に「WP Super Cache・Quick Cache」が参照されるわけですね。それぞれ受け持つ部分が違うわけです。

検証

早速やっていきましょう。利用するクライアントはpale moonです。

「Quick Cache」「DB Cache Reloaded Fix」「WP File Cache」ON

全キャッシュ生成時

Quick Cacheキャッシュ生成時

生成にかかった時間は「<!– This Quick Cache file was built for ( ao-works.net/you-can-control-cache-wordpress-plugin-wp ) in 0.42555 seconds, on Mar 8th, 2014 at 1:28 am UTC. –>」とのことで、0.4秒ですね。

DB Cache Reloaded Fixキャッシュ生成時

Quick Cacheによるページキャッシュが動作しているので利用者に影響はありませんね。

WP File Cacheキャッシュ生成時

こちらも同じです。

「Quick Cache」「DB Cache Reloaded Fix」ON

mysqlキャッシュは検索などの部分で必要になるので必要だとして、WP File Cacheが無い状態での時間を見てみましょう。

Quick Cacheキャッシュ生成時

おお、かなり違いがありますね。quick cacheがキャッシュファイルを読み込むとき、php関数のキャッシュが無いので出力を待っているのでしょうか。

「<!– This Quick Cache file was built for ( ao-works.net/you-can-control-cache-wordpress-plugin-wp ) in 4.99642 seconds, on Mar 8th, 2014 at 1:22 am UTC. –>」とソースに表示されています。キャッシュ作成に4秒の時間がかかったようですね。

「WP Super Cache」「DB Cache Reloaded Fix」「WP File Cache」ON

WP Super Cacheは設定がかなり多いです。設定の詳細については→wordpressのキャッシュを制御できるプラグイン「WP Super Cache」の設定項目解説 » aoringo works

全キャッシュ生成時

quick cacheとあまり変わりませんね。

WP Super Cacheキャッシュ生成

こちらも時間的には同じくらい。

DB Cache Reloaded Fix キャッシュ生成時

WP File Cacheキャッシュ生成時

変わりませんね。

「WP Super Cache」「DB Cache Reloaded Fix」ON

WP Super Cacheキャッシュ生成時

ちょっと遅いですね・・・。

まとめ

どちらも性能的には同じくらいのパフォーマンスとなっているようです。WP Super Cacheは設定によっては裏でキャッシュを生成できたりもするので、今回の比較では遅めですがカスタマイズ次第でかなりのパフォーマンスを引き出せるかと思います。

有料でも簡単に設定できるquick cacheか、多岐に渡る詳細な設定が可能なWP Super Cacheか。検討の参考にしてみてくださいね。

 

wordpressのキャッシュを制御できるプラグイン「WP Super Cache」の設定項目解説

wordpressのキャッシュ系プラグインは数多ありますが、今回は「WP Super Cache」を導入してみました。設定について調べたい所ですが、探せど探せど詳しい説明が無いので軽くメモっておきます。

キャッシュ系プラグインは便利な反面設定を間違えると思わぬ事故に繋がりますので、「推奨」とついているからと全てをオンにするのは得策ではありません。ましてやそれで「何か不具合が出る」や「購入情報が表示される虚弱性がある」というのはちょっとどうなんでしょう。

簡易、詳細、プリロードだけを書いていくので、それら以外の設定を知りたい人は今回はごめんなさいという事で。

簡易

設定に必要な最初のページです。 キャッシングを使用するかどうか、そして生成されたキャッシュが正しく動作しているかを確認する事ができます。

詳細

動作に関しての細かな設定をここで行います。

キャッシング

ヒットしたページをキャッシュし、素早くアクセスさせる。 (推奨)

ページにアクセスした時点で有効期限が切れている、もしくはキャッシュが無い場合はキャッシュを作成し、利用者に見せます。

このチェックをオフにしていると、一番新しいキャッシュを見せます。有効期限が切れている場合、キャッシュは利用せず通常の出力結果を見せるようになります。

キャッシュファイルの提供に mod_rewrite を利用する。 (推奨)

mod_rewriteはリダイレクト機能ですが、おそらくキャッシュした静的ファイルへとクライアント誘導するのだと思われます。サーバーによっては利用できない場合があります。

キャッシュファイルの提供に PHP を利用する。

キャッシュファイルをphp関数によって出力するようになるようです。

レガシーなページキャッシング。

レガシーというのは一般的なファイルキャッシュという意味でしょうか? この中では一番遅いようです。

その他

ページを圧縮し、訪問者により速くページを供給する。 (推奨)

ファイルを圧縮(gzip)?して送信しているようですね。特に理由も無い限りはONにしたほうが良いでしょう。ソースに「<!– Compression = gzip –>」と出るので間違いないかと思われます。

304 Not Modified ブラウザーキャッシング。最後にリクエストされてから変更がないことを示す。 (推奨)

そのページが更新されていない事を伝えます。キャッシュファイルで、元ファイルは更新されていない事を証明するんですかね?

既知のユーザー向けにはページをキャッシュしない。 (推奨)

wordpressにユーザー登録されている(ログインしている)ユーザーにはキャッシュページを表示しないようにします。

Don’t cache pages with GET parameters. (?x=y at the end of a url)

URLにパラメータを含めてきた人へのキャッシュもするかどうか。普通はオフで良いと思います。パラメータを使ってwordpressサイトを作る人は導入を考えても良いかもしれません。検索などのページもキャッシュするのかな?(未検証)

Make known users anonymous so they’re served supercached static files.

ログインしたユーザーがページを表示するとキャッシュを作成します。

オフの場合「<!– Page not cached by WP Super Cache. Check your settings page. Not caching requests by known users. (See Advanced Settings page) –>」
オンの場合「<!– Cached page generated by WP-Super-Cache on 2014-03-08 00:00:06 –>」

お好みでどうぞ。

キャッシュリビルド。新しいファイルの生成中にこのサイトの登録ユーザー以外のユーザーに supercache のファイルを供給する。 (推奨)

ちょっと意味がよくわからない所ですが、キャッシュを再構築してる間は、supercacheという別途静的ファイルを供給するようにする、という所でしょうか。もしくは通常ページを見せる、かな?推奨とあるのでチェックをつけてた方が良いのかな。謎翻訳すぎて、わざわざ原文を覗いてみましたがわからなかったですぅ。誰か教えて。

追記1:おそらく後述するプリロードしたファイルをユーザに見せ、キャッシュ生成→記事表示ではなく、事前キャッシュ→記事表示&キャッシュ生成とするものだと思われます。

Proudly tell the world your server is Stephen Fry proof! (places a message in your blog’s footer)

フッターに誇らしげなメッセージを表示しちゃうぜ! という事らしいです。感謝の気持ちにどうぞ?

詳細

Enable dynamic caching. Requires PHP or legacy caching. (See FAQ or wp-super-cache/plugins/dynamic-cache-test.php for example code.)

phpもしくはレガシーキャッシュのための動的キャッシュを行うらしいです。FAQもしくはサンプルコードを見ろ、との事のようですね。キャッシュする関数や記述などを細かく設定する事ができるようです。細かなカスタマイズしたい人にはこれは嬉しいですね。

Mobile device support. (External plugin or theme required. See the FAQ for further details.)

携帯デバイスのサポートをするそうです。私のサイトは基本的にレスポンシブデザインで、携帯電話(ガラケー)のサポートは鼻から度外視なので切っています。

Remove UTF8/blog charset support from .htaccess file. Only necessary if you see odd characters or punctuation looks incorrect. Requires rewrite rules update.

.htaccessファイルからUTF8 charsetサポート記述を削除します。

Clear all cache files when a post or page is published or updated.

ページもしくは記事が、公開もしくは更新された場合に全てのキャッシュを開放(削除)します。

追加のホームページチェック。(非常にまれにホームページのキャッシングを止めることがあります) (推奨)

またもや謎翻訳。原文は「Extra homepage checks. (Very occasionally stops homepage caching) (Recommended)」です。余分なホームページチェック・・・という事でしょうか。よくわからないです。推測になるのですが、キャッシュを作成するときに、別ページのキャッシュも作成するのでしょうか。推奨とありますし。

コメントが投稿されたときに該当のページだけリフレッシュする。

これがオフだと、コメントされてもキャッシュが更新されないようです。何故オン推奨じゃないのでしょうか。

 

キャッシュされた最新のページを一覧表示する。

キャッシュファイルを一覧で見る事ができるようです。設定を変更した場合などに動作確認がしやすくていいですね。

・・・しかしもうちょっと情報が欲しいかもw

荒削りなファイルロック。おそらく必要ないですが、使用しているサーバーが非力な場合には役に立つかもしれません。警告 ! まれにですがサーバーを止めてしまうことがあります !

キャッシュファイルをロックするんですかね。非力なサーバーで、同じキャッシュファイルを同時に生成しようとした場合などのエラーを回避できるのだと思います。サーバーを止めてしまうという文章ですが・・・。

遅延 init。WordPress が読み込んだ後にキャッシュされたファイルを表示します。レガシーモードで有益です。

wordpress自体の処理が終わってからキャッシュファイルを読み込むという事ですかね。先のキャッシュカスタマイズと絡めて使うのかもしれません。

キャッシュファイルの保存にオブジェクトキャッシュを使用する。 (実験的) DO NOT CACHE PAGE secret key: hogehoge

ファイルキャッシュではなくオブジェクトキャッシュを利用する設定ですね。キャッシュをしないページにはシークレットキーを表示しろとの事です。

有効時間とガーベージコレクション

Cache Timeout

キャッシュの有効時間を設定します。この時間の間はそのキャッシュを利用し続けます。ページ更新頻度と相談して設定してください。秒設定ですね。一時間=3600 一日=86400 一週間=604800 参考にどうぞ。

Scheduler

キャッシュを削除するタイマーを設定するスケジューラ。キャッシュファイルが有効期限を過ぎると、すぐに削除されるわけではなくこのタイマーによって捨てられます。例えば大規模なサイトだと60秒でキャッシュを設定しつつ、90秒でこのタイマーを設定する必要があるようです。デフォルトでは一週間周期で削除するようですね。サイト規模に合わせて決めて下さい。また、キャッシュファイルを削除しない場合はタイマーを0秒に合わせて下さい、とのことです。

スケジュールの予定時間も表示してくれるのでとっても親切。

受け付けるファイル名と除外する URI

チェックをつけた項目はキャッシュしません。「検索」は大体毎回内容が異なると思いますのでチェックをつけてて良いかと思います。あとは運用しながら「記事を書いても○○ページは更新されないな」といった場合につけていけばいいかなと思います。

フロントページとホームページはちょっと違うので注意が必要です。フロントページとは「hoghog.com/」で表示される場所ですね。ホームページは「hoghog.com/」と「記事一覧」が表示されるページです。大抵の場合は記事一覧とhoghog.com/は同一なので問題ありませんが、固定ページをトップに表示していたりする場合は注意が必要ですよ。

あとはファイルパターンですね。サイトによって細かく設定する場合もあるかもしれません。

上で指定した除外文字列にマッチしてもキャッシュするファイル名をここに追加してください。

地味に重要です。これらをキャッシュしないけれど、この条件に当てはまるこれらはキャッシュを作成する。という場合に設定しますよ。

除外するユーザーエージェント

スマフォ専用のcssなどを用意している場合はこちらでスマフォのユーザーエージェントを設定します。また、googleなどのクローラーがやってきた場合、それらのアクセスでキャッシュを一気に作っては負担が大きいので除外した方が良いでしょう。デフォルトではbot類のユーザーエージェントが入っています。

ロックダウン

いきなり大量がアクセスが来た時のための設定のようですね。有無を言わさず静的ファイルを見せるようです。基本的には無効にしていた方が良いかと思われます。

Lockdown | IT用語辞典 | 大塚商会

ダイレクトキャッシュファイル

特定のアドレスだけを指定キャッシュしてしまう設定・・・かな? 巨大なトラフィックが来た時に~とあるので、おそらくページを丸々静的ファイルに書き出しちゃうのだと思われます。

プリロード

予めキャッシュファイルを用意しておき、botなどにはこのキャッシュを見せるようです。「Super Cache の静的ファイル」とあるので、先の「詳細」で設定したユーザー閲覧で生成されたキャッシュとは別のファイルを作っておき、botなどがやってきてキャッシュが作成されてなかった場合はwordpressによる素の表示ではなくこのファイルを見せるようですね。なるほど。

こちらの時間を「一週間」として、通常キャッシュの有効期限を「一日」とかにするのは良い感じに動作するのではないでしょうか。

当然のことながら、単純計算キャッシュファイルを二倍くらい使うのでは無いかと予想します。

プリロードされたキャッシュファイルは 分毎にリフレッシュされます。(0 にすると無効、最小 30 分)

プリロードする場合はこちらを30分以上に設定しましょう。

プリロードモード (レガシーなキャッシュファイルに対してのみガーベージコレクションを実行。推奨)

古いキャッシュファイルを削除する設定、ですかね。ガーページコレクションで設定したスケジュールで削除してくれると思います。

Preload tags, categories and other taxonomies.

タグやカテゴリーなどのタクソノミーページもプリロードします。

ファイルリフレッシュ時にステータスメールを送信する。

メールで状況を報告してくれます。

ソーシャルボタンをJavaScriptではなく画像で読み込む

1秒台を目指せ!ソーシャルボタンを高速に読み込む方法を比較する » aoringo works

script.jsでgoogleアナリティクスを読み込む » aoringo works

散々迷っていたのに、結局ソーシャルボタンは画像で読み込むようにしました。

JavaScriptで公式から読み込むと時間がかかるんですよね・・・。数字が出るのは嬉しいのですが、私みたいな弱小ブログではどうせ0ばっかですよ。

JavaScriptで各種ソーシャルボタンを読み込むと3秒かかっていた

詳しくは前回の記事をご覧下さい→1秒台を目指せ!ソーシャルボタンを高速に読み込む方法を比較する » aoringo works

どれくらいの時間がかかるのか良く分かると思います。

ソーシャルボタンを読み込むだけで三秒。これはとても大きな数字です。ページを移動するたびにこれだけの時間がかかるのです。大変な事ですよ。

このストレスはページをみてくださる閲覧者に直接のしかかってきます。恐ろしい事ですね。

じゃあもう画像で読み込んじゃおうよ

というわけで本題です。それならもうJavaScriptを使用せずに、用意した画像で良いんじゃない? ということです。

結果ですが、こうなりました。

トップページの表示速度です。わあ。ソーシャルボタンを画像で表示するだけでこんな速度出るんですね。実際、見てみるとビックリしますよ。

各種ソーシャルボタンを画像で読み込むのは簡単です。

<div class="socialset">
<!-- twitter -->
<a href="https://twitter.com/share?text=テキスト&url=アドレス" target="_blank" rel="nofollow">
<img src="画像アドレス" alt="twitter_share"/>
</a>
<!-- facebook -->
<a href="http://www.facebook.com/share.php?u=アドレス" target="_blank" rel="nofollow">
<img src="画像アドレス" alt="facebook_share"/>
</a>
<!-- google+ -->
<a href="https://plus.google.com/share?url=アドレス" target="_blank" rel="nofollow">
<img src="画像アドレス" alt="googleplus_share">
</a>
<!-- hatena -->
<a href="http://b.hatena.ne.jp/add?mode=confirm&url=アドレス&title=ページタイトル" target="_blank" rel="nofollow">
<img src="画像アドレス" alt="hatena_share">
</a>
</div>

これで読み込めます。その他のソーシャルボタンについては私は利用してないので調べてないです。もうしわけぬい。

また、ワールドプレスの場合は今表示しているページのアドレスを出力する関数がありません。なので、

<?php $url = is_single() ? get_permalink() : home_url();?>

とすると、「$url」変数に投稿ページでは現在のアドレスを。その他のページではトップページのアドレスを表示するようになります。

新規ウインドウでページを開くのと、nofollow属性は念のためつけてます。

JavaScriptでポップアップウインドウ内に投稿画面を開く

こんな奴です。小さなポップアップを出しましょう。新しいタブやウインドウよりは個人的にこっち派です。

jQuery(document).ready(function () {
jQuery(".socialset a").click(function () {
window.open(this.href, 'sosialwindow', 'width=550, height=450,personalbar=0,toolbar=0,scrollbars=1,resizable=1');
return false;
});
});

ちゃちゃっとjQueryで記述しちゃいます。socialsetクラスのリンクがクリックされたら小さなウインドウを表示するようにします。

これでソーシャルボタンの画像化終了になります。高速! 早い!

ちなみに、各種ソーシャルアイコンは→画像 – Arabiki – 上質なweb素材とソーシャルアイコン類 » aoringo works

ここで紹介している「Arabiki」様より頂きました。日本のソーシャルサービスの画像もあって素敵です。