【賢威6.2でブログ作成】サイドバーが下に落ちた！

今回は私が遭遇したブログ運営の トラブルについてお話をします。
ブログの運営をしていると HTMLタグなどをいじる機会も多くなります。

このHTMLタグはほんのちょっとでも
ミスしてしまうとブログのレイアウトが崩れてしまいます。
私もブログのレイアウトが大幅に狂ってしまいとっても焦りました。

やっとこさ記事投稿やレイアウトの編集が終わり
一安心していたときのことです。
何気なく、自分のブログの記事を開いてみると・・・

ブログの左右にあるはずのサイドバーが
消えてなくなちゃってたんですね(°д°)！！

本来の正しい表示のされ方はこれなんです↓

＜通常のブログ記事表示＞

上のように左右にサイドバーを
表示させるようにしてたはずなんですね。

あ、ちなみに
サイドバーとは
ブログの左右に存在している別ページへ
の誘導させる案内ページのことです。

上のブログを例に見ると
画像の真ん中の「はじめに」って
書かれた部分はブログの記事になります。

「『はじめに』の続きを読む」と書かれた
青いリンクのボタンを押すと
記事の続きを読むことができます。

このブログの記事の左右にある
赤の四角で囲ったところが
サイドバーと呼ばれる部分になります。

アフィリエイトなどのネットビジネスで
ブログを運営している場合このように
左右または右半分のみ・左半分のみに
サイドバーを設置していることが多いです。

このサイドバーには

・ブログ運営者のプロフィール

・情報商材のレビュー記事

など自分が更新しているブログ記事以外にも
見て欲しいページにブログを見に来た人を
案内させるために設置しています＾＾

しかし、実際に更新したワードプレスの記事を見てみると
左右のサイドバーが表示されなくなっていました(^_^;)

「あれ？どこいったんだろ？？」

と思いブログを下にスクロールしていくと・・・

＜ブログ左側サイドバー＞

＜ブログ右側サイドバー＞

ブログの下の方へずり落ちていました・・・
ブログのレイアウトが崩れてしまい
とても不格好なことになっていました。

いやいや‥・とっても焦りましたよ(´Д｀;)
やっとの思いで作ったのに・・・

ひとまず、いろいろネットで検索して
このようになった原因を調べてみました。

【賢威 サイドバーが落ちた】とか

【ワードプレス サイドバー 表示 トラブル】とか

なかなか出てこなくて時間がかかりましたね。

検索しても解決方法が出てこなくて(>_<)
そこで、私はサポートページに聞いてみようかなと思い
使っているワードプレス専用の
テンプレートのサポートページに行ったんですね。

ワードプレスにはいろいろなテンプレートがあって
私は賢威と呼ばれるテンプレートを使っています。
この賢威は疑問やトラブルを解決できるサポートページも
あるのでそこなら何か解決の糸口が見つかるかも知れないと思いました。

するとばっちり見つかりました！！

なんとHTMLのタグ編集でミスをしたせいだったんです！

問題のタグ編集のミスはこれです↓

赤い四角の中で囲っている部分、＜/div＞ダグが
2個続いているのがわかりますでしょうか？

これが原因だったんです。

＜/div＞タグが余分に１つ多く重複していることが原因で
サイドバーが下に落っこちてレイアウト崩れを起こしていたようでした。

ちょうど、ブログの記事更新で
どうしてもタグ編集が必要になり
タグをいじったり訂正したりしてたんですが
その際に１つ＜/div＞タグを消し忘れたままだったようです(^_^;)

サポートページ内では私と同じような
トラブルでお悩みの方が何人かいまして

解決策のところに

『閉じタグが多いことが原因。
記事本文内のタグで「＜/div＞」が一つ多い状態になっているので、
変更した「single.php」の記述を再度確認しましょう』

とあったので確認してみるとばっちりありました。

＜/div＞タグを１つ消した状態がこちら↓

２つあった＜/div＞タグを一つにして保存。
すると、ちゃんとブログ記事内で
サイドバーが表示されるようになりました。

原因がわかるまで1時間以上も
ネットであれこれ調べてました（笑）
さっさとサポートページ見ようよって話なんですが(；・∀・)

ブログを運営していると
レイアウトのこだわりとか出てきて
タグをいじることも出てくると思います。

そうした時にいざ保存してみてみると
レイアウトが変になっている！なんてことも
けっこう起きることなのでちょっと覚えておくと参考になるかもしれません。

今日はこの辺で。

最後まで読んでいただきありがとうございますm(_ _)m

ご感想やご相談があればいつでも私にご連絡くださいね。

＞＞お問い合わせはこちら