今日は３つのカスタマイズについてお話しします。
スマホ用メニューバー「ボトムナビゲーション」
Bambiさんのグローバルナビゲーション設置の説明ページの下で発見したのです。
下です、下。
ほう、「スマホ用には別のメニューバーがあった方がいいらしい。」
ということで早速コピペ。HTMLコードを書き換えるのも、もう抵抗感なし。でも、自分のはてなIDやURL、自分のツイッターIDとか、いっつも
「どこだ？どこだ？」と騒いでしまいます。だめだなあ。
- PC表示の際はボトムメニューを表示しない
- ボトムメニューのためフッターを底上げする
- ボトムナビゲーションがiphoneXのホームバーに被る問題に対応
引用元：https://www.bambi.pro/entry/palette-customize-bottom-navigation
以上のポイントも全てコピペさせていただきました。
パソコン用とスマホ用にメニューバーを設置したからには、中身が必要。ちゃんとリンクが飛ぶか確認したかったので。
ということで、ここからしばらく中身のブログ編集に入りました。そこで設置したのが、目次。
目次と見出し
ずっとWord等で、書くことだけやってきたので、
「目次や見出しを作るのがこ〜んなに面倒なんて」と思いましたよ。
でもそれも慣れるまで。慣れれば「まあ、そんなもんか」となりました。
いつものようにBambi先生登場なのですが、
この「大見出し、中見出し、小見出し」っていう概念がわからなくて。
これを設定しないと目次が設置できない。見出しと目次が紐づいている、ということに気づくまで時間がかかりました（どこまでも初心者）。
色々書いてあるのですが、やったことは
- デザインを選ぶ
- そのCSSをコピペ
- 見出しの前の数字はいらないと思ったので、ご指示通りにdecimalをnoneに変更
目次開閉式にはしませんでした。
「おし！できた！」と好みの場所で、はてなブログの目次マーク
をクリック。見たまま編集で [:contents] と来るのですが、プレビューに移動しても、
「え〜！」あのカワイイ目次が来ない！
って、内容物作ってないから。
ということが分かるまでに、バカみたいに時間かかりました。
参考にさせていただいたのがこちら。
要するに、目次に書きたい文章を見出しに選ばないといけないということですね。
とーぜん！
そんなこと分からないなんて、これだから初心者は。
蛍光ペンマーク
こちらを参考にしました。
こちらの方法では、イタリックを選ぶと、太字に変化して蛍光ペンでアンダーライン引かれた状態に変わるように呪文設定されています。
これはすごく簡単で、すごくいい。
ここまでで今後挑戦したいこと
目次のアイコン
Bambiさんのデザイン「ステッチ風」を選んだんですね。
ビスケットみたいにかわいい。このまんまのCSSなんですが、星のアイコンが来てくれない。それにセンタリングもできていない。
でも支障ないし、グローバルナビゲーションのアイコンとも合っているから、これはこれでいいのかなとも思っています。
言ってることがやっぱり初心者。
他の色でのアンダーライン
今は蛍光色だけ。ピンクのアンダーラインをもう一本加えたいです。
「素人のブログ カスタマイズ⑤」に続く。
