WordPress初心者でも月間3万PV安定になりました。Stinger5の設定を全て晒す備忘録

WEB関連

シルバニアファミリー

【最終更新日:2016/04/05】

こんにちは、ぶんちょうです。

趣味とアウトプットをかねたWordpressでのブログですが、まともに向き合うようになってから約1年。ようやく月間3万PVで安定してきました。また2014/10は4万PVでした。

wordpress

逆に言うと、なぜか月間3万PVの壁にぶつかっているのですが。まあ努力が足りないのは分かっています。でもGoogle adsense広告も増えてきて、居酒屋で2,3回呑めるくらいにはなってます。ありがたいことです。

で、たまに新しい環境を作ったり、環境が大きく変わるときなど必ず行うことをまとめてみました。この記事は変更次第、随時更新します。

 

2016/04/05

時間がないのでメモ→ Stinger7 にアップ。コメント欄削除、最新記事一覧削除はStinger管理で実施。ブログタイトル名に「情報ポータルブログ:」追加。タグクラウド追加。プラグインSearch Regexを追加してTwitterアカウントを一括修正。

  1. WordPress初心者でも月間3万PV安定になりました。Stinger5の設定を全て晒す備忘録
    1. テーマ
      1. Stinger5
      2. 子テーマ”Stinger-minimum”を新しくなった「STINGER5」用に作りなおしました。
    2. 必須カスタマイズ(バグつぶし含む)
      1. 【STINGER5】コピペOK!サイドバーにアイコンフォントでSNS各種のフォローボタンを作る
      2. 【STINGER5】コピペでOK!ヘッダーにアイコンフォントのフォローボタンを設置する方法
      3. Android版Chromeで「 」が「・」になってしまうChromeバグのWordPressでの対策方法
    3. UI向上カスタマイズ
      1. 【STINGER5】『はてブボタン』を新しいバルーンデザインへ変える方法
      2. STINGER5の投稿記事に表示されるコメント欄を非表示にする
    4. ページ表示スピードアップカスタマイズ
      1. .htaccessを編集する
    5. モバイル向けカスタマイズ
      1. 驚くほどアクセス数が増えるかも!?WordPressへ誰でも簡単に追従するソーシャルボタンを一瞬で付けられるプラグイン
      2. 【STINGER5】スクロールしてもフッターで固定するメニューを設置してみたよ!
    6. プラグイン
      1. トラブルや相性問題について
      2. 特にオススメなプラグイン
      3. インストール済みプラグイン一覧【2015/08/26更新】
    7. 写真素材
      1. 有料素材「PIXTA」
    8. レンタルサーバ
      1. エックスサーバ
    9. 検索順位のチェック
      1. GRC(Windows専用ソフト)
    10. テスト的にやってみたカスタマイズ
      1. フェイスブックプラグイン
    11. 近日対応予定カスタマイズ
      1. STINGER5でアドセンスの配置を記事下ダブルレクタングルに変更してみました
    12. まとめ

WordPress初心者でも月間3万PV安定になりました。Stinger5の設定を全て晒す備忘録

テーマ

Stinger5

STINGER
シンプルで高機能。WordPressテーマ

これを入れなければ始まらない。レスポンシブ対応の無料テーマの最高峰(当社比)。最初は「テーマ」って何?って状態でした。要するにデザインテンプレートですわね。

子テーマ”Stinger-minimum”を新しくなった「STINGER5」用に作りなおしました。

https://scope.minibird.jp/niji-life/archives/546

CSSがよく分かっていないヘタレなので子テーマに頼ってます。というかStinger5がまだ成長期なので子テーマは必須かと思います。親テーマをあまりいじらなくて済むのもありがたい。

 

必須カスタマイズ(バグつぶし含む)

ほとんどソースをいじってません。というか、いじってもテーマを更新したりしたときに元に戻ったりして分からなくなってます。思い出したら書き加えます。

【STINGER5】コピペOK!サイドバーにアイコンフォントでSNS各種のフォローボタンを作る

ページが見つかりません。 - ShufuLife[主婦ライフ]

画像アイコンを呼び出すより早いし、なにより見やすい。フォロー数がもっと欲しい。

【STINGER5】コピペでOK!ヘッダーにアイコンフォントのフォローボタンを設置する方法

ページが見つかりません。 - ShufuLife[主婦ライフ]

