アフィリエイト Wordpress stinger

Stinger5の小技2 デザインを女性っぽくする簡単な方法

更新日:

Stinger5の小技その2です。

クールでカッコイイStingerですが、女性向けのサイトなどを作成する場合に、一工夫することで見栄えが大きく変わります。

Stinger For Ladyをテーマとして適用すれば良いのでしょうが、正直テーマを色々運用するのは大変です。

ENJI様の別のブログでも掲載されていますが、自分への備忘録として書いておきます。

スポンサーリンク

サムネイル画像を丸くする

【style.css】に以下のコードを追加するだけでOKです。

#topnews img {
  width: 150px;
  border-radius: 150px;
  -webkit-border-radius: 150px;
  -moz-border-radius: 150px;
}
#kanren img {
  width: 100px;
  border-radius: 100px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
}

フォントをGoogleフォントを使う

【header.php】に以下のコードを追加する

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">

の下に

<link href='http://fonts.googleapis.com/css?family=Josefin+Sans' rel='stylesheet' type='text/css'>

さらに
【style.css】の上部に記入してあるfontfamilyを以下に変更する。

font-family: 'Josefin Sans', helvetica, osaka, "MS PGothic", sans-serif;

以上です。
併せて、背景色などを変えても雰囲気が変わりますね。

-アフィリエイト, Wordpress, stinger

Copyright© 上善如水 , 2019 All Rights Reserved.