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カスタマイズ依頼

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

ツイートを埋め込んだ投稿記事が、iPh...
 
共有:
通知
すべてクリア

[解決済] ツイートを埋め込んだ投稿記事が、iPhoneでまともに表示されない。

28 投稿
4 ユーザー
12 Likes
387 表示
Tusk
 Tusk
(@tusk)
Active Member Registered
結合: 5か月前
投稿: 9
Topic starter  

初めまして。
私はWordpress初心者で、現在少しずつサイトを作成しています。

しかし、Twitterのツイートを埋め込んだ投稿記事が、iPhoneでまともに表示されずに悩んでおります。

記事のツイートを埋めなおしてみたり、プラグインを全てOFFにしてみたり、iPhoneの設定を色々試してキャッシュの削除や再起動も試しましたが、どうにも解決できません。

当該ページのURLはコチラです: https://media-faust-create.jpn.org/?p=149
しかし、このページだけでなく、ツイートを埋め込んだ投稿記事すべてが同様の現象です。

なお、ツイートはビジュアルエディタのTwitterブロックにURLを入力する形で埋め込んでいます。
PCでは問題なく表示され、Androidは持っていないため、試す事ができていません。

また、iPhoneでのブラウザも4種類試したのですが、

・safari:記事の途中からぶっつり消え、ホームボタンなども効かなくなる。
・chrome:safariと同様。
・FireFox:記事は表示されるが、埋め込みツイートが引用になる。
・Opera:何故かoperaだけは普通に表示される。

……といった挙動になりました。

何が原因なのか、何が間違っているのか皆目見当がつかないので、どうかご助言を頂けませんでしょうか。


   
トピックタグ
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 2年前
投稿: 4413
 

Tuskさん

「Android + Chrome」では表示されます。

 
WindowsもChrome・Firefoxとも表示されていました。
 
 
添付いただいた、「iPhone + Firefox」の画像を拝見すると、JavaScriptが実行されていない?という印象は持ちますが、何分再現できる環境がなく、分からないところです。

   
わいひら reacted
わいひら
(@yhira)
Illustrious Member Admin
結合: 5年前
投稿: 14137
 

Firefoxで確認してみたのですが、コンソールに特にエラーも出ていないようですね。
当サイトのTwitter埋め込みも表示されていないでしょうか?
https://wp-cocoon.com/cocoon-custom/


   
Tusk
 Tusk
(@tusk)
Active Member Registered
結合: 5か月前
投稿: 9
Topic starter  

@mk2_mk2 

ご返信、並びにAndroidでのご確認をありがとうございます!

そうですかぁ、iPhoneだとChromeでも記事が途切れてしまうんですよね…。

母もiPhoneなので試したところ、やはり自分のiPhoneと同じ状況でした。

以前は普通に表示されていたので、本当にわからない(・・;)


   
Tusk
 Tusk
(@tusk)
Active Member Registered
結合: 5か月前
投稿: 9
Topic starter  

@yhira 

ご返信、ありがとうございます!

いえ、頂いたリンク先の埋め込みツイートは全く問題なく表示されております。

特に変わった事はやっていないつもりなのですが、やはり自分のサイトに何かしら問題がある様ですね…。

念のため、iPhoneのキャッシュをもう一度クリアして、再起動してみます。


   
わいひら
(@yhira)
Illustrious Member Admin
結合: 5年前
投稿: 14137
 
投稿者:: @tusk

いえ、頂いたリンク先の埋め込みツイートは全く問題なく表示されております。

だとしたらプラグインと何かしらのバッティングがあるのかもしれません。テーマ側の問題であれば、当サイトでも不具合が出るように思います。
iPhoneで動作確認しながらプラグインを一つ一つ無効にしていき問題が解決されるか確認してみるのも良いのかもしれません。
※プラグイン以外が原因の可能性もあるので、必ずしもプラグインが原因とは限りません。


   
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 2年前
投稿: 4413
 

Tuskさん

根拠も何もないのですが・・・。

目次を無効化(非表示)にして、iPhoneでアクセスしてみると、変わりますでしょうか。


   
Tusk
 Tusk
(@tusk)
Active Member Registered
結合: 5か月前
投稿: 9
Topic starter  

@yhira 

