Cocoonフォーラム

サイト内検索
書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL:

相談内容:

不具合の発生手順:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法
  7. ブラウザ環境チェックツール
  8. Cocoonカスタマイズ依頼

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

スマホ(Android Chrome)...
 
共有:
通知
すべてクリア

スマホ(Android Chrome)で別ページへのアンカーリンクが飛ばない

11 投稿
3 ユーザー
2 Reactions
26 表示
(@dongurie)
Active Member Registered
結合: 2年前
投稿: 14
Topic starter  

いつもお世話になっております。
Cocoon子テーマを使わせていただいております。

●不具合・カスタマイズ対象ページのURL: https://sweetcocoro.com/my-baystars-2024/

相談内容:複数ページに分けられている上記のページにて、AndroidのChromeで別ページへのアンカーリンクをタップした時に、別ページのトップには飛ぶけれど正しい場所にジャンプしません。
いつまでかはわかりませんが、以前は正しくジャンプしていたように記憶しています。

●不具合の発生手順:
(例)
1. AndroidのChromeで上記ページの
  ・選手の誕生日一覧 ←リニューアルしました
 をタップ 
2. https://sweetcocoro.com/my-baystars-2024/4/#PLAYER_BIRTHDAY が読み込まれる
3. https://sweetcocoro.com/my-baystars-2024/4/ のトップが表示されてしまう

●解決のために試したこと:

・全てのプラグインを無効化しても現象は同じでした。
・Cocoon子テーマでも親テーマでも現象は同じでした。
・他テーマ(Twenty Twenty-Three)では正しい位置にジャンプします。
・Chromeのキャッシュ削除をしても現象は同じでした。
・PCのChrome、iPadのSafariでは正しい位置にジャンプします。他の環境は持っていません。
https://sweetcocoro.com/my-baystars-2024/4/#PLAYER_BIRTHDAY をアドレスバーに入力しても現象は同じでした。
https://sweetcocoro.com/my-baystars-2024/4/ のページ内アンカーリンク(目次など)は正しい位置にジャンプします。
・高速化は無効にしてあります。

なにか設定すべき場所があるでしょうか。
どうぞよろしくお願いいたします。

環境情報:

----------------------------------------------
サイト名:ひとりじゃないよ
サイトURL: https://sweetcocoro.com 
ホームURL: https://sweetcocoro.com 
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon-master
スタイルシートURL:/wp-content/themes/cocoon-child-master
親テーマスタイル:/wp-content/themes/cocoon-master/style.css
子テーマスタイル:/wp-content/themes/cocoon-child-master/style.css
スキン:/wp-content/themes/cocoon-master/skins/skin-tegakinote-blue-coral/style.css
WordPressバージョン:6.6.2
PHPバージョン:8.1.27
ブラウザ:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/128.0.0.0 Safari/537.36
サーバーソフト:Apache
サーバープロトコル:HTTP/1.0
エンコーディング:none
言語:ja-JP,ja;q=0.9,en-US;q=0.8,en;q=0.7,th;q=0.6,id;q=0.5
----------------------------------------------
テーマ名:Cocoon
バージョン:2.7.7.3
カテゴリー数:31
タグ数:248
ユーザー数:2
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.3
style.cssサイズ:845 バイト
functions.phpサイズ:203 バイト
----------------------------------------------
Gutenberg:1
Font Awesome:4
Auto Post Thumbnail:1
Retina:0
ホームイメージ:/wp-content/uploads/2023/01/20230130_213854.jpg
----------------------------------------------
ブラウザキャッシュ有効化:0
HTML縮小化:0
CSS縮小化:0
JavaScript縮小化:0
Lazy Load:0
----------------------------------------------
利用中のプラグイン:
Ad Invalid Click Protector 1.3.0
Advanced Ads 1.54.1
Advanced Ads – Google AdSense In-feed Placement 1.1.3
Advanced Editor Tools 5.9.2
Akismet Anti-spam: Spam Protection 5.3.3
BackWPup 4.1.4
Broken Link Checker 2.4.0
ConoHa WING コントロールパネルプラグイン 1.2
ConoHa WING 自動キャッシュクリア 1.0.0
EWWW Image Optimizer 7.9.0
Jetpack 13.8.1
Jetpack Boost 3.4.9
Jetpack Protect 3.0.2
Pochipp 1.15.0
SiteGuard WP Plugin 1.7.8
W3 Total Cache 2.7.5
WebSub (FKA. PubSubHubbub) 3.2.1
WP Multibyte Patch 2.9
WP ULike 4.7.4
XML Sitemap Generator for Google 4.1.21
----------------------------------------------

   
引用
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 4年前
投稿: 7582
 

必ずしも、飛ばない訳ではなさそうです。

以下は、Android実機で確認したものです。

3回試して、3回目にはジャンプしています。

(元GIFが24.5MBだったもので、かなり圧縮しましたので、画質はとても粗いです)

 
1・2回目と、3回目の違いは、自動広告が入るか入らないかです。
(PC用広告ウィジェットの下に入るみたいです)
 
 
ちなみに、PCのデベロッパーツールで、スマホの表示にすると、同じく自動広告が入り込んで、アンカーリンクまで飛ばないです。
 
残念ながら、デベロッパーツールのスマホ表示で、自動広告が入らない状態にはなってくれないため、この自動広告が原因と、言い切れないところがあります。
 
通常のPC表示だと、この位置に自動広告が入らないため、これまた確認・検証ができない状態です。
PC表示では、自動広告が入らないために、アンカーリンクへ飛ぶのかなという気はしているのですが。

   
わいひら reacted
返信引用
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 16961
 

