賢く生きるブログのデザインを変更しました!手順が分からず、迷ったので、こちらに備忘録として書き留めておきます。参加になれば幸いです。シェアボタンを変更デザイン変更のポイント目次についてきっかけは、目次の利用。レスポンシブデザインでないと、せっかくPC画面で目次のデザインをしても、スマホ画面に反映されない...悲しい...ということで、ブログのテーマをレスポンシブデザインに変更しました!レスポンシブデザインとは、PC画面で設定したデザインが崩れずに、スマホに反映できるというものです。見出し(↓画像赤枠)と、その横にある記号(↓画像黄色枠)を使用します。“[:contents]”という文字が現れるので、これで作成完了です。テーマ設定を行うそれでは、ブログデザイン変更の手順を記載していきます。『テーマストアでテーマを探す』が出てくるので、そちらをクリック(↓画像赤枠)テーマストアで、『Haruni』を選び、プレビューしてインストールをクリック。すると、自分のブログのHaruniバージョンのプレビューが出てくるので、このテーマをインストールをクリックします。デモブログ:Haruni』から、デザインのカスタマイズ方法が確認できます。私は、そちらを参考にカスタマイズしていきました。スマホをPCデザインに合わせる手順1だけだと、スマホにデザインが設定されないので、デザイン画面のスマホ設定下にある、レスポンシブデザインをクリックします。これだけです!このままでも十分可愛いのですが、グローバルメニューと呼ばれる、ブログ内のリンクの一覧が欲しいので、その設定をします。先ほど紹介したデモサイトをご覧ください。管理画面から、設定→詳細設定の画面下の方にあります。これは、貼り付けるだけでオッケーです。デザイン設定画面の、ヘッダの『タイトル下』HTMLで、メニューバーに表示したい名前と、リンク先を変更します。自分で変更をする必要があります。私はグラデーションの色を変更しました。やり方は、下のデモサイトをご覧ください。好きな色のコードに変更すると、グラデーションも変わります。『body,』は消して記入しています。記事をシェアできるボタンです。デザイン画面ではソーシャルパーツと書かれています。記事下か記事上のHTMLを変えるだけ。yumekawa.hatenadiary.com以上です!うまくいきましたでしょうか?デザイン変更のポイントポイントは、プレビュー画面を鵜呑みにしないこと!です。実際と異なることがあります。直接ページを立ち上げて、PCとスマホ両方から確認した方が良いです。私の場合は、グローバルメニューのメニューバーが、PC版でもスマホと同じデザインで、プレビューされるため、どうやったらタイトル下に、メニューバーが作れるのかで悩んでいました。年間約200万円の貯金をしてきました...2019-04-18【ミニマリスト】収納方法見直しで、朝の支度が10分短縮!朝の10分って貴重ですよね。私のスマホデビューは2013年。はてなブログPro社会人4年目の都内在住OLです。@rismonologyはてなブログをはじめよう!rislifeさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。