(Part Two) Understanding CSS and Editing your WordPress Template: Editing the “Sidebar” and “Widget” Fonts, “Link Font Color” and “Header Background Color”

Categories: Advance Users, Beginners, How-to Examples, News, Website Blog Post

No Gravatar

On my last post, I entered the scary and so-called dangerous “Editor” and familiarized the readers with changing the look of the body of their blog. Here in this post, I will concentrate on changing the sidebar look and adding a piece of code that will give you full control of your widget fonts. By the time you finish reading this post, you should have sufficient information to successfully edit the look of your Blog. So let’s go back to the editor and take a good look at the sidebar and the widget code we have to add:

Click on Image to Enlarge

Copy this Code:

.widgettitle {
font-size: pt;
font-family: ‘Comic Sans MS’, Book Antigua;
font-weight: strong;
color: #;
border-bottom: 3px solid #000000;
padding: 0  0 5px 3px;}

Once you copy this simple code into the Stlyessheet (style.css), then you can edit and change three dynamics of the widget titles, 1.  Type of Font (Font Family, I have chosen Comic Sans MS in this code), 2. Choose either Strong which equals Bold or leave blank which is Normal. 3. Change the color of the Fonts. All the titles of your widgets will change at once! Notice that I have “Book Antigua” also? That doesn’t mean anything, the Font will only adjust to the one in theThe Single Parenthesis so if you place the single parenthesis on either side of Book Antigua then Comic Sans MS will not work. Play with it, don’t get scared.

Changing the Link Fonts (Color and Hover):

Click on Image to Enlarge

To Change the color of the background of your Header:

Click on Image to Enlarge

Your email:

 

Share and Enjoy:
  • Print
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • Blogplay
  • FriendFeed
  • Twitter
  • Add to favorites
  • Blogosphere News
  • email
  • StumbleUpon
  • Technorati
  • BarraPunto
  • Bitacoras.com
  • LinkedIn
  • Live
  • Yahoo! Bookmarks

Spread The Love, Share Our Article

Related Posts

There are no related posts on this entry.

Comments

There are no comments on this entry.

Trackbacks

There are no trackbacks on this entry.

Add a Comment

Required

Will not be published. Required

Optional

 

Subscribe to Bloggers Weekly

Fans of Bloggers Weekly

How-To Examples

  • Facebook Integration, Part Two: Wordbooker
  • (Part Two) Understanding CSS and Editing your Wordpress Template: Editing the "Sidebar" and "Widget" Fonts, "Link Font Color" and "Header Background Color"
  • A "Static" page not really necessary, "Widget Context", "Thumb Excerpts" and recent posts
  • Finding a "Post SlideShow" plugin and "Smooth Slider"
  • I'm back and with a few ideas, Hyper Cache and some helpful information
  • The Blog-in-Blog Plugin
  • The Importance of the "Executable PHP Code" Widget
  • Understanding CSS and Editing your Wordpress Template (Part One: Editing the "body" Tag)
  • Universal Post Manager and the Stream Video Player Plugins
  • RSS Blogger’s Weekly Feed

    Bloggers Weekly Widgetbox Reader

    Blogger’s Weekly Archive

    Blogger's Weekly Cloud