· 

「スマホのナビゲーションが動かない」が解決した件

何を隠そうこのホームページの話。

 

まず反省点からお伝えしてみようと思いますが、日頃お客様目線でとか、スマホで導線チェックしましょうといいつつ、できていなかった。すみません。(大汗)

 何ができていなかったかというと...

スマホ画面でのナビゲーション「第2階層以下の➕マーク」をクリックしても展開しない、動かなくなっていた

 

▼2階層目イメージ
ここをタップしても展開しなかった。

すでに900ページを越えていると思われる当ホームページ。スマホチェックも新規ページか第1階層からしか辿ってませんでした。

 

アクセス数でいうとパソコンの閲覧者が多いので、気づいた人は少数派かなと思うのですが、もし、せっかく訪れてくれていたのに不自由を感じた人がいたらごめんなさい。

 

ということで解決した方法と今後の対策書いていきます。


この記事が役立ちそうな人

  • ジンドゥークリエイター利用者
  • ナビゲーションで、第2、第3階層まで設定している
  • スマホ画面でナビゲーションの動きがおかしい、動かない
  • Amazonのアフィリエイトをやっている

まず、なぜ動かないのか検証開始

原因探しはこんな感じ

 

1.他のジンドゥーサイトは大丈夫か、同じレイアウトのものは大丈夫か。

(問題なかった。ジンドゥー側の問題ではないことがわかる)

2.別途設定している動きがあるソースコードを疑う

 全ページエラーなので、全ページに該当している動きのあるソースコードを疑う。

 

 ヘッダー編集箇所、サイドバーエリア

 ここで判明。

 

原因:Amazonアソシエイトと思われる

サイドバーエリアでAmazon書籍の紹介リンク(Amazonアソシエイト)を貼っていたソースコードを削除したら解消されました。

 

つまりは、Amazonのアフェリエイトのソースコード。

おそらく(と一応言っておきますが)このコードがジンドゥーの何らかのソースに 干渉していて動作ができなかった模様。

 

アフェリエイトが使えないのは残念すぎましたが、サイドバーから削除して解決。

 

今後の対策:Amazon商品リンクを掲載したい場合は...

とはいえ、書籍など商品紹介をしたい人は多いと思うので、対策としてこの2つ。

 

1)アフィリエイトを使わず、書籍ページのリンクをはる。
Amazonアソシエイトのソースコードが原因でエラーになると思われるので、そのソースコードを使わなければ大丈夫。

え、アフィエイト使えないと意味ないじゃん!って方は、次へ。

 

2)エラーの影響のない箇所にソースコードを設定する

NG)サイドバーエリア

→ 全ページに影響を与えてしまうのでNG

 

NG)トップページ

→ 入口ページになるので避けたほうがいい

 

おすすめ)上記以外の階層が深くないページ

→ いわゆるそのページを表示した状態で、スマホで見た時、2階層目以下のナビゲーションを使う可能性が低いページ。

 

 

<雑記>

SNS系、アフィリエイト系のソースを削除してチェックを繰り返して、辿り着きました。

困っている誰かの役に立てますように。