WordPress覚え書き

《WordPress》効果に期待!!直帰率低下させる為に行った7つのカスタマイズ。

この記事は約5分で読めます。
[PR]記事内のアフィリエイトリンクから収入を得る場合があります

写真 2013 01 07 13 08 21

@kentaro_jpです。
ブログの反省点、改善点が見えて来た。2012年12月のまとめ! | 憲.comここでもお話した通り、直帰率を下げる為にいろいろやってみたのでご紹介です。

Googleカスタム検索を設置

スクリーンショット 2013 01 07 13 12 32

ブログ内の記事を検索する為にGoogle カスタム検索を設置しました。
おかげさまで検索がとても楽になりました。
スクリーンショット 2013 01 07 13 14 35

ここを参考にしましたよ。

ブログ内検索をGoogleカスタム検索にしてみた&広告を消してみた。 | norirow’s Diary

カテゴリを40→18くらいに減らす

スクリーンショット 2013 01 03 10 05 28

よくわからないカテゴリも多かったので減らしました。すっきり。

YARPP関連記事を表示

スクリーンショット 2013 01 07 13 24 12
記事下と、サイドバーに表示。

スクリーンショット 2013 01 07 13 23 55LinkWithin – Related Posts with Thumbnails

Yet Another Related Posts Plugin for WordPress

スクリーンショット 2013 01 07 13 36 55
設定→関連記事(YARPP)設定→右上の表示オプションで細かい設定が出来ます。

関連記事表示されずらい時は設定をしてみると良いかも。

スクリーンショット 2013 01 07 13 34 30

ここを参考にしましたよ。

[WordPress] 関連記事プラグイン YARPP にサムネイル画像を表示させてみた。 | norirow’s Diary

はてブウィジェットをサイドバーに設置

単純なアクセス数では無く、多く反応を頂いた記事と言う事で表示しています。

はてなブックマークブログパーツ

ここから設置のコードを取得出来ますよ。

ホーム画面用のアイコンを作成

NewImage
直帰率は関係ないかもしれませんが、アクセスして頂きやすくするといった目的ですね。

プラグインAll In One Faviconを使用。

スクリーンショット 2013 01 08 19 43 44

Skitch 2.0.3(無料)App
カテゴリ: 仕事効率化, グラフィック&デザイン
販売元: Skitch – Skitch Inc(サイズ: 17.6 MB)
全てのバージョンの評価: (209件の評価)

アイコンはSkitchでサクッと作りました。漢字だけなのでw

WPtap Mobile Detectorでモバイル用テーマを別に設定。

写真 2013 01 08 19 57 41

WordPress plugin for iPhone, Blackberry, Andriod | WPtapを使用し、モバイルテーマを別のテーマに設定。

レスポンシブルデザインと呼ばれる、PCもモバイルも自動で変換してくれるテーマを使用しています。

僕が現在使用しているテーマ。

Yoko WordPress Theme | Elmastudio

こちらを参考に。
WPtouchをやめてiPhone用にモバイルテーマを個別に設定してみた。WordPressプラグイン「WPtap Mobile Detector」 | norirow’s Diary

WPtouchを卒業!!iPhoneに最適化されたテーマと簡単なカスタマイズ方法など[wordpress] – nori510.com

レスポンシブルデザインはコチラの記事を参考に選びました。
iPhone表示にも対応、レスポンシブWebデザインの無料WordPressテーマ15選(プラグイン付) – Photoshop VIP

見た目は非常によろしいのですが、テーマの編集をする時に現在そのテーマにしないと編集出来ない場所があったりするので、すこし検討が必要かなと思ってます。

これだけ弄くるならローカルインストールも必要かなと。

WordPressをローカルにインストールする | Webクリエイターボックス

メモっておこう。。。

CSSをすこし変更。見出しを改良。

/* — 独自に付け加えた設定 — */
#content h2{
color:#333333 ;
font-size:150%;
font-weight:bold;
border-left:solid 10px #1E90FF;
margin: 40px 0 10px 0px;
padding-left:10px;
   
}

/* — 独自に付け加えた設定 — */
#content h3{
color: #333333;
font-size:120%;
font-weight:bold;
line-height: 1.5em;
border-left:solid 10px #FF7777;
margin: 0 30px 0 0;
padding-left:10px;
}

/* — 独自に付け加えた設定 — */
#content h4{
color: #333333;
font-size:120%;
font-weight:bold;
line-height: 1.5em;
border-left:solid 5px #7C7 ;
margin: 0 10px 0 0;
line-height: 180%;
padding-left:10px;}
border-left:solid 10px #FF1493 ;

見出しを変更しました。柔らかい色合いで。見やすく。
まだまだ改良か必要ですね。

画像をセンタリングかけました。

スクリーンショット 2013 01 08 20 16 39

昔の記事もこのとおり。

するぷろから投稿する画像が左によっていたのがずっと気になっていたので。

面倒だったのでCSSを修正して記事内の画像をすべてセンタリングさせてみた。 | Oh-Blog

スクリーンショット 2013 01 08 20 21 40

display:block;
margin: 0 auto;
text-align: center;

追加したよ。

まだまだ改善致します。

他の方が行っていることとすこし違うかもですが、試行錯誤して改善を重ねて行きます。
モバイルはもっと改良を重ねなきゃですね。

WordPress WordPress Pluginsをいじくる前に良い準備運動になったと思います。

目的は自作テーマですね!!( ꒪⌓꒪)☆

おわり。見やすくなったかな?@kentaro_jpでした。

この記事を書いた人

office Tim33代表。クラウドファンディングプロデューサー / 取材・ガジェットライター / 写真家 / 講師 / メタルドラマー
ペットボトル工場オペレーター→ライターに転職。今どちらも歴11年。
生まれも育ちも札幌で実家が沖縄の埼玉人。スペインとフィリピン、長野、広島、沖縄にルーツがあります。
CAMPFIRE公式キュレーター、とちぎファンズサポーター
趣味は格闘技観戦とラーメン巡り、調べること。
詳しいプロフィールはこちらからどうぞ→プロフィール

あなたにフォローして頂けると更新の励みになります!
記事が役に立ったらお友達に教えて頂けると嬉しいです!
あなたにフォローして頂けると更新の励みになります!

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