カティーの旅とマイル

僻地に赴くエンジニアの旅行記やマイルの貯め方を紹介します

はてブロPro スマホデザインカスタマイズ


皆さんこんばんは!パソコンの前で集中しすぎてヘトヘトなカティーです。

適度な休憩大切ですね。。

 

ところでここ最近色々書きたい事があったのに全く書けていません。。。

というのも、実はちょっとはまってしまったことがありまして。

 

スマホから私のブログを見て下さっている方はお気づきかもしれませんが、少しずつスマホ版のレイアウトをいじっています。

 

[初期設定時]

f:id:kattie_travel:20171130003339p:plain

 

 

変更後[2017/12/7]

 

f:id:kattie_travel:20171207000140p:plain

 

 

f:id:kattie_travel:20171207000215p:plain

 

 

変更点と参考サイト

①見出し部分の変更

標準ではただの太字だった見出し背景色をつけて見やすくしました!参考にしたものはLITERALLYさんの下記記事内「2.記事中の見出しを変える」です。

tsukuruiroiro.hatenablog.com

 

②画面下にメニューバーを追加

時々見かけていた画面下のメニューバー。これ、おしゃれですよね!ということで下記サイトで紹介されていたコードを使わせて頂きましたm(__)m

english-apple-diy.hatenablog.com

 

ハテブロで使えるアイコンWebフォントまとめ

shirokai.hatenablog.com

 

 ④ヘッダーをカスタマイズ

www.webproduct-lab.com

 www.junpeihazama.com

 

 

今後の課題(はてブボタン)

お気づきかもしれませんが、はてブボタンがうまく作動していません。。

これをなんとかしようと4時間ほど粘りましたが・・・

役に立つかもしれないサイトのリンクです(備忘録替わり)

正月休みにでももう一度チャレンジします。

izu.wpblog.jp