ご助言ありがとうございます!
プラグインは全てOFFにして確認してみたのですが、どうにも変わらずです。
やはり、ツイートを消してしまえば表示されるので、やはり埋め込みツイートの部分に何かしら問題があるのかもしれません。

ただ、ザックリ確認しただけですので、iPhoneの設定とキャッシュのクリアなどを行って確認するなど、もう少し詰めてみます。


   
Tusk
 Tusk
(@tusk)
Active Member Registered
結合: 5か月前
投稿: 9
Topic starter  

@mk2_mk2 
ご助言ありがとうございます!
そうなんですよね、目次の部分から記事がぶっつり切れてしまうので、僕もそれが気になったんですよ(;'∀')
今一度やってみたのですが、やはり変わらずでした。
ウィジェットに広告を入れているので、これを外してみたのですが、それでも変わらずです(´;ω;`)ウゥゥ


   
わいひら
(@yhira)
Illustrious Member Admin
結合: 5年前
投稿: 14137
 
投稿者:: @tusk

なお、ツイートはビジュアルエディタのTwitterブロックにURLを入力する形で埋め込んでいます。

URL埋め込み(embed)とのことなので、編集のエディター画面では正常に埋め込み表示されているのでしょうか。


   
Tusk
 Tusk
(@tusk)
Active Member Registered
結合: 5か月前
投稿: 9
Topic starter  

@yhira 

お世話になります。

記事の編集画面では、埋め込みツイートは正常に表示されます。
しかし、間違えてセンシティブな表現ありでツイートしているため、その表記が出た状態で表示されます。
もしかすると、これが一因でもありそうでしょうか?

試しにツイートからembed、コピーコードで埋め込んでみましたが、同じ状況でした。


   
わいひら
(@yhira)
Illustrious Member Admin
結合: 5年前
投稿: 14137
 

その編集画面をiPhoneで見るとどうなりますか?

This post was modified 5か月前 by わいひら

   
chu-ya
(@chu-ya)
Noble Member Registered
結合: 7か月前
投稿: 623
 

@yhira さん

●現象
類似の現象が以下のフォーラムにあげられ。
https://wp-cocoon.com/community/postid/63181/

●環境
iPhone+Safari

●確認結果
センシティブがあるツイートを投稿に埋め込んだ場合、ページが固まり。
そのページを放置していると「○○○(該当URL)問題が繰り返し起きました」が表示される。
上記、フォーラムで、問題のツイートを削除したら、直ったとの事。

 

   
わいひら reacted
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 2年前
投稿: 4413
 

Safariの仕様っぽいですね。

ふと思うのですが、埋め込みコードを貼り付けて、「data-cards="hidden"」を指定した場合も表示されないのでしょうか。
(そこまでして貼りつけるかどうかという話はあるかもしれないですが。)


   
わいひら reacted
chu-ya
(@chu-ya)
Noble Member Registered
結合: 7か月前
投稿: 623
 

●補足
他テーマ「Twenty Seventeen」に変えても同じ現象が発生しました。


   
わいひら reacted
わいひら
(@yhira)
Illustrious Member Admin
結合: 5年前
投稿: 14137
 
投稿者:: @chu-ya

●補足
他テーマ「Twenty Seventeen」に変えても同じ現象が発生しました。

もしかしたらTwitter側の問題なのかもですね ? 


   
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 2年前
投稿: 4413
 

少なくとも、以下では起きないんですよねぇ。

Windows + Chrome
Windows + Firefox
Android + Chrome

謎です。

Twitterで見る限り、他のテーマでもおきているみたいです。
(私が見たのはaffinger、と言ってもiPhoneで見た訳ではないのですけど)

埋め込みコードで「data-cards="hidden"」を試す方をお待ちします。


   
わいひら reacted
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 2年前
投稿: 4413
 

Twitterが原因っぽいです。

以下のサイトがご参考です。
(と言っても、今のところ対処はできません。)

【悲報】センシティブなツイートでブログがクラッシュするかも!
https://www.heavy-peat.com/2022/07/sensitive-tweets.html

 

上記には以下のようにあります。

JavaScript:embed.modules.cfee4b331d0f780ab748.jsが暴走していました。

そう言えば、今日立った別トピックの件で、「Windows + Chrome」でデベロッパーツールで確認したところ、エラー件数が、スロットマシンみたいに回って、どんどんカウントアップされていく事象が発生しました。
(じっと待っていたら、数千という感じでした。)

でも、ページ自体は表示されていたんですけれど。

上記と同じ事象だったと思います。

何だろうと思って、リロードしたら、エラーが発生しなくなってしまったんですよね?


   
わいひら reacted
chu-ya
(@chu-ya)
Noble Member Registered
結合: 7か月前
投稿: 623
 

@yhira さん

以下に同じ問題が書かれています。
このページの参考フォーラムにも同様な書き込みが。

https://tt2019.org/post-815/


   
わいひら reacted
Tusk
 Tusk
(@tusk)
Active Member Registered
結合: 5か月前
投稿: 9
Topic starter  

@yhira 

仕事柄、ご返信のレスポンスが悪くて申し訳ありません。

iPhoneから編集画面にいっても、編集画面上で同様の現象でした。

……なるほど、センシティブなツイートが原因なんですね(;'∀')

お手数をおかけしました。

これは動画を埋め込む形に変えていこうかと思います。

原因が分かってすごくすっきりしました。


   
わいひら reacted
Tusk
 Tusk
(@tusk)
Active Member Registered
結合: 5か月前
投稿: 9
Topic starter  

@chu-ya 
ものすごく有益な情報をご提示いただき、本当にありがとうございます!
調べまくっていたんですが、その情報へ辿り着くことができませんでした……
いやはや、本当にフォーラムに書き込ませて頂いて良かったです。

Twitter側の問題となると、これはもう別の形にしていくしかないですね(;'∀')
以前、少し過激なイラストをツイートしたことがあり、その時にセンシティブありにしてしまっていたので、センシティブのツイートばかりになっているんですよ。
やらかしましたー(´;ω;`)


   
わいひら reacted
Tusk
 Tusk
