ブログのテーマをStinger3にしてみた



すごいという評判を聞いていて、変えられず変えられずにいたままだったのですが、ついにブログのテーマにStinger3テーマを導入してみました。

WordPressテーマのSTINGER3公式サイト

Stinge3にした理由

CSS書いたりJS書いたりするのは好きなのですが、SEOなどはあまり得意ではなく・・。
というこで、SEOに強いといわれているテーマを少しカスタマイズしながらSEOを勉強できないかなと思って導入してみました。

導入するまでにやったこと

導入するまでにやったことですが、ほとんど先ほど紹介した公式サイトにかかれていることをやっただけです。

  • 広告の設定
  • トップ画像の追加
  • オススメのプラグインの追加
  • 少しだけカラーリングの変更

手順が非常に詳しく載っているのでほとんどそのままやれば何も問題はないです。
All in one SEOはno indexのページが出来たりして、SEO的に弱いとあったのですが、このプラグインに自分が依存にしてしまっているところもあるので、これは引き続き使うことにしました。

少しだけカラーリングの変更

まんまデフォルトのままだとちょっと味気ないですし、芸も無いので少しだけ変えました。
Stinge3にある、style.cssがPC版のCSSでsmart.cssがスマホ用のcssになっています。
なので、両方を変えないとデザインが統一出来ません。

タイトルの変更

タイトルがデフォルトのままだと黒いので色を変えました。
smart.cssでは681行目あがりに、style.cssでは237行目くらいにあります。

[css] #container #header #header-in #h-l .sitename a {
color: #0099cc;
text-decoration: none;
font-weight: bold;
}
[/css]

「もっと見る」のカラーリングを変更

この部分もグレー時に黒い文字なので、青背景に白文字にしました。smart.cssはだいたい550行目にあり、style.cssは842行名あたりにあります。
「motto a」で検索すればすぐ出てきます。

[css] .motto a {
color: #FFF;
text-decoration: none;
background-color: #0099cc;//変更
padding: 5px;
/* color: #666;*/
color: #fff;//さらに上書き
text-align: center;
margin-top: 10px;
display: block;
}
[/css]

まとめ

ほんとにPVが上がるかはまだわかりませんが、ぱっと見ただけでも、色々なところが考えられているテーマだなというのは感じました!
あまり時間がなかったので、最小限のカスタマイズですが、もう少しちゃんといじってみたいと思います。
ではでは




ABOUTこの記事をかいた人

Web Developer & Web Designer at Yahoo! Japan. Like HTML, css, JavaScript, Apple, ra-men, Angular, b-monster.