医学生の春休み3 サイトのバグ修正

どうもretroidです。今日は珍しく暇じゃありませんでした。というのも。。。当サイトにバグを発見し、必死こいてデバッグしていたからです(笑)結局のところ解決しましたが、ホント疲れました。医学部の勉強とか学士編入とは関係ありませんが、備忘録程として書いておこうと思います。

何が起こったのか?

タブレット端末や携帯でこのサイトを表示する時、メニューバーがうまく機能しないというバグでした。

当サイト、PCで表示される画面とタブレット端末および携帯で表示される画面が若干違います。

↑PCだと、画面がよっぽど小さくない限り、こっちのメニューデザインで表示されると思います。

で、これがPC以外で開いた時の画面です。画面の矢印をクリックすると。。。

メニューがプルダウンします。

このように、見る画面の大きさにより構造が柔軟に変わるようなデザインをレスポンシブルWebデザインというそうです。

引用「レスポンシブWebデザイン」とは、PC、タブレット、スマートフォンなど、複数の異なる画面サイズをWebサイト表示の判断基準にし、ページのレイアウト・デザインを柔軟に調整することを指します。

「LIG inc」ホームページより引用

https://liginc.co.jp/designer/archives/6154

 

今回のバグは、メニューをプルダウンすると、すぐさま自動的にプルダウンする前の状態に戻ってしまうというものです。

何を試したか?

最初はCSSの書き換えが原因なのかなぁ?と思ってひたすらCSSのチェックを行っていました。このサイト、ベースはWordpress用に配布されているデザインです。僕はこのデザインのCSSをいじって使っています。

結構頻繁にプログラムを書き換え、調整しているのですが、この過程でバグが生じたのかと考えました。ただこれは原因ではありませんでした。

次に疑ったのはPHPのコードです。これも最近いじってました。

具体的には記事のタイトルと写真の位置を逆にしたくて修正しました。PHPの不具合がバグに繋がったのかと疑っておりました。しかしこれも原因じゃなかったんですね(汗)

ここまで約3時間。

何も予定が入ってなかったとはいえ、流石に精神的にきつかったです。

で、原因がわからないまま、半分やけになってプラグインを全部停止してみました。

今思えば最初これをやってくべきだったんですよね(;・∀・)だってCSSやPHPをいじるよりも簡単にできますから。

 

そしたらなんともあっさりと解決(笑)

 

当然全部のプラグインを止めた状態だとブログ運営が難しいので、プラグインを一つ一つ検証した結果。。。

Slim Stat Analytics

というまったくメニューバーとは関係ないプラグインが不具合を生じさせていることがわかりました。このプラグインは、サイトのアクセス解析に使っているプラグインでした。

メニューバーに関するプラグインは一つも入れてないので油断してました。

結論

導入したプラグインとは全く関係ないところに不具合がでる可能性もあるのだなぁということが今回学んだことです。

みなさんももし同様の不具合が起きたら、まずプラグインを疑ってみてはいかがでしょうか?僕は、次に不具合が起きたら真っ先に疑うようにします(笑)

医学部の学士編入とか勉強とか医学部とかとは全く関係のない記事になってしまいましたがお許しをm(_ _)mそれでは今日はこのへんで👋

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です