こんにちは、ハーマイお兄です。
先日、新しいブログテーマ「Silence」を導入しようとしたものの、ナビゲーションバーで子カテゴリーが設定できずに1日かけて色々と検証していました。
これについては作者様から直々にコメントを頂き、事なきを得たのですが、
今度はその検証している間に、いつの間にかエントリーページのサイドバーが下に表示されるようになってしまいました。
今回は、そのサイドバーが下になっている状態を横に戻す方法を検討していきたいと思います。
サイドバーが下に表示されてしまう
このメインブログにおいて、サイドバーが下に表示されるようになってしまいました。
使用しているはてなブログテーマは「zeno-teal」です。
写真のように、エントリーページだけサイドバーの部分が余白の状態になってしまいます。
どこに行ったかと思えば、スクロールをしていくと下に表示されていました。
サイドバーが下に表示されてしまう原因を特定する
一刻も早く、サイドバーが何故下に表示されてしまうのか原因を特定します。
特定方法は、色々あるかと思いますが、私はずっと至って原始的です。
（というよりプログラミングをしている人からすれば常識？）
それは、増やしてしまったコードを元に戻していくことです。
デバッグともいうべきでしょうか。
教えて！Gooにも、似たような質問があり、回答者からはこのように記載されていました。
普通、直前にやった事に原因がある場合がほとんど。 「関係ない」ではなく「関係あるかも」で考えれば、解決の糸口が見えてくるものです。 とりあえず、その追加した部分をコメントアウトしてみてはどうでしょう？ それで現象が治まれば、原因は「そこ」にあるという事ですよ。
引用：https://oshiete.goo.ne.jp/qa/8745224.html
ごもっとも。
それでは、さっそく探してみましょう。
コードを削って消去法を実施
まずは、消去法で大枠を消してヘッダー、フッター、デザインCSSなど、どの部分でトラブルが起きているのかを大まかに把握します。
一番怪しいと思っていたのが「デザインCSS」だったのですが、まさかの全消ししても下のサイドバーが元に戻りませんでした。
あれだけ書き込んでいるのに、デザインCSSじゃないと…。
そして、探し続けて数十分ほど経って、ようやく見つかりました。
犯人は「記事」の中にある「記事下」枠にあるコードでした。
記事下枠から一つずつ探そうとしていたところ、何やら珍しいマークがついていました。
↑↑の「×」マークです。
絶対これやん…笑
そこに記載されているコードを読んでみると、何故か囲われていない</div>タグが存在していました。
このdivタグを消してみると…
「×」マークも消え、サイドバーが表示されました！良かった～
まとめ
サイドバーが下に表示されてしまうと、プロフィールから伝えたい事まで全て記事を読んでからになってしまい、初めて来た人には不安にさせてしまうと思います。
私はサイドバーがあった方がとても落ち着きます。
今回は単純な誤記が原因だったようなので、無知を晒してしまい少々お恥ずかしいですが、まあ直って良かったです！
最後までお読みいただき、ありがとうございました。
