読者です 読者をやめる 読者になる 読者になる

太陽がまぶしかったから

C'etait a cause du soleil.

はてなブログのスマートフォン表示で出てくる追尾ヘッダーを消す方法

プログラミング プログラミング-はてなブログカスタマイズ

f:id:bulldra:20150323130512j:plain

はてなブログのスマートフォン表示の追尾ヘッダーがウザい

 はてなブログのスマートフォン表示が変更されて、追尾ヘッダーがつくようになりました。スマートフォンの小さい画面で追尾されるとウザいので嫌いなデザインです。

f:id:bulldra:20150323130513j:plain

 イラッときたので消してしまいましょう。スマートフォン表示時のヘッダーやフッターを変更してよいのはPROユーザーのみという制約がありますので、ご注意ください。

追尾ヘッダー非表示化の設定方法

f:id:bulldra:20150323130032j:plain

 デザイン設定画面のスマートフォンタブのフッターに以下のCSSを追記します。

<style>
/* ヘッダー表示有無 */
#globalheader-container {
    display:none;
}

/* 余白調整 */
#container {
    padding-top:20px;
}
</style>

f:id:bulldra:20150323131053j:plain

 はい消えたー。スクロール追尾もされません。上部の余白は好みで設定してください。

まとめ

 そんなわけで、はてなブログのスマートフォン表示で追尾ヘッダーを消せました。スマートフォン表示のスタイルシートを外部ファイル化する方法については以下を参照してください。

 はてなブログのスマートフォン表示は、ランキング表示といい、追尾ヘッダーといい、改悪にも思えるような変更を勝手に加えておいて、設定で簡単に戻せるようにしないので困ってしまう事が多いのです。

 『PageSpeed Insights』の点数もスマートフォン表示だと低くなってしまいますし、まずはシンプルに表示できるようにしてもらって、そこから色々な表示を加えたい人だけが加えられる構造にして欲しいなぁと思いました。なお、設置サポートや表示スタイル/アルゴリズムのカスタマイズ等のご依頼がありましたらサポートライセンスの購入をお願いいたします。

すべての人に知っておいてほしい スマートフォンサイトデザインの基本原則

すべての人に知っておいてほしい スマートフォンサイトデザインの基本原則

  • 作者: 石本光司,いちがみトモロヲ,外間かおり,矢野りん,加藤善規,小林信次,斉藤祐也,境祐司,谷拓樹,豊沢泰尚,古籏一浩
  • 出版社/メーカー: エムディエヌコーポレーション
  • 発売日: 2012/08/27
  • メディア: 単行本
  • 購入: 2人 クリック: 17回
  • この商品を含むブログ (6件) を見る

関連記事