Custom Style of WordPress Category widget

Beaver Builder
1

I placed the WordPress Category widget in one page. To style it, I clicked on the Widget Settings. I can see the CSS Selector the ID and Class.
Can you walk me how to create a dummy style and how to reference it? I feel it is a very simple thing to do. But I’m sucked right now.
Thanks,
Rachida

2

Hey Rachida,

Insert a name to the CSS selector class in the widget settings(attached screenshot) and use the CSS snippet below to style it. eg. class name “my-cat-widget” . Let us know if you need anything further. :slight_smile:

http://imgur.com/bN8gecJ

/* Font Color & Size
*/
.my-cat-widget .widget_categories ul li a{
  color: black;
  font-size:20px;
}

/* Widget Title Font Color & Size
*/
.my-cat-widget .widget_categories h2.widgettitle{
  color: red;
  font-size: 40px;
}

Thanks!

KC

3

Thanks KC. I will try it. I am using Dynamik Website Builder. I will use it to add the css in the custom file.

4

Hi KC!
Can you help me with CSS code? which codes I need to add to the CSS class to remove the title or label of the category widget?

Thanks,
So much

5

Hey Rachida,

Try the CSS snippet below and see if it’s what you’re looking for. :slight_smile:

.widget_categories h2.widgettitle{
  display:none;
}

Thanks!

KC

6

Perfect KC. It works.
Can you point me to any documentation where I can find the list WordPress Widgets properties?
Like widgettitle for the widget category.
Thanks,
Rachida

7

Hey Rachida,

Sorry, but I don’t think there is a documentation for that. Check out the link below for more basic understanding regarding WordPress Widgets and on how to style it. You may require some basic knowledge on CSS to understand further. Hope that helps and thanks again!

https://codex.wordpress.org/WordPress_Widgets

KC