フォーラム掲示板について

以下の目的、注意点などご確認いただき、ご使用ください。

目的
Connect-CMSのユーザやConnect-CMSに興味のある方同士で自由に意見交換できる場を提供する目的で、コミュニティ掲示板として提供しています。
投稿方法
このサイトにユーザー登録することで、投稿することができます。
投稿内容
投稿内容は公開されます。
Connect-CMSに無関係な内容が記載されたと判断した場合、削除することがあります。
バグ情報
バグ(不具合)はGithub のIssues(https://github.com/opensource-workshop/connect-cms/issues)に記載していただくと、開発者に伝わりやすくなります。
また、セキュリティなど重大な事象の場合は、お問い合わせページよりお知らせください。優先的に調査いたします。
また、貢献ガイド(https://connect-cms.jp/abount/contributions)も参照をお願いします。

フォーラム掲示板

Re: 新着情報に表示されるボタンの色について

2021年8月29日 16時07分 [公星]

 
mipo 様
 
私の提案は以下のとおりです。

------------------------

[課題1]元の「ブログ」と「新着情報」でカテゴリの色が変わる

(対策)カテゴリ設定で「クラス名」をすべて違うものにする
 


 
 

[課題2]以前に作ったボタンが黒文字の状態のままになる

(対策)ブログの編集画面で別のカテゴリを選んで保存した後
    再び「オンライン授業」のカテゴリに変更し直す
 

------------------------

以下、課題1に対する説明です。
 
これは「ブログページでのカテゴリーの色指定の仕方」と
「新着情報での色指定の仕方」が異なるために起こる現象です。

 ・ブログ側:style="color: ○○; background-color: ●●"
 ・新着情報:class="cc_category_▲▲"

 

(↓ ブログでの色指定: style="" が使われ、意図通りの色が表示された)

(↓ 新着情報の色指定: class="cc_category_" が使われ、別の色になった)

---
 
同じクラス名を使っていると、指定した色ではなく、
別の色で表示される場合があります。(課題の再確認)

私の検証では赤色になりました(下図)。
 

---

「新着情報」で使われている色指定のクラスは、
CSSファイルの中で次の図ように保存されています。
(https://ドメイン名/file/css/1.css  ←本体はどこか分からなかった。DB内にはあった)
 

 

--- 
 
「新着情報」を表示する際、
システムはCSSファイルを上から読み進めます。

その際、クラス名が同じだと
上で読んだ設定が下に書いてある設定で上書きされていきます

そのため、私の場合は一番下の赤色で表示されたというわけです。

 
この理屈に従うと、クラス名を全部バラバラにすれば、
Connect-CMSが新着情報を表示する際の色設定が上書きされず、
意図通りになるのではないかと推測します。

---------

課題2に関し、黒文字の「オンライン授業」のラベルは、
現在「cc_category_null」と色指定されていました。

黒文字になるのは「カテゴリの削除により色設定の読み込み元を失った」せいですから、
改めてカテゴリを設定し直してあげればよいと思います。

すなわち、一旦、別の「cc_category_▲▲」に置き換わるように、
ブログの編集ページで別のカテゴリを選び、保存してから、
もう一度カテゴリを選択するように試してみて下さい。

 

(更新:2021年8月29日 17時00分)
スレッドの記事一覧

夏休み明け新型コロナウイルス感染拡大に伴う分散登校でオンラインとの併用型の登校となり、ホームページにオンラインのポータルサイトをプラグインで作成して、ConnectCMSを活用させていただいています。ありがとうございます。

1つ新着情報についてですが、カテゴリボタンの色が本文のサイトと新着情報のサイトで変わってしまって困っています。

1 オンライン授業のサイトに「オンライン授業」ボタンを#00a3af(青系)で作った。本編サイトでは指定通りの色で出るが、「新着情報」では緑になってしまう。

2 一度「オンライン授業」カテゴリを削除し、再び作り直してみたが、症状は同じ。以前に作ったボタンは黒文字の状態で、再設定しても変更しない。

こちらを見ていただくとわかりやすいと思います。

https://anan-hs.i-school.jp/

どうすればよいか、どなたかご教授下さい。よろしくお願いします。

Re: 新着情報に表示されるボタンの色について
2021-08-29 [公星]

 
mipo 様
 
私の提案は以下のとおりです。

------------------------

[課題1]元の「ブログ」と「新着情報」でカテゴリの色が変わる

(対策)カテゴリ設定で「クラス名」をすべて違うものにする
 


 
 

[課題2]以前に作ったボタンが黒文字の状態のままになる

(対策)ブログの編集画面で別のカテゴリを選んで保存した後
    再び「オンライン授業」のカテゴリに変更し直す
 

------------------------

以下、課題1に対する説明です。
 
これは「ブログページでのカテゴリーの色指定の仕方」と
「新着情報での色指定の仕方」が異なるために起こる現象です。

 ・ブログ側:style="color: ○○; background-color: ●●"
 ・新着情報:class="cc_category_▲▲"

 

(↓ ブログでの色指定: style="" が使われ、意図通りの色が表示された)

(↓ 新着情報の色指定: class="cc_category_" が使われ、別の色になった)

---
 
同じクラス名を使っていると、指定した色ではなく、
別の色で表示される場合があります。(課題の再確認)

私の検証では赤色になりました(下図)。
 

---

「新着情報」で使われている色指定のクラスは、
CSSファイルの中で次の図ように保存されています。
(https://ドメイン名/file/css/1.css  ←本体はどこか分からなかった。DB内にはあった)
 

 

--- 
 
「新着情報」を表示する際、
システムはCSSファイルを上から読み進めます。

その際、クラス名が同じだと
上で読んだ設定が下に書いてある設定で上書きされていきます

そのため、私の場合は一番下の赤色で表示されたというわけです。

 
この理屈に従うと、クラス名を全部バラバラにすれば、
Connect-CMSが新着情報を表示する際の色設定が上書きされず、
意図通りになるのではないかと推測します。

---------

課題2に関し、黒文字の「オンライン授業」のラベルは、
現在「cc_category_null」と色指定されていました。

黒文字になるのは「カテゴリの削除により色設定の読み込み元を失った」せいですから、
改めてカテゴリを設定し直してあげればよいと思います。

すなわち、一旦、別の「cc_category_▲▲」に置き換わるように、
ブログの編集ページで別のカテゴリを選び、保存してから、
もう一度カテゴリを選択するように試してみて下さい。

 

公星様

大変丁寧なご説明、ありがとうございました。

HPも直りました。