Community Forums › Forums › Archived Forums › General Discussion › Widget font color
Tagged: header widget text color
- This topic has 9 replies, 2 voices, and was last updated 12 years, 1 month ago by
tjd.
-
AuthorPosts
-
January 7, 2013 at 1:35 am #10074
tjd
MemberHi,
I've been working with sidebar and footer widgets. It seems that a change to the widget color affects all widgets, wherever they are. Today I thought of an idea for the Header Widget. At the moment it has grey text and is unreadable. If I change it to white, then the sidebar text will disappear. I'm using the Legacy theme. Is there a practical solution that a barely-coding person can use?
Thanx,
Tom
January 7, 2013 at 1:54 am #10076Brad Dalton
ParticipantJanuary 7, 2013 at 3:30 am #10079tjd
MemberHi braddalton,
I put the code in between these 2 codes in the css.
}
#header .widget-area {
float: right;
padding: 20px 0 0;
width: 300px;
}#header .widget {
margin: 0 0 10px;
overflow: hidden;
}I didn't get any change in font color in the widget. Fortunately I didn't see any other change either. I'm past the stage of cardiac arrest but still shudder when unexpected visions pop-up on screen. But thanx so much for your suggestion. If I didn't put it in correctly please advise.
Thanx, Tom
January 7, 2013 at 5:05 am #10083Brad Dalton
ParticipantI pasted it at the end of the child themes style.css and it worked fine for me.
You could add the declaration for color in the existing CSS code
#header .widget-area {
float: right;
padding: 20px 0 0;
width: 300px;
color: white;
}
January 7, 2013 at 6:00 am #10087tjd
MemberHi braddalton,
Thanx for staying with me on this. I'm getting no change from either code. I added color as you suggested, but nothing changed. Then I added the original as you did, at the very bottom of the css, updated, checked, no change and when I returned to the bottom of css to remove the code, it was gone?? So I'm not sure where to go with this.
the Title and Title Tag line are both white text on a red header bkgd. The text in the Header widget is grey, and although it's difficult to tell, it looks like the grey text color of the widget titles in the sidebar. As it is I can't use it. It is my attempt to get around the fact that my pic+short bio at the top of the sidebar, fall way down the Page on a Mobile phone. Anyway,
thanx for your help,
Tom
ps/ here's the site if you want to take a peek: tomjdolan.com
January 7, 2013 at 6:19 am #10089Brad Dalton
ParticipantI thought you where using a text widget but you are using a profile widget.
The easiest way would be to paste the text and insert an image aligned left in a new post draft and grab the html from your text editor there and paste it into a text widget in your header right.
Otherwise the text will be white for all profile widgets as previously stated.
Not sure how to isolate one profile widget but i'll try and find out for you
January 7, 2013 at 6:36 am #10094Brad Dalton
ParticipantHere's 3 plugins which all add custom classes to widgets
Create a name for the custom class and use that as the selector for changing the text color in the header right profile widget
http://wordpress.org/extend/plugins/kc-widget-enhancements/ KC Widget Enhancements
http://wordpress.org/extend/plugins/custom-widget-classes/ Custom Widget Classes
http://wordpress.org/extend/plugins/widget-css-classes/ Widget CSS Classes
January 7, 2013 at 6:41 am #10096tjd
MemberGreat advice braddalton, Hey that's creative,
So I simply create a new post with the pic & text, then copy the code from the html page into a text widget and put that up into the header widget area. I wouldn't have thought of that....obviously i don't have the experience. I'll give it a try.Thanx, this may take a bit of time and it's gettin late here in Tokyo, but I'll try to get it complete tonite and let you know. So now I see the 3 plugins and I assuming I use one after(?) i create the new text widget, that is not to be used with the current profile widget...or is that not correct?
I'll hyperlink to the plugins and see what they say...
You've been great, Thanx'
TomJanuary 7, 2013 at 7:08 am #10102Brad Dalton
ParticipantNo need to install any of those plugins.
Simply create the HTML (text and image) and paste it into a widget.
You could make the text white in your editor while creating it or use the CSS.
#header .widget-area {
float: right;
padding: 20px 0 0;
width: 300px;
color: white;
}<a href="http://tomjdolan.com/wp-content/uploads/2013/01/tom.jpeg"><img class="alignleft size-full wp-image-37423" alt="tom" src="http://tomjdolan.com/wp-content/uploads/2013/01/tom.jpeg" width="65" height="65" /></a>Welcome to Performance of Speaking, dedicated to Beginning & Advanced Speakers World-wide.
<a href="http://tomjdolan.com/wp-content/uploads/2013/01/tom.jpeg"><img class="alignleft size-full wp-image-37423" alt="tom" src="http://tomjdolan.com/wp-content/uploads/2013/01/tom.jpeg" width="65" height="65" /></a><span style="color: #ffffff;">Welcome to Performance of Speaking, dedicated to Beginning & Advanced Speakers World-wide.</span>
January 7, 2013 at 6:16 pm #10224tjd
MemberMornin' braddalton,
Don't know if you received my last email late last nite. Thanx for all your assistance. You made it happen with the creative idea of writing the code in a temp post then taking the created html into the text widget. My kinda solution. Worked well and it can be seen now in the Header. Had to tinker with the image and I'll be rewriting that tag line for the next week or so.....but it works well.
Tom
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.