Flat Responsive offers you several widget styles that you can have when using the optional plugin called Widget CSS Classes. Widget styles you get are:
- Default
- Border
- Solid
- Dot
- Dot Line
- Image
- Menu
To give you an introduction to how the above styles look, you can check out the live demo site here:
When planning out your web pages that will include widgets, you will want to take note that some widgets may not look good with a particular style, but with another, simply amazing. This also will be dependent on third party widgets you install into your website as well.
List Based Widgets
You also get to use list styles on your widgets; widgets that are list type:
- list-dash
- list-checkmark
- list-square
- list-circle
- list-curve-arrow
- list-solid-arrow
- list-short-arrow
You can find the HTML Snippets folder in your original theme package download where the above styles and other classes can be found and used as a reference. For the Image style, this is a special style generally reserved for a text widget that has an inserted image along with content. The snippet text file has a sample for you to use as a starting point.
Install Widget CSS Classes
Installing this plugin is optional, but it will allow you to take advantage of the widget styles this theme has to offer. Unfortunately, this is another feature that WordPress does not have built into its core, so a plugin is required to achieve this capability.
- Go to Plugins >> Add New
- Search for Widget CSS Classes
- Install and Activate
Once you install this plugin, it adds a form field at the bottom of your widgets which is used to enter in the class or classes to style your widget.
With the above list of classes – with the exception of Default – you enter in the name into the form field you see in the screenshot. So if you wanted to style your widget with the Dot Line style, you would enter in: dotline