なんかオシャレな感じにしてみたいので。

Android版Chromeで「 」が「・」になってしまうChromeバグのWordPressでの対策方法

【STINGER5】AndroidのChromeで が「・」になってる気がする
全く未検証な話だけど、手持ちのDIGNO DUAL2でこのサイトの表示確認をする ...

アンドロイドスマホのブラウザで、改行部分が「・(ナカグロ)」になってしまうのを修正。Chrome側のバグのようですが、Wordpress側のフォントを変更することで回避。【2015/09/11追加】

修正箇所はstinger5ver20141011: スタイルシート (style.css)
font-family: “メイリオ”, Meiryo, “ヒラギノ角ゴ Pro W3”, Hiragino Kaku Gothic Pro, “MS Pゴシック”, sans-serif;
こうなっていたのを
font-family: Helvetica,”メイリオ”, Meiryo, “ヒラギノ角ゴ Pro W3”, Hiragino Kaku Gothic Pro, “MS Pゴシック”, sans-serif;
こうしても変わらなかったので長すぎたかと思って
font-family: Helvetica,”メイリオ”, Meiryo, sans-serif;
にしたら治りました。

 

UI向上カスタマイズ

必須ではないけど、視認性を高めたり使いやすくしたりするためのカスタマイズ。

【STINGER5】『はてブボタン』を新しいバルーンデザインへ変える方法

【STINGER5】『はてブボタン』を新しいバルーンデザインへ変える方法
どうもこんにちは!@dearwalker_yuyaです。 SEOに強いと人気のWordPressテーマ『STINGER5 ...

やってみた。すぐできた。【2014/11/05追加】

STINGER5の投稿記事に表示されるコメント欄を非表示にする

STINGER5の投稿記事に表示されるコメント欄を非表示にする | AC-5

場所をとるわりには役に立たないのでカットしました【2015/10/27追加】

 

ページ表示スピードアップカスタマイズ

.htaccessを編集する

mod_deflateとmod_expiresを有効にすることでページの表示スピード高速化を図ります。【2015/09/17追加】

これだけでGoogle PageSpeed Insightsの値が良くなりました。

モバイルは42→50へ。

pagespeedinsights_201500917_01

パソコンは58→69へ。

pagespeedinsights_201500917_02

Gtmetrixについても以下のようなスコアになりました。YSlowをもう少し上げたいけどいじる時間が無い・・・。

gtmetrix_20150916_01

設定方法は、サイト名/wp/public_html/.htaccessへ下記を追記します。

 

<IfModule mod_deflate.c> SetOutputFilter DEFLATE # Mozilla4系古いブラウザで無効/MSIEは除外 BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4.0[678] no-gzip BrowserMatch bMSI[E] !no-gzip !gzip-only-text/html # gif,jpg,png画像ファイル圧縮済みの場合再圧縮しない SetEnvIfNoCase Request_URI .(?:gif|jpe?g|png|ico)$ no-gzip dont-vary SetEnvIfNoCase Request_URI _.utxt$ no-gzip #好きなの圧縮 text,html,xml,cssなど AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/atom_xml AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/x-httpd-php </IfModule> <ifModule mod_expires.c> ExpiresActive On ExpiresDefault "access plus 1 seconds" ExpiresByType text/html "access plus 1 seconds" ExpiresByType image/gif "access plus 30 days" ExpiresByType image/jpeg "access plus 30 days" ExpiresByType image/png "access plus 30 days" ExpiresByType image/x-icon "access plus 30 days" ExpiresByType text/css "access plus 20 days" ExpiresByType text/javascript "access plus 3 days" ExpiresByType application/x-javascript "access plus 3 days" ExpiresByType application/x-shockwave-flash "access plus 1 years" </ifModule>

 

ちなみに、さくらインターネットのレンタルサーバではmod_deflateに対応していないという情報があります。オニオン座では、エックスサーバを使用しているので問題有りませんでした。

 

モバイル向けカスタマイズ

驚くほどアクセス数が増えるかも!?WordPressへ誰でも簡単に追従するソーシャルボタンを一瞬で付けられるプラグイン

一瞬で追従するソーシャルボタンを付けられるWordPressプラグイン | UNIFASブログ
このページから、追従するソーシャルボタンがWordPressへ一瞬で付けられるプラグインをダウンロードすることが出来ます。

