薬天

小学校教員→専業主婦時々ポスティングスタッフのアラサー女が様々な体験談を語るブログ

薬天

ブログデザインを変更。レスポンシブデザインデビュー!

vol.327

 

※レスポンシブ(responsive)デザインを

レスポンシブル(responsible)デザインと書いていることを

cremaさんから教えていただきました。

早速訂正しております。ありがとうございました。

 

私恥ずかしながら

はてなブログ開始327日目にして初めて

ブログデザインが豊富にあることを

知りました(;´Д`A ```

 

これまではデザイン設定画面の左に表示されている

f:id:satomiman10:20180424210703p:plain

赤枠の部分のデザインしかないと思っていたのです…

 

何の気なしにスクロールしてみると一番下に

f:id:satomiman10:20180424211401p:plain

テーマストアでテーマを探すという文字が。

 

ここをクリックするとたくさんのデザインが紹介されていました。

f:id:satomiman10:20180424211518p:plain

知っている方にとっては当たり前すぎる内容で申し訳ありませんm(__)m

 

人気のテーマが無料でインストールできたので

1位のMinimalismをインストールすることにしました。

作者のこどみす(codomisu)さんのブログです。

 

このページにカスタマイズの方法が載っていたので

さっそく一つずつ挑戦。

 

というのも

デザイン変更を決意した最大の目的は

グローバルメニューの設置をしたかったからです。

 

以前書いた記事の中で

本格的なもの(=グローバルメニュー)もチャレンジしたのですが

なぜか設定を反映するときになって

毎回固まってしまったので( ;∀;)

という文章を書いているのですが

レスポンシブデザインのものにしていなかったからなんですよね(;^ω^)

 

さらにさらに・・・

hana (id:HappyUnbirthday)さんの記事で

グローバルメニューの利点や設置の仕方が

わかりやすく紹介されていたのを見て

やる気が倍増したということもあります。

 

長年の夢がようやく叶うときが来ました☆

 

膨大になってしまったカテゴリを組み込むのは

ちょっと時間がかかりそうだったので(;´Д`)

 

今日のところはとりあえず

プロフィールにつけていた4つのリンク

(詳しいプロフィール・プライバシーポリシー・欲しいものリスト・お問い合わせ)

をグローバルメニューにしてみました。

 

Before→After

f:id:satomiman10:20180424220131p:plainf:id:satomiman10:20180424222425p:plain

 

 

ただ一つ誤算が…

ささぽんさんがデザインしてくださったタイトル画像が

スマホ版とPC版を別々に設定するデザインでの設定だったので

レスポンシブルデザインにすると

スマホ版ではどうしてもTOP画像が見えなくなるのです( ;∀;)

 

色々とやってみたのですが私の実力ではどうしようもできず

泣く泣く文字でブログタイトルを表示することにしました。

かなり気に入っていただけに残念です( ;∀;)

ささぽんさん、すみません…薬天のブログアイコンは引き続き愛用させていただきます。

 

【追記】

その後こちらの記事を見つけたのでやってみたところ

 PC版、スマホ版ともに

タイトル画像をきれいに掲載することができました!

 

冒険者Lv.1さん、ありがとうございます_(._.)_

 

ということで 

Before→Afterはこうなりました(*^_^*)

f:id:satomiman10:20171006115219p:plainf:id:satomiman10:20180518133918p:plain

いいところはそのままに

ちょっぴり大人な感じになりました( ̄▽ ̄)

 

これからも少しずつ勉強しながら改良していく予定です。

頑張ります(*´ω`*)

 

質問、感想、情報提供、お待ちしています‼‼‼ f:id:satomiman10:20170903114131p:plain

 

 

▼ こちらもぜひ!