(@tusk)
Active Member Registered
結合: 5か月前
投稿: 9
Topic starter  

@mk2_mk2 

数々のご助言、本当にありがとうございます。

うひゃー・・

僕も試してみましたが、エライ事になっとりますw

なるほど、エラーでクラッシュしてたんすか。

こりゃいかん……早いところ、差し替えないと(;'∀')


   
わいひら reacted
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 2年前
投稿: 4413
 

Tuskさん

申し訳ないのですが、試していただきたいことがあるですが、ご協力いただけないでしょうか。
ダメ元ですけれど。


   
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 2年前
投稿: 4413
 

ご協力いただけるかは分かりませんが、その方法を書きますね。

表示されないTweetの埋め込みですが、Tweetの右上の三点リーダーから、埋め込みコードを取得して、貼り付けていただきたいのです。
(ブロックエディタであれば、カスタムHTMLブロックを使用、クラシックエディタであれば「テスキト」モードで貼りつけ)

 
 
埋め込みコードの先頭が以下のようになっているかと思います。
<blockquote class="twitter-tweet">
 
上記の部分を以下に変更していただきたいのです。
<blockquote class="twitter-tweet" data-cards="hidden">
 
それで、「iPhone+Safari」で閲覧できるものか、確認していただけますと、幸いです。

メディアは表示されないと思いますが、ツイート自体が表示できればなぁ・・・と思うのですが。

 
 

   
わいひら reacted
わいひら
(@yhira)
Illustrious Member Admin
結合: 5年前
投稿: 14137
 

こちらを見る限りでは対応されたっぽい?

Safari freezes on showing an embedded tweet
https://twittercommunity.com/t/safari-freezes-on-showing-an-embedded-tweet/173687


   
chu-ya
(@chu-ya)
Noble Member Registered
結合: 7か月前
投稿: 623
 

●確認結果
上記の該当ページ、iPhone+Safariで表示させ。
フリーズする事なく表示されました。


   
わいひら reacted
わいひら
(@yhira)
Illustrious Member Admin
結合: 5年前
投稿: 14137
 

@chu-ya さん

改善されたんですね!
ご確認いただきありがとうございます!

This post was modified 5か月前 by わいひら

   
chu-ya
(@chu-ya)
Noble Member Registered
結合: 7か月前
投稿: 623
 

@tusk さん

恐れ入ります、本件クローズの場合、「解決済み」ボタンのクリックを願います。


   
共有:

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

wpForoの解決済みリンク

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

wpForoのいいねリンク

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

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

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

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

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

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