How to Change Widget Title Background Color?

[AndresGT1]

Hello Everyone,

I'm trying to modify the title background color of the Announcements Widget. It doesn't have the OOB "Presentation" section of the widgets which you can set the background color as Success, Error, etc..

I'm looking to leave it the same as the success color, to achieve this how would I need to modify the widget, any help will be much appreciated.

Leaving a visual aid image below.

Regards.

[Allen Andreas · Accepted solution]

Hi,

Ultimately, it would have been nice to have a visual aid of the exact widget you're talking about, haha.

But..I assume you're talking about this one?

If so...then you'd want to go to your widget editor and clone this widget.

Then, in the cloned widget CSS section, you would add code like this:

.panel-heading {
  background-color: coral;
}

And then you'd want to save...and then add this new cloned widget to the respective portal page (using designer) and then of course remove your old announcements widget.

So in the end, it would look like:

And for Brand theme'd "Success" color specifically, you can use:

.panel-heading {
  background-color: $brand-success;
}

Which for me in an OOB personal developer instance, would look like:

Please mark reply as Helpful/Correct, if applicable. Thanks!

[AndresGT1]

Yeah Allen,

We changed the Tittle for it haha. Sorry for that, but your answer is exactly what I was looking for!

Thank you!

[rgeneus1]

Is there a way to just disable the old announcement instead of completely removing it and make the new one active?

[Allen Andreas]

Hi,

I'm not sure fully what you're asking, but are you saying that you have an announcement that you want to just disable/not appear in this widget anymore?

If so, then the widget is driven off the announcements from and to date that you set for it. So once it's past the "to" date/time, it'll auto disappear from the announcement widget and no longer accessible.

If you're asking something else (since this question was around setting the background color of a widget, etc.), please create a new question, but feel free to "mention" me in it by adding: @Allen A in the body of the question.

Please mark reply as Helpful, if applicable. Thanks!