AmazonwebサービスAndroidWindows食料品ホームブログ・WordPressCocoonでビジュアルエディターのスタイル(CSS)を変更する方法この記事は約2分で読めます。2018.09.30WordPressテーマ「Cocoon」では、記事を入力する画面で使うビジュアルエディターに、実際のブログ画面と同じスタイルシート(CSS)を反映してくれています。これはものすごく便利なのですが、CSSの種類によっては、記事作成の邪魔になることがあります(後述)。そんな時のための、WordPress管理画面の変更方法です。具体的なケースエディタースタイルをオフにするeditor-style.cssを編集するまとめ具体的なケース筆者が実際にあったのが、リストタグ(<ul><li>~</li></ul>)用のCSS。とあるブロックで、<li>にインラインブロックの指定をして、横並びになるように設定しました。ところがビジュアルエディターで、そのリストを編集する時。通常はキーボードのEnterで、新しいリストが増えていくのですが、CSSのせいか、挙動がおかしくなってしまいました。エディタースタイルをオフにする解消方法としては、2つあります。一つは「Cocoon設定」からエディターの設定を変更すること。「Cocoon設定」にあるタブから「エディター」を選び、エディター設定を表示します。その中の「エディタースタイル」のチェックを外すと、テーマスタイルがビジュアルエディターに反映されなくなります。チェックを外したら、「変更をまとめて保存」のクリックを忘れないように。editor-style.cssを編集するもう一つは、ビジュアルエディターのスタイルシート(editor-style.css)を編集する方法。editor-style.cssはビジュアルエディターのみに適用されるスタイルなので、ここにトラブルを解消するためのCSSを記載します。この方法であれば、実際の見た目を極力維持したまま、当該部分のみを修正できます。Cocoonでは、editor-style.cssがあらかじめ準備されています。子テーマのテーマファイルから、「ビジュアルエディターのスタイルシート」を開きます。今回のケースでは、inline-blockを指定したリストタグに、サイドblock指定をします。これでビジュアルエディター上では、リストが縦並びになり、Enterキーでの項目追加が可能となります。まとめ以上、Cocoonでビジュアルエディターのスタイル(CSS)を変更する方法、でした。普通のテーマであれば、多少の工夫が必要な部分でも、WordPressテーマCocoonでは既に用意されている。本当に便利なテーマです。掃除機買い替えでスティッククリーナー。コメントをキャンセルメールアドレスが公開されることはありません。*サイト上に表示された文字を入力してください。コメントデータの処理方法の詳細はこちらをご覧ください。Speedの違いは?レンタルサーバー比較2019.07.082019.10.11Cocoonで目次の上にリンクユニット広告を表示する設定2018.06.232018.07.12ブログをHTTPS化したらアクセス数が激減して泣きそうになった話2017.08.272018.07.12個人ブログをHTTPS化する必要性とメリット・デメリット2017.09.232019.10.09Cocoonでビジュアルエディターのスタイル(CSS)を変更する方法2018.09.30エックスサーバーとmixhost、両方使ってみた感想。レンタルサーバー比較2018.04.192019.10.09子テーマを編集してWordPressテーマを安全にカスタマイズ2017.10.102018.07.12個人ブログはHTTPS化(常時SSL化)した方が良いか?ブログ開設時に対応しておくと楽2017.08.282018.07.12ブログのスマホ向け画面をパソコンで確認する方法2017.09.292018.07.12レンタルサーバーの選び方。デジタルガジェットとインターネットをこよなく愛する昭和生まれです。このブログについて人気記事Androidのホーム画面でアプリアイコンをフォルダーにまとめる方法2018.06.212020.02.12Chrome拡張「Stylus」でユーザースタイルシートを設定する方法2018.12.12iOS端末にOCNのメールアドレスを設定する方法。SSLに注意!2016.08.092020.02.12ノートンにexeファイルが削除されて実行できない時の対処方法2016.01.152019.12.24KALDI(カルディ)でマヌカハニー購入。Speedの違いは?レンタルサーバー比較2019.07.082019.10.11Cocoonで目次の上にリンクユニット広告を表示する設定2018.06.232018.07.12ブログをHTTPS化したらアクセス数が激減して泣きそうになった話2017.08.272018.07.12個人ブログをHTTPS化する必要性とメリット・デメリット2017.09.232019.10.09Cocoonでビジュアルエディターのスタイル(CSS)を変更する方法2018.09.30エックスサーバーとmixhost、両方使ってみた感想。レンタルサーバー比較2018.04.192019.10.09子テーマを編集してWordPressテーマを安全にカスタマイズ2017.10.102018.07.12個人ブログはHTTPS化(常時SSL化)した方が良いか?ブログ開設時に対応しておくと楽2017.08.282018.07.12ブログのスマホ向け画面をパソコンで確認する方法2017.09.292018.07.12レンタルサーバーの選び方。デジタルガジェットとインターネットをこよなく愛する昭和生まれです。このブログについて人気記事Androidのホーム画面でアプリアイコンをフォルダーにまとめる方法2018.06.212020.02.12Chrome拡張「Stylus」でユーザースタイルシートを設定する方法2018.12.12iOS端末にOCNのメールアドレスを設定する方法。SSLに注意!2016.08.092020.02.12ノートンにexeファイルが削除されて実行できない時の対処方法2016.01.152019.12.24KALDI(カルディ)でマヌカハニー購入。スプーンひとすくいで濃厚な味わい2015.05.062018.07.06タイトルとURLをコピーしました。