WordPress.com

1. imihonua
   Member
   Dec 7, 2012, 1:53 AM

   Theme is Twenty-Eleven. I want to customize the appearance of a text widget only, including its heading. Following WPress instructions for putting links into a widget, I set up a new page, wrote the widget text the way I wanted it to look in Visual mode, copied it in Text mode; then pasted the Text mode into the 'Experiment' widget. It worked fine. But I could not find a way to make the widget heading (title) bold - it would not accept the same code. Can I customize the heading of the widget?
   I would also like to make the widgets wider if I can, in sidebar template view.
   Also to be able to separate individual widgets with a straight line.

   The blog I need help with is truedemocracynow.com.

2. designsimply
   Happiness Engineer
   Dec 27, 2012, 7:49 AM

   But I could not find a way to make the widget heading (title) bold - it would not accept the same code.

   To make widget titles in the Twenty Eleven theme bold, you can add CSS like this to your Appearance → Custom Design → CSS editor:

   .widget-title {
   	font-weight: bold !important;
   }

   Also note that the Headings option on the Appearance → Custom Design → Fonts page also has an option to adjust the style of headings to bold, but that will affect post and page titles as well as widget titles.

3. designsimply
   Happiness Engineer
   Dec 27, 2012, 8:27 AM

   I would also like to make the widgets wider if I can, in sidebar template view.

   Here is an example showing how to adjust the width of the sidebar. You can make edits but note that the percentages are all kind of interdependent so if you adjust the percentage in one spot, you will probably also need to make sure to adjust the corresponding percentage to make room for the adjustment.

   #primary {
   	margin-right: -32%;
   }
   
   #content {
   	margin-left: 4%;
   }
   
   #secondary {
   	margin-right: 4%;
   	width: 27%;
   }
   
   #access ul {
   	margin-left: -6%;
   }

4. designsimply
   Happiness Engineer
   Dec 27, 2012, 8:30 AM

   Also to be able to separate individual widgets with a straight line.

   You could do this by adding a border to the bottom of each widget like this:

   #secondary .widget {
   	padding-bottom: 2em;
   	border-bottom: 1px solid #ccc;
   }

Topic Closed

This topic has been closed to new replies.