サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2018-09-27 21:31
今回のアップデートで投稿記事編集の幅が元に戻ったようですが（一週間前から使い始めたので気づかなかった ? ）、大きくなったせいか、
- ブロックを追加「＋」マークにカーソルが隠れる（ついでに報告）
- フォーマット所属の「クラシック」ブロックで装飾をする際、ワンタッチで枠系が表示されなくなった（先に「B」を押して回避可能）
- 「クラシック」ブロックを上下に動かすブロックが隠れる
といった状態になっていて、添付gif画像を見たほうが早いかも！ ?
わいひら reacted
2018-09-27 22:03
- フォーマット所属の「クラシック」ブロックで装飾をする際
そんな機能が隠れてたんですね、知らなかったのでこの情報、目からうろこです！書き込みチェックしてて良かったぁ( ﾉД`)
ちなみに。今フォーラムの段落は反映されてるのがソースコードからしか確認できないんです。
ぷっぷ reacted
2018-09-28 00:15
ご報告ありがとうございます。
そういった動作には気づいていませんでした。
とりあえず、Gutenberg関係の幅を広げるスタイルは、元に戻しました。
https://github.com/yhira/cocoon/archive/master.zip
CSSで幅を広げると、どうしても動作がおかしくなってしまうので、ちょっと今のところどう対応していか分からない状態です。
Topic starter
2018-09-28 09:32
かうたっくさん＞
この「クラシック」ブロックは画像挿入以外の旧エディター機能がなんでも使えるので、本当におすすめです！
フォーラムの件はそういうことだったんですね！偶然直していてラッキー ?
わいひらさん＞
ワンタッチで枠が召喚できるようになったのを確認したのですが、なんだか別のものを発見してしまって、レイアウト要素所属の「カラム（ベータ）」を使うと、左側のカラムのブロックへ追加「＋」が反応しないようです ?
あとは、Gutenbergで作成した一部の記事をもう一度投稿編集から見ると、クラシックの中に作成した画像とセットの2カラム文字が全て外に出され、「このブロックは外部で変更されました」という状態になってなんかちょっとおかしなことになってるかも・・・（これは詳しく把握していないほぼ未検証）
昨日のアップデートから記事作成をしていないためすべてを把握しておらず、他にもいろいろでちゃうかもしれません。
Gutenbergすごい荒ぶってる ?
幅が広いことのメリットは、
- 見やすい（かなり重要）
- カラム（ベータ）を使い左に画像を入れて、その右に文字を入れた際に画像の微調整がしやすい
といった感じで、クラシックに複数カラムを入れたほうがスマホ表示で1カラムになって都合が良いので、結局使わないし、狭いほうが良いのかもしれません…… ?
Topic starter
2018-09-28 09:48
あとは、Gutenbergで作成した一部の記事をもう一度投稿編集から見ると、クラシックの中に作成した画像とセットの2カラム文字が全て外に出され、「このブロックは外部で変更されました」という状態になってなんかちょっとおかしなことになってるかも・・・（これは詳しく把握していないほぼ未検証）
上記の状況をまっさらなサイトで試してみたところ、なんだか大丈夫でした（再現できなかった） ?
でも、「アップデート前に作成した記事→アップデート後に投稿記事を見る」という手順ではなく、「アップデート後に記事を作成して公開→アップデート後に投稿記事を見る」だったので、消化不良は残っています ?
といってもすぐに直せるので、大きな問題じゃなかったのかもー ?
2018-09-28 20:35
次同様の動作が出たら、editor-style.cssの中身を以下のコードに置き換えて再読み込みをして、試してみてください。
@charset "UTF-8";
/*ビジュアルエディターのスタイルを書く*/
body#tinymce {
padding: 0 20px !important;
margin-top: 0 !important;
background-image: none;
background-color: #fff;
}
.column-2,
.column-3{
margin: 16px 0;
}
.column-2::before,
.column-3::before{
content: "※カラムへの着色はエディタのみ";
position: absolute;
left: 0;
right: 0;
top: -1em;
width: 31%;
font-size: 0.8em;
padding: 4px 8px;
background-color: #f7dde4;
text-align: center;
}
html[lang="en"] .column-2::before,
html[lang="en"] .column-3::before{
content: "* Coloring is Editor Only.";
}
.column-left{
background-color: #c7e1ef;
}
.column-center{
background-color: #c9e8d8;
}
.column-right{
background-color: #ffecd3;
}
/*ビジュアルエディターにinstagramの引用符が表示される対応*/
.instagram-media {
position: relative !important;
}
上記スタイルでも、同様の不具合が起きれば、幅の広さが問題ではないような気がします。というか書き込みを見た感じでは、クラシックと2カラムの不具合のような気がします。
Topic starter
2018-09-28 21:15
わいひらさんの言うとおりもう一度色々確かめてみたら、せっかく用意してもらったコードでは解決せず、別の方法で解決しました ?
私のミスにより余計な時間を取らせてしまってごめんなさい ?
これは「一度Gutenbergエディターに書き込んだものをクラシックにコピペしたせい」で、
<!-- wp:paragraph --><!-- /wp:paragraph -->
といったような、「Gutenbergでお馴染みブロックタグ」がクラシックの中に入ってしまい、クラシックでは意味不明なのでそれを吐き出すという仕様だったようです。だからコピペしやすい文字だけが外にでて、コピペしにくい画像は正常だったのでしょう。
なので、「HTMLとして編集」でHTML化させ、中のブロックタグを削除して解決しました。
解決してしまったので、editor-style.cssの中身は元に戻します。
本当にごめんなさい ?
レイアウト要素所属の「カラム（ベータ）」を使うと、左側のカラムのブロックへ追加「＋」が反応しないようです ?
こっちは上記コードを入れた状態で確認しましたが、やっぱりクリック不能で左側のブロックを選択できませんでした。
私はカラム（ベータ）のカラムを使用していないので、現状困ってません ?
2018-09-28 21:47
これは「一度Gutenbergエディターに書き込んだものをクラシックにコピペしたせい」で、
これは僕もよくやってしまいます。
ビジュアル（Gutenberg）エディターに貼り付けると、書式ごと貼り付けられてしまうんですよね…。
こっちは上記コードを入れた状態で確認しましたが、やっぱりクリック不能で左側のブロックを選択できませんでした。
もしよろしければ一度、editor-style.cssの中身をすべて削除した状態で試してみていただけますでしょうか。
もしそれでも、不具合が出るようであれば、cssとはまた別にレイアウト関係の不具合を修正する必要があるのかもしれません。
ぷっぷ reacted
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。