僕のAndroidエミュレーター環境だと添付画像の場所にジャンプしているようです。
ただ1回目に「ページ移動すると出るAdSense広告」出た際は、ジャンプしなかったように思います。
一度広告をオフにしてみるとどうなりますでしょうか。


   
返信引用
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 16961
 

mk2さんと書き込みがかぶってしまいました…。


   
mk2 reacted
返信引用
(@dongurie)
Active Member Registered
結合: 2年前
投稿: 14
Topic starter  

mk2さん、わいひらさん、返信ありがとうございます。
自動広告をオフにしたところ、バッチリアンカーリンクにジャンプしました!

自動広告が原因とすると、自動広告をオフにするしか対処法がないのでしょうか・・・


   
返信引用
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 4年前
投稿: 7582
 

dongurieさん

投稿者:: @dongurie

自動広告をオフにするしか対処法がないのでしょうか・・・

オフではなく、「除外エリア」を設定すれば良さそうに思いますけれど。
(AdSense側の設定です。他の自動広告を使いたい場合ですけれど)

使ったことがないもので、そこまで細かく設定できるのかは分かりませんけれど。

ページの特定のエリアをページ内自動広告の表示から除外する
https://support.google.com/adsense/answer/12626543?hl=ja

This post was modified 7時間前 4回 by mk2

   
返信引用
(@dongurie)
Active Member Registered
結合: 2年前
投稿: 14
Topic starter  

mk2さん

投稿者:: @mk2_mk2

オフではなく、「除外エリア」を設定すれば良さそうに思いますけれど。
(AdSense側の設定です。他の自動広告を使いたい場合ですけれど)

使ったことがないもので、そこまで細かく設定できるのかは分かりませんけれど。

ページの特定のエリアをページ内自動広告の表示から除外する
https://support.google.com/adsense/answer/12626543?hl=ja

確かにその通りですね。
ありがとうございます!ひとまずGoogle AdSense の設定をいじることとします。

ただ1点だけ気になるのは、他のテーマ(Twenty Twenty-Three)の時はこの現象が全く起きないことです。
これはスムーススクロールの宿命なのでしょうか?


   
返信引用
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 4年前
投稿: 7582
 

dongurieさん

投稿者:: @dongurie

ただ1点だけ気になるのは、他のテーマ(Twenty Twenty-Three)の時はこの現象が全く起きないことです。
これはスムーススクロールの宿命なのでしょうか?

「Twenty Twenty-Three」で以下のものを書くとどうなるのでしょう?

https://github.com/xserver-inc/cocoon/blob/fba01d625dc3eaf03a0bc5f04181b038aea82856/style.css#L539-L541

只今スマホからなもので、上記の範囲選択がうまくできていないかもしれません。

 

This post was modified 6時間前 2回 by mk2

   
返信引用
(@dongurie)
Active Member Registered
結合: 2年前
投稿: 14
Topic starter  

mk2さん

投稿者:: @mk2_mk2

「Twenty Twenty-Three」で以下のものを書くとどうなるのでしょう?

https://github.com/xserver-inc/cocoon/blob/fba01d625dc3eaf03a0bc5f04181b038aea82856/style.css#L539-L541

Twenty Twenty-ThreeはCSSファイルを使っていないのか?
設定がうまくいかなかったので(能力不足ですみません)

AstraやOceanWPなどスムーススクロールしているテーマをいくつかインストールしてみました。
全てスマホで自動広告が出た後にも別ページのアンカーリンクにジャンプしました。
※ただAstraはJSファイルでスムーススクロール設定してるっぽいです。

もう少し切り分けて考えてみます。


   
返信引用
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 4年前
投稿: 7582
 

dongurieさん

とりあえず「追加CSS」に書いてみてはと思うのですけれど。

ブロックテーマは、何か勝手が違いますね。

 
「外観」-「エディター」-「スタイル」-「縦三点リーダー」に、追加CSSはあるみたいです。
 
上の画像の場所に記載すると、グローバルスタイルという場所に保存されました。
(global-styles-inline-cssに出てくるみたいです)
This post was modified 4時間前 2回 by mk2

   
返信引用
(@dongurie)
Active Member Registered
結合: 2年前
投稿: 14
Topic starter  

mk2さん

投稿者:: @mk2_mk2

「外観」-「エディター」-「スタイル」-「縦三点リーダー」に、追加CSSはあるみたいです。

ありがとうございます!
Twenty Twenty-Threeに追加CSSでスムーススクロール指定を書いたところ、Cocoonと同じように別ページのアンカーリンクにジャンプしなくなりました。
やはりスムーススクロール+Google AdSenseの自動広告がダメみたいですね。

Google AdSenseをなんとか活かしたく /themes/Cocoon-master 直下の style.css の scroll-behavior を削除してみたのですが、PCのサイトはスムースでなくなったもののスマホのサイトは相変わらずスムーススクロールしてしまいます。

スマホ専用の設定が探してもよくわからなくて・・・場所をご教授いただければと思います。
どうぞよろしくお願いいたします。
今夜はもう遅いので明日また来ますね。おやすみなさいませ

※現在トピック冒頭に記載したURLのページは自動広告をオフにしてあり、以下のテストページで動作確認しています↓↓
https://sweetcocoro.com/test_anchor/

This post was modified 3時間前 3回 by dongurie

   
返信引用
共有:

問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。

また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。

タイトルとURLをコピーしました