すだなび

直感と自分を信じて楽しい毎日を!考えたことを好き勝手書くブログ


はてなブログのカスタマイズをしたよ。スマホ用の見出し変更と上に戻るボタン設置

おはようございます。天気も良く気持ち良いですね。僕は昨日から茨城県に来ています。(実家)
朝は鳥の鳴き声で目覚め、リビングに行くとコーヒーと朝食がすっと出て来る極楽モード。母上ありがとうございます。普段の生活も不満はないのだけどストレスが蓄積されているんだろうな。実家サイコーです。
  
f:id:sudanaoya:20170505093702j:plain
フラワリング(flowering)2017 – 国営ひたち海浜公園
※写真は茨城の観光名所「ひたち海浜公園」
 
 
さて。朝食を食べたあと時間が空いたのでブログのカスタマイズにせっせと励んでいます。
なんとなくブログを続けてきた中で圧倒的にスマホ経由の閲覧が多いことはわかっていたのだけど、ちょっと気分が乗らなくてカスタマイズしていなかったのだよね。。今日は重い腰を上げてカスタマイズするぞー!
 
 

①見出しをカスタマイズする

 
まずは見出しのカスタマイズ。上の緑のやつね。
PCデザインだけカスタマイズしてスマホデザインは放置の状況だったので変更。個人的に昔から緑色が好きなので緑色に決めた。ムックよりガチャピンが好きだし、紅茶より緑茶が好きだし、あぁ、前の携帯は緑色だった。緑良いよね緑。緑好きに悪い人はいないと思っています。
 
今回はこちらを参考にさせて頂きました。
www.yukihy.com
 
背景のカラーコードはこちらから。
simpleworks.jp


さて、次!
 

②一番上に戻るボタンをつける

 
ほら、いま右下にあるやつですよ!

たぶん、はてなブックマークかどこかで一度見ていたのだけど、そんなに長い文章書かないしなー。と思ってサボってました。でもたまに長い文章書くかもしれないし、何よりついてて邪魔なものでもないからね。よしつけましょう!ということでぽちっとやってみました!



 
www.travelbanana.net
  
上記サイトを参考にしましたが1箇所だけ躓きました。むむ……スマホだとCSS編集の欄がないではないか。って。
  
いや、でもスマホ画面でこのデザイン見たことあるし、できない筈ないよね? と悩みつつ方法を検索。
 
tsukuruiroiro.hatenablog.com
 

あ。。html編集ボックス内で<style>タグで囲むのね。さっき①でやってたね…
なんか10代の頃はこういったタグにせっせとのめり込んでた筈なのになーなんて思いつつも無事完成!
 

右下の「∧」みたいなマーク。なんか出たり出なかったりするけど・・・まぁOKでしょう!(適当)
 
カスタマイズは楽しいね!また定期的に見直そうと思います。