誰でも簡単にオシャレなブログにすることができるWordPressのテーマJIN。

誰でもオシャレにできるはずなのに
思った通りにできてない!
なんてことありませんか?
わたしはスマホで見たときのヘッダーの表示がなかなかうまくいきませんでした…
今の時代、ブログの8割くらいはスマホから見られるとか。
なのに一番最初に目に入るヘッダーの表示が不自然だと、サイトの信頼性も下がりますよね。
そこで今回はスマホのヘッダー設定についてJINのマニュアルだけではわからない部分も詳しく解説していきたいと思います!
スマホヘッダーを見やすくしよう
スマホ普及に伴って、ブログ訪問者もスマホからの人がかなり多くなりました。
ブログはパソコンでの作業がほとんどなので、パソコンから見るとすごくおしゃれなサイトでも、スマホから見ると「なんだこりゃ!」となってるサイトもありますよね。
実はわたしもそうだったんです!
パソコンから見ると普通だったのですが、スマホから見てみると・・・

ということで、このままだとかっこわるすぎるので、見やすい表示に直していきます。
スマホヘッダー設定方法

ダッシュボード「①外観」の中の「②カスタマイズ」をクリック。
ヘッダー設定

「ヘッダー設定」をクリック。

ヘッダー全体の表示選択を「①非表示」にして「②公開」をクリック。
そうすると最上部のヘッダー部分が非表示になります。

今回の設定は「スタイル9(ヘッダー画像あり)」の場合です。
ヘッダー画像を設定されていない方は「表示」のままでもいいと思います。
両方試して好きな方を設定してみてくださいね。
ヘッダー画像設定
続いてヘッダー画像の切れてしまっている文字を調整します。

「ヘッダー画像設定」をクリック。

「①px」を調整してお好みの場所にテキストを表示させたら「②公開」をクリック。
テキストを上げたい場合はマイナス値を指定(例:-20px)、テキストを下げたい場合はプラス値を指定(例:20px)します。
参考サイト→JIN公式マニュアル
スマホでもヘッダーがちゃんと表示されるようになりました!

まとめ*スマホでもパソコンでも見やすいブログに
今回はバランスを考えてサブテキストはカットしました。
パソコンの設定画面でもスマホから見たサイトを表示できますが、実際の表示とは違ったりするので、直接スマホを見ながらの設定をおすすめします!
ヘッダーはブログの顔です。
少しでも読者さんに好印象を持ってもらえるようにしたいですね♪
