Widget Title Change: one out of many widget on one page

Hello,

I would like to know how do I change color for one specific widget’s title.

Widget: Sydney FP: List

FYI: I have multiple widgets on the page and only 1 widget title color needs to be updated.

appreciate your help!

Hello there,

In the widget settings in page builder, expand the Attributes tab, the set a custom class name to “Widget Class” box, for example: my-widget

Update page. Then navigate to Appearance > Customize > Additional CSS. Add this CSS code:

    .my-widget .widget-title {
      color: #ff0000 !important;
    } 

Regards,
Kharis

Thank you Very Much! it worked!

what should I do if I want to change the title color for another widget on the same page?

Should I rename “.my-widget” to below? and do the same as step 1 & 2?

.my-widget2 .widget-title {
  color: #ff0000 !important;
}

Yes, you’re correct.

Let us know in a new topic if you have anything else we can help.

Regards,
Kharis

Once again, thank you very much Hari!

Why am I seeing two underlines? after adding the class.

Please share a link to the page where I can inspect that widget.

Regards,
Kharis

http://www.teraswift.com/rec-staff/

Please look for our process widget.

Visiting that link, I don’t find any widget title that reads “Industries” as seen in in your screenshot. Did you remove it? Is there other else we can help?

Regards,
Kharis

Sorry, please look for “Our Process” section in the following link.

Hello there,

You should avoid widget-title for custom class name in either widget or row settings.

Regards,
Kharis

Thank you very much!

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis