How to Change sidebar widget background and Border in Thesis Theme

This video tutorial explains about how to style our sidebar widgets. Normally thesis theme 1.6 sidebar widgets are very simple. In order to look our sidebars pretty we need to  Style your widget  background and text area. sidebar give the better impression to our visitors  so we need to concentrate more on sidebar widget element customization. Normally thesis theme  widget similar to the below image.

To style your widget text area by copy and paste the following code in custom.css file.

/*side bar widget area link style */

.custom li.widget ul li{
background:#F0F0F0;
border: 0.1em solid #C7C7C7;
-moz-border-radius:4px;
padding:0.5em;
margin:0.5em;
}

1. For do this  login your wordpress admin
2. Choose ‘custom file editor’ under thesis options in left sidebar of the wordpress dashboard.
3. Select custom.css file and click on edit selected file.
4. Paste the above code and save it. Then visit your site.

The above code is to style the sidebar widget text link area only not to style the whole widget  area.

The above mentioned code you can change text area background color. The widget text link area contains Line height, font size of the text link. If you want to modify your widget text font Just add font-size: 1.5em; this code is not to change the widget title size. You can also remove border if you don’t want.

You can also style your widget area by adding the following code in custom.css file

/*side bar widget bacground*/

.custom li.widget ul {
background:#444;
border: 0.1em solid #C7C7C7;
-moz-border-radius:4px;
padding:0.5em;
}

For do this follow the above four steps.

The above code contains the background of the widget area. Styling widget title is not included in this code to style widget title click here. Once you pasted the above codes your side bar widgets shown like the below image.

Share the experience in comments with new widget style in your sidebar.

Related Tutorials:

1. Widgetized Thesis Theme-Header, Content box and Footer
2. How to Create Wigetized Footer in Thesis Theme?
3. How to Place Different Background Color for Each Sidebar Heading in Thesis Theme
4. How to Place Ads Box Before The Post Title in Wordpress Thesis Theme?
5. How to add Social Bookmark Icons at Right Side of the Post in Thesis Theme

Tagged as: background, border, color, sidebar, widget