サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2020年7月19日 14:35
cocoon設定画面で、編集のGutenbergを有効にすると、編集時に画面がiPhoneの横幅からはみ出してしまうので、ブロックエディターの操作ボタンが押せなくなってしまいます。
再度cocoon設定でGutenbergを無効化すると編集画面がハミ出すことがなくなります。
Macでは問題ないのですが、iPhone11Proのブラウザで作業することが困難です。
iPhoneのブラウザはSafariでもChromeでも同じ状況です。
https://cocoon.momo-express.com/
高速化オプションをオフにしてあります。
2020年7月19日 18:57
ブロックエディターは管理画面のことなので、URLだけではちょっと何とも言えません。
現在の状態のスクリーンショットをいただけますでしょうか。
2020年7月19日 19:52
@yhiraさま
なるほど気が付きませんでした。
iPhoneのスクリーンショット添付します。
2020年7月19日 19:57
この写真の説明ですが、プレビュー画面も右側は隠れているのですが、ここはスクロールすれば見ることは出来ます。
しかし、ブロックエディターのツールバーもはみ出している時には、操作が出来ない事もあります。
例えば、ブロックの上に、ブロックを追加などはツールバー右端のボタンだと思いますが、その操作をしようとしても上手く動かせなくなります。
この問題が今頃になって出るとは思えないので、私だけの環境で出ているのかも知れませんが、一応ご報告でした。
2020年7月20日 06:43
更に補足です。
iPhoneの画面のピンチ操作で、拡大された？ブロックエディター画面を小さくしようとしても、うまく出来ない状態です。
なぜか？ブロックエディターにすると、画面が拡大されて使い難い状態です。
Lightningテーマに切り替えると問題は無いので、テーマに起因する何か？と思いました。
2020年7月20日 19:36
ChromeやFirefoxエミュレーターでは、問題がないようなんですが、添付画像の「＋」ボタンとかが押せないということですか？
2020年7月21日 08:38
@yhiraさん
わいひらさんの画面を拝見すると、画面が拡大されておらず、キチンと画面横幅の中にエディター画面の全体が入ってますね。
私の環境では、そもそもが、画面が拡大されているような感じで、はみ出してますので、最初の段階から違うようです。
それは脇に置いて、脇に置いて良いのか、そこが問題の原点なような？(笑)
問題となる操作上の問題に話を絞るとその通りです。プラスボタンが見えないです。
私の環境では、そのプラスボタンは画面から右側にはみ出していて、押せない状態になってます。
ただ、右に画面をスクロールして押すことが可能です。
ところが、何かの表紙にそれが難しい（スクロールしてもバネのように戻る）ことがあります。
バネのようにスクロールしても戻る現象だけではなく、逆にはみ出さないように縮小する事が不可能です。
その場合次の手としてiPhoneを横向きにするのですが、そうすると縦画面が小さくなるので、キーボード表示の高さが邪魔してコンテンツのどこを触っているか見えなくなります。
キーボードを閉じたら見えるのですが、編集時はキーボードが再度出てくるので、何も出来なくなるのです。
ここまで書いてからなんですが、そもそもわいひらさんのエディター画面では、横幅がプラスボタンまで正常に
表示されているので、このサイズ感が出てない私のエディター画面がおかしいですね。
表示させている画像のサイズなどが大きいのか？など実験をしてみます。
2020年7月21日 08:50
わいひら様へ
コンテンツの問題だったようです。
解決したので、ご報告します。
コンテンツ上部にCボックスメニューを表示していたのですが、このCボックスメニューを削除したところ
iPhoneでブロックエディターを起動しても拡大表示になることが無くなりました。
Cボックスメニューをコンテンツ上部に入れると、ブロックエディターで何故か拡大表示（見た目は30％くらい大きい）されてしまうようです。
今は実験サイトなので、Cボックスメニューのウイジェットは削除して進めたいと思います。
このウイジェットを追加した瞬間に気がつけば話が早かったのですが、おそらくMac作業でここを追加したから
気がつくのが遅くなって、たまたま外出先でiPhoneで作業時に気がついて、何がきっかけはわからなくなってました。
Cボックスメニューを使う場所によってはiPhoneでの作業が困難になると言うのは出来れば治ると嬉しいのですが、実験中サイトなので削除で済んだので、可能であればご確認ください。
ちなみに私の場合はCボックスメニューを4つ並べて使った場合の問題です。
そのメニューをサイドバーに入れた写真ですが添付します。
これをコンテンツ上部に入れたのは、以前に要望した企業サイトっぽく連絡先を目立たせたいと言う意図でした。
CTAブロックで代用したかったのですが、CTAブロックはスマホで電話番号表示が折り返さない程度のフォントにすると、Macでは電話番号が小さくなってしまって視認性が落ちると思って試行錯誤中です。
2020年7月21日 19:24
「[C] ボックスメニュー」はどのようにブロックエディターに入れているのでしょうか。
現在のブロックには、ボックスへメニューはないようです。
WordPress5.4以前のバージョンの時入れたとかでしょうか。
2020年7月23日 11:20
@yhiraさん、見落としてたので遅くなりました。
まず1件目です。
---------------------------------------------- サイト名：仙台軽運送(株)ももちゃん便(赤帽から法人化) サイトURL： https://cocoon.momo-express.com ホームURL： https://cocoon.momo-express.com コンテンツURL：/wp-content インクルードURL：/wp-includes/ テンプレートURL：/wp-content/themes/cocoon-master スタイルシートURL：/wp-content/themes/cocoon-master 親テーマスタイル：/wp-content/themes/cocoon-master/style.css WordPressバージョン：5.4.2 PHPバージョン：7.4.4 ブラウザ：Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.89 Safari/537.36 サーバーソフト：Apache サーバープロトコル：HTTP/1.1 言語：ja,en-US;q=0.9,en;q=0.8 ---------------------------------------------- テーマ名：Cocoon バージョン：2.2.0.5 カテゴリ数：14 タグ数：29 ユーザー数：2 ---------------------------------------------- Gutenberg：1 AMP：1 PWA：0 Font Awesome：5 Auto Post Thumbnail：0 Retina：1 ホームイメージ：/wp-content/themes/cocoon-master/screenshot.jpg ---------------------------------------------- ブラウザキャッシュ有効化：0 HTML縮小化：0 CSS縮小化：0 JavaScript縮小化：0 Lazy Load：0 WEBフォントLazy Load：0 ---------------------------------------------- 利用中のプラグイン： Akismet Anti-Spam 4.1.6 All-in-One WP Migration 7.25 All-in-One WP Migration Unlimited Extension 2.37 Broken Link Checker 1.11.13 Contact Form 7 5.2 Customizer Export/Import 0.9.1 Optimize Database after Deleting Revisions 4.9.1 Regenerate Thumbnails 3.1.3 TablePress 1.11 TypeSquare Webfonts for エックスサーバー 1.2.1 Widget Importer & Exporter 1.6 WordPress Importer 0.7 WP Multibyte Patch 2.8.5 ----------------------------------------------
二件目です
----------------------------------------------
サイト名：仙台軽運送(株)ももちゃん便(赤帽から法人化)
サイトURL： https://cocoon.momo-express.com
ホームURL： https://cocoon.momo-express.com
コンテンツURL：/wp-content
インクルードURL：/wp-includes/
テンプレートURL：/wp-content/themes/cocoon-master
スタイルシートURL：/wp-content/themes/cocoon-master
親テーマスタイル：/wp-content/themes/cocoon-master/style.css
WordPressバージョン：5.4.2
PHPバージョン：7.4.4
ブラウザ：Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.89 Safari/537.36
サーバーソフト：Apache
サーバープロトコル：HTTP/1.1
言語：ja,en-US;q=0.9,en;q=0.8
----------------------------------------------
テーマ名：Cocoon
バージョン：2.2.0.5
カテゴリ数：14
タグ数：29
ユーザー数：2
----------------------------------------------
Gutenberg：1
AMP：1
PWA：0
Font Awesome：5
Auto Post Thumbnail：0
Retina：1
ホームイメージ：/wp-content/themes/cocoon-master/screenshot.jpg
----------------------------------------------
ブラウザキャッシュ有効化：0
HTML縮小化：0
CSS縮小化：0
JavaScript縮小化：0
Lazy Load：0
WEBフォントLazy Load：0
----------------------------------------------
利用中のプラグイン：
Akismet Anti-Spam 4.1.6
All-in-One WP Migration 7.25
All-in-One WP Migration Unlimited Extension 2.37
Broken Link Checker 1.11.13
Contact Form 7 5.2
Customizer Export/Import 0.9.1
Optimize Database after Deleting Revisions 4.9.1
Regenerate Thumbnails 3.1.3
TablePress 1.11
TypeSquare Webfonts for エックスサーバー 1.2.1
Widget Importer & Exporter 1.6
WordPress Importer 0.7
WP Multibyte Patch 2.8.5
----------------------------------------------
2020年7月23日 11:25
@yhira様へ
私の説明がダメでした。言葉が曖昧で失礼いたしました。
固定ページタイトル上のウイジェットとしてCボックスメニューを入れました。
トップページにだけ表示する設定なので、今現在だとトップページの上にだけボックスメニューが出ております。
この状態で、トップページを編集しようとして、ブロックエディタを起動すると、画面が拡大されて横幅がはみ出して扱いにく編集画面になってしまうのです。
2020年7月23日 12:11
前略、momo さん
お問い合わせの件とは、別件になってしまいますが、子テーマをお使いになることをオススメします。
なお、特殊な事情がお有りの場合や、既にご検討中でしたら、余計な事ですので、ごめんなさい。
わいひら reacted
2020年7月23日 18:57
固定ページタイトル上のウイジェットとしてCボックスメニューを入れました。
ということは固定ページのウィジェット設定がブロックエディター編集画面に影響していたということでしょうか？
ブロックエディター上には、ボックスメニューは表示されていないのにということでよろしいでしょうか。
2020年7月24日 08:17
@yhira様へ
確かに妙ですね。
と言う事で、今、葬式の現場ですが(笑)、iPhoneでテストしました。
なんと、ウィジェットエリアにCボックスメニューの有無での影響がありません。
常に横にはみ出す状態でした。
原因は、ウィジェットでも、ボックスメニューでも無いようです。
たまたま、何が一瞬解決したように見えたのか？
振り出しに戻りました。
ただ、この件に、私1人の雰囲気ならコンテンツに問題があるのかもしれませんね。
それと、今朝、出発前に家から投稿したのですが、見当たらず、どこかで重複きてたらすみません。
2020年7月24日 08:19
@leafytree様
コメントありがとうございます。
特に子テーマを避ける理由はなくて、単にカスタマイズする自信が無いので導入してませんでした。
いずれ必要になったら？に備えて導入した方が良いかも？ですね。
それと、今朝、出発前に家から投稿したのですが、見当たらず、どこかで重複きてたらすみません。
リフィトリー reacted
2020年7月24日 19:19
僕はiPhoneを持っていないので、ちょっと不具合が確認できてません。
他のiPhone所有者の方は、どうなんでしょうね。
直ったときは、特に何かしたとかはなかったのでしょうか。
また、投稿の新規作成ページでもはみ出していますか？
2020年7月24日 19:28
iphoneは所有しているものの、iphoneでWordPressを編集したことは、１度もなし・・
momoさんの書き込みでログインしてみたものの、画面半分は、キーボードになっちゃうし・・（当たり前？）
ボックスメニューは使っていないしで、ブロックエディターでも、普通に使えそうな気はしますが・・
小さな画面は苦手なので、他のiphoneユーザーの方に委ねます。
わいひら reacted
2020年7月24日 20:11
momoさんのiphoneのスクショは、タテに長いですね。
私の6sは画面の縦幅が狭く、WordPressの投稿は、本当にやりにくいです。
2020年7月24日 21:52
iPhone8plus/Safariのスクショです。
特に問題なく編集できます。参考になるか分かりませんが、報告だけでも。
ちなみに、momoさんが利用しているブラウザは何でしょうか？
わいひら reacted
2020年7月25日 11:35
iPhoneのブラウザはSafariでもChromeでも同じ状況です。
改めてトピックを読み返したら、利用してるブラウザ書かれてましたね…。失礼しました。
2020年7月25日 11:43
リフィトリー様、さるこ様、わいひら様、みな様、実験ありがとうございます。
私の環境とか、私のページのコンテンツが何か原因かもしれないですね。
自分のページが軒並みダメか、特定ページだけで済むのか？その場合はどんなブロックを入れたらダメなのか？
調べてみたいと思います。
進展があったらまた投稿させて頂きますが、現時点では私以外に再現しない様子から、上記の絞り込みで
きっと原因が特定できそうな気がしてます。
他のテーマで、ほぼ同じコンテンツのページが問題ないからと、安易にcocoonの原因だと思い込んだのですが
どうやらそうでは無さそうです。
大変失礼いたしました。
わいひら reacted
2020年7月25日 11:56
問題点が画像サイズでした。
添付ファイルの中で右端、スマホだと三段目の画像を削除したところ、iPhoneの編集画面がはみ出さない事を発見しました。
ここに入れた画像は設定した時にサイズを調整してサイズ感を合わせた場所でした。
もしかしたら、画像を設定する以前にPhotoshopなどで三つの画像サイズがあってないと
挿入した後で調整するとブロックエディターに無理が出たのかもしれません。
おかげさまで実験サイトの問題が着々と減ってきてます。
わいひら reacted
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。