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

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

ブロックの背景色を変更したいです。(カ...
 
共有:
通知
すべてクリア

[解決済] ブロックの背景色を変更したいです。(カスタム色)

5 投稿
3 ユーザー
4 Reactions
5,720 表示
 vaio
(@vaio)
Eminent Member Registered
結合: 5年前
投稿: 32
Topic starter  

お世話になります。

固定ページの文章を入力した部分(ブロック)の背景色を変更したいです。
色設定のところで、4色選べるようになっていますが、自分の好きな色を入力して設定出来ないようです。

それで、「追加CSSクラス」のところに
background-color: #f0ece1
と入力してみたのですが、反映されませんでした。

変更したい部分は、添付画像の赤い囲みの部分です。

また、よく見るとブロック自体を薄いグレーの線で囲っているので、出来ればこの枠線もなくしたいです。

このサイトのフォーラムの書き込みで見つけたのですが、このような雰囲気が理想です。
https://oshasma.com/style/fashion/leather-shoes-off/
このように、ページ全体の背景色と同じにしたいです。

いい方法がございましたら、お教え頂ければと思います。

よろしくお願い致します。

テスト制作中です。

http://aply.jp/tulip/


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17220
 

ブロックエディターの、そのブロックの設定項目のスクリーンショット画像をいただけますでしょうか。


   
 vaio
(@vaio)
Eminent Member Registered
結合: 5年前
投稿: 32
Topic starter  

お世話になります。

まず、添付の画面で色を変えてみましたが、変化が無かったです。それから、「cocoon設定」の「エディター」画面の「ブロックエディター設定」で「拡張カラーパレット色」を6色とも指定したい色に変えてみましたが、添付画像の部分の変化はありませんでした。

https://wp-cocoon.com/community/cocoon-theme/%E3%83%96%E3%83%AD%E3%83%83%E3%82%AF%E3%81%AE%E8%83%8C%E6%99%AF%E8%89%B2%E3%81%A8%E6%96%87%E5%AD%97%E8%89%B2%E3%81%8C%E5%8F%8D%E6%98%A0%E3%81%95%E3%82%8C%E3%81%AA%E3%81%84/

こちらを参考にして、親テーマを更新してみましたが、変化がありません。

 

別の質問でアドバイスを頂きました、「プラグインをすべて無効化」もしてみましたが、添付画像の変化がなく、色を変えることが出来ませんでした。

 

https://shiritai.net/cocoon_backgroundcolor/#toc6
また、コンテンツの部分は、こちらのページを参考にして背景色を変更しました。

.main{
background-color: #f0ece1;
}

こちらのページでは、ブロックの部分まで色が変わっていますが、私のものは文章部分のブロックは白いままです。

よい解決方法がございましたら、よろしくお願い致します。

 


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 6年前
投稿: 6845
 

私は、ブロックエディターは、どうも苦手なので、ほどんど使っていないのですが、vaio さんが該当箇所にお使いになっているブロックは「表」という種類のブロックのようです。

「表」というブロックは、おそらく、エクセルのような表を作るときに使うものではないかと推測します。

「表」のブロックを使うと、親テーマのCSSの指定によって、表の色や罫線が適用されてしまうようです。

記載の内容を拝見いたしますと、表の罫線等も無いようですので、「表」以外のブロックをお使いになってみてはいかがでしょうか?

試しに私のローカル環境のテストサイトで「段落ブロック」でやってみたら、背景色も同じになるようです。

これは、余談ですが、商用のWebサイトを作成される際に、ひとつ、つまづいては、このフォーラムに質問される方がよくいらっしゃいます。

わいひらさんが基本無料でやられているフォーラムですが、回答するのには、調べたり、テストしたりと、時間と労力を要します。

なので、ある程度の節度は必要なのかなと、私は感じています。

商用の場合は、あまり背伸びせず、わかる範囲で作るか、何度も質問を繰り替えさなければならない場合は、プロに依頼した方が、気兼ねなく頼めるかと思います。

 

 


   
 vaio
(@vaio)
Eminent Member Registered
結合: 5年前
投稿: 32
Topic starter  

leafytreeさま

とても丁寧に教えて下さりありがとうございます。
文章を記入する前に「段落」を選んでから記入したら上手くいきました。
テストまでして下さり、お手間をお掛け致しました。大変ありがとうございました。

どうしても必要な部分だけをお尋ねしているつもりなのですが、初めて使って見るWordpressなので分からないことばかりで申し訳ございません。

これからもよろしくお願い致します。

 


   
共有:

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

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

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

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

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

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

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

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