ネットを徘徊中に発見。Wordpress.comでは見つけられない有能プラグイン「Add Share Button」。【2015/05/29追加】

【STINGER5】スクロールしてもフッターで固定するメニューを設置してみたよ!

https://shufulife.com/footer-menu/

前述のプラグイン「Add Share Button」よりこっちの方が好みでしたので、こっちを入れました。【2015/08/26追加】



プラグイン

トラブルや相性問題について

現時点、インストールして有効化しているプラグインを完全列挙します。実はバックアップ系が入っていないので目下探し中です。→ BackWPupを入れました。エラーは出ていません。【2015/08/26追記】

なぜバックアップ系が入っていないかというと、サーバをお名前ドットコムからエックスサーバへ移転した際、なぜか大量のエラーを吐いてしまったから消してしまいました。

その他、相性問題は起きていませんが、JetPackのパブリサイズ共有という記事公開時にツイッターやフェイスブックへ送信する機能だけ、公開時にオフにしています。

理由はパーマリンクが正常に入ってくれないことです。スラッグを入力してもなぜかツイッター等に書き込まれるURLがhttp://www.onion-za.jp/post-2426/のようになってしまいます。

特にオススメなプラグイン

WordPressで「はてなブログカード」を利用する Pz-HatenaBlogCard【2015/09/11追加】

https://poporon.poponet.jp/pz-hatenablogcard

自分のブログだけでなく、他人のサイトを紹介するときに便利。まだ開発して間もないせいか少し不安定なときがありますが、非常にありがたい。ショートコードを使うと以下のようになります。素敵。

 

インストール済みプラグイン一覧【2015/08/26更新】

現時点、インストールかつ有効化しているプラグインは以下の通りです。

Akismet
スパムコメントを排除してくれます。

All In One SEO Pack
他にも似たようなものがありますがずっと使っています。

AmazonJS
アマゾンの個別商品へのショートコードを作成。紹介しやすくなります。

BackWPup
バックアップツールの定番。無料で使えますが、料金を払って有償ユーザーになるとバックアップ先が増えたりします。

Better Delete Revision
記事を書いていると古いバックアップ記事が貯まります。これらを一括削除してくれるツールです。

Category Order
固定ページの並び順を変更することができます。

Crayon Syntax Highlighter
HTMLコードなどを文中に記載するときに便利です。

DB Cache Reloaded Fix
DBサーバをキャッシュしてくれるらしい。管理画面が軽くなったような気がします。すみません。よく分かりません。

EWWW Image Optimizer
画像サイズを最適化してくれます。一括再圧縮などもできて便利。

Exec-PHP
ページ内やウィジェット内に記載したPHPコードを実行してくれるツール。これがあると特にウィジェットのカスタマイズが捗ります。

Google Analyticator
グーグルアナリティクスのデータをWordPress管理画面で見ることができます。

Jetpack by WordPress.com
アクセス解析、SNS自動連携、画像ファイルのCDN化など盛りだくさん。

Limit Login Attempts
WordPress管理画面へのログイン画面のセキュリティ対策として。間違ったIDPWで何度か試すとロックがかかります。

Permalink Redirect
一年以上前にパーマリンクを変えたときから入れっぱなしです。パーマリンク(URLの後ろの方の規則パターン)を変更したときに便利。

Post-Plugin Library
これ単体では動きません。

post-views
人気記事のランキングを自動作成できます。

PS Auto Sitemap
サイトマップページの中身を自動生成してくれます。

PubSubHubbub
パブサブハバブと読みます。記事公開時にGoogleへインデックスしてもらえるよう通知するツールです。

Pz-HatenaBlogCard
最近入れたばかりです(2015/8)。はてブのブログカードのようなものを作成できるようになります。他人のサイトを紹介するのにも便利。

Quick Adsense
MOREタグを挿入すると、そこへGoogle Adsenseのアフィリエイトバナーを貼ってくれます。

Redirection
404エラー(ページが見つかりません)が出てしまったときに、任意のページへ301リダイレクトするよう設定が可能。

SNS Count Cache
SNSのフォロワー数などをキャッシュしてくれます。

Table of Contents Plus
たぶん実際には使っていませんが入れています。表組を記事内に書くときに便利。

Tweetily
設定をしておくと定期的に自動でツイートしてくれます。

Twitter Cards Meta
ツイッターカードの生成をしてくれます。

Widget Logic
ウィジェット毎に条件分岐設定をすることができます。実際には使っていません。

WordPress Popular Posts
人気記事を自動選択して表示してくれます。

WordPress Related Posts
関連する記事を表示することが出来ます。手動設定も可能なのが便利。

WP Browsing History
最近入れたばかりです(2015/8)。閲覧者の閲覧履歴がウィジェットに表示されます。

WP https Compression
圧縮転送することで表示スピードアップが期待できるらしい。正直、どの程度の効果があるかよく分かっていません。

WP Multibyte Patch
文字化け防止に入れています。

WP Social Bookmarking Light
SNSボタンを簡単に追加することが出来ます。

WP-ServerInfo
サーバ情報を表示することが出来ます。

 

写真素材

有料素材「PIXTA」

フリー素材を一括検索できるタダピク(https://www.tadapic.com/)を使っていましたが、どう考えても有料素材の方が品質の良いものが多いようです。また無料画像は皆さんお使いなのか他のブログとカブってしまうことがあります。

とはいえ一枚数千円をばんばん使うのは貧乏性の私としては精神的にキツイ。そこで定額制の有料素材サイトのPIXTA(ピクスタ)に出会いました。仕事である企業のブログを運営代行していますが、こちらの画像を使用しています。コピーライト表示不要でロイヤリティフリー。これで満足しています。
写真・イラスト・動画素材販売サイト【PIXTA(ピクスタ)】


レンタルサーバ

エックスサーバ

もともとはお名前ドットコムの共有サーバSD12を使っていました。
機能的には満足していましたが、記事保存時に500エラーを起こすことがあったのでパフォーマンス不足を疑い、エックスサーバ社の共有サーバへ移行しました。
これが正解でした。表示も体感で分かるほど速くなり、500エラーもなくなりました。

【エックスサーバ レンタルサーバ】
https://www.xserver.ne.jp/

 ちなみに、姉妹版でワードプレスに特化した『wpXレンタルサーバー』というのもあるようですが、なんだか謎の方法で高速化しているとのことで、何かあったときにハマりそうなのでやめました。

【エックスサーバ wpXレンタルサーバ】
WordPressの運用に特化したクラウドサービス『wpXクラウド』

 

さらに顧客のサイト運営などは、前述のエックスサーバレンタルサーバの機能や使い勝手をほぼそのままに、サーバあたりの利用者を制限してより安心な環境を提供している同社サービス「シックスコア」がオススメです。ぶんちょうも仕事でクライアントさんのブログを運用するためにこのシックスコアを使っています。請求書の書面発行&PDF発行が可能なところもありがたい。

【シックスコア】
50GB、月額1800円(税抜)~ ビジネス仕様レンタルサーバー【シックスコア】


 

検索順位のチェック

GRC(Windows専用ソフト)

ブログへのアクセス状況はGoogleアナリティクスなりで確認ができますが、ブログが、どのキーワードでどの位の順位にあるのかが分かると日々の励みになります。

私ぶんちょうが使っているのはGRCです。毎日自動巡回をしてグラフ化してくれるので非常にわかりやすいです。


検索順位が、見える。検索順位チェックツールGRC

 

テスト的にやってみたカスタマイズ

フェイスブックプラグイン

コメント - ソーシャルプラグイン - ドキュメンテーション - Facebook for Developers

に基づいてFBコメントを入れてみた。

header.phpにjsを入れて、single.phpにdivを入れてみた。

レスポンシブには対応してないみたい。【追記:2014/11/15】

近日対応予定カスタマイズ

STINGER5でアドセンスの配置を記事下ダブルレクタングルに変更してみました

STINGER5でアドセンスの配置を記事下ダブルレクタングルに変更してみました
STINGER5を導入し、PCの広告表示をダブルレクタングルにしました。※導入したサイトはこちらのブログです。下記は補足説明は極力省きます。詳細については後述の参考ブログをご覧下さい。それでも、独自のやり方を採用した部分もあり、その手順を備

なんとなく試してみたい。レスポンシブが崩れなければいいのだけど。

 

まとめ

hタグだらけになってしまた。
ともあれ私のような素人でもここまで来れたのは、上記のテーマや情報を提供してくれる皆様のおかげです。本当に感謝です。

 



以上、ブログ「オニオン座」がお届けしました。最後までご覧下さり誠にありがとうございました。

タイトルとURLをコピーしました