【はてなカスタマイズ】ヘッダー余白を小さくしてスマホ表示をよりコンパクトにしよう2018-10-13【はてなカスタマイズ】ヘッダー余白を小さくしてスマホ表示をよりコンパクトにしようブログこのブログははてな公式テーマ「Blooklyn」を使っています。以前、サイドメニューの余白調整をする記事を書きました。今回は、スマホで見た時に以前から気になっていた、ヘッダー部分の余白調整をやってみました。わずかな調整ですが、きゅっとコンパクトな表示になって、スマホ表示がいい感じになった気がします!同じ事でお困りの方の参考になればと思います。はてなヘッダー部分の余白を小さくしたいまずbefore・afterはこちら。余白をぎゅっと縮め、スマホでよりコンパクトに見せたかったのです。カスタマイズコード(コピペOK)私のブログテーマは「Blooklyn」なので、その例としてコードを記載します。私と同じようにグローバルメニューをつけている人とか、パンくずリストをカスタマイズで追加している人は、下記私のコードを同じように使えると思います。待って!コピペする前に、変更しても問題ないか、Chromeのディベロッパーツールを使って確認してみてください。」などの「id」や「class」がそのテーマによって違うかもしれませんからね。それに、不安な人は必ずバックアップをとってください。どのくらいの余白にしたいかは、ひとつずつ貼り付けて表示確認をしながら進めてください。最初考えていたのは、ヘッダ部分に広告を貼ろうとしたから。こちらは試しに貼り付けてみましたが、イマイチどのサイズがいいか、広告だらけで訪問者が不快に思わないかが気になりひとまず保留。次に、プロブロガーの方は、最初に表示した時に見えるファーストビューの部分がカッコいい!!と思ったことがきっかけでした。会社HPなどでもそうですが、トップページ上部部分に「伝えたいこよ」「見てほしいこと」を入れるといいそうです。ページに訪れた瞬間、離脱されるかもしれませんからね。いつかWordPressへ移行してみたいと思っていますがまだまだ先になりそうです。このはてな「Blooklyn」の状態で、少しずつ気になる所に手を入れてみたいと思います。WEB関係の仕事をしておきながら、この手のジャンルはあまり...2018-06-04【初心者向け】矢印や赤枠の挿入など。最近、ブログを始めた知人からブログに載せる画像についてこん...2018-01-27ブログ初心者の私が1ヶ月継続!所感や修正内容、SEO対策について。共働き3週間目|夫と喧嘩ばかり。【3人目妊娠5ヶ月】お腹が出るのが早い早い...経産婦の油断。子育て中に1LDKで暮らすメリット・デメリット~家族4人でも十分住めた!~入社1年、交渉の末に基本給アップ。~アラサー主婦の再就職~女は可愛げと素直さがあってなんぼだ。読者になるはてなブログをはじめよう!yumekuro789さんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。