WP Simplicity2.6でスマホで見た時のサイトタイトルつまりブログ名を折り返さないようフォントサイズを小さくした話

こんにちは、minoruです。

ワードプレスの無料テーマであるSimplicityで、ブログのタイトル(サイト名)が長い時にスマートフォンで見た場合にタイトルが折り返して2行になってしまい、ちょっと見た目がブサイクなので1行にしたいと思いました。

実行した手順としてはこんな感じ

  1. ネットで調べて出てきた方法を試すがうまくいかない
  2. Simplicityのバージョンが1.9.3だったので最新の2.6に変更しようとする
  3. バージョン2.6をダウンロード
  4. バージョン2.6をワードプレスの入ってるサーバーにアップロード
  5. 子テーマをダウンロード
  6. WP管理画面の外観→テーマから子テーマを選ぶと勝手に反映してくれた

7.子テーマ側のstyle.cssに以下を追加

@media screen and (max-width: 440px){
#site-title a {
font-size: 17px !important;
}
}

これでPCで見た時には通常サイズのサイトタイトルで、スマートフォンで見た時には17pxのちょっと小さめのフォントサイズのサイトタイトルが表示されるようになりました。

つまり、最初うまくいかなかったのはバージョンの違いによるものらしい。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする