« Continued List of Why I Hate ‘XCode’ for Mac | Home | Assigning Roles in Wordpress »
Custom Styling Wordpress Widgets
I love Wordpress because I learn more about PHP and how it works with every requirement that comes my way. One issue is with a Wordpress theme that has multiple widgets, and you want each section of widgets to be styled differently. Let’s say you have two sections of widgets on your website:
- Sidebar (the basic sidebar widget section that most everyone has) and
- A footer (this could be widgets in the footer, or somewhere else on the site that is calling dynamic widgets via the Dashboard).
So of course we want both to have different styles, such as background color, padding, link colors, etc.
You will need to review your theme’s function files, an example of one I wrote custom (so it may be different than yours) is below. I had to take an image of it because it’s not being inserted correctly within my WP theme:

Notice the line that proclaims a beginning and ending div with the class,
![]()
I have essentially given the widgets in this sidebar a special class which is called in the css. We can then add a css declaration as below,

