Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Sidebars & Widgets »

[SOLVED] Varying the styling for each widget


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Mar 1, 2012, 06:52 AM
megavolt
 
17 posts · Mar 2012
[SOLVED] Varying the styling for each widget

I am a newbie to both Wordpress and Atahualpa.
I am making a website and I wanted to have a border around the widget container in my left sidebar. Therefore in the Atahualpa settings - Style Widgets - Widget container, I added the following style:
margin: 25px 0 25px 0;
border: solid 3px #875500;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
padding: 10px 10px 10px 10px;

This works fine for me except that it makes a border around all the widgets in every sidebar. I do not really know if this style change was placed in the right place or not. Can someone please explain to me how I can have the border JUST for the widget in the left sidebar? At one point I figured that if I could find the place where each widget gets it's styling from, I could change the color of the border to the same color of the background - that way it won't be seen. But I can't figure out where it is that I need to make the change.

Can someone please point me in the right direction?
Thank you
  #2  
Old Mar 1, 2012, 07:16 AM
lmilesw's Avatar
lmilesw
 
10,100 posts · Jul 2009
Central New York State USA
To style specific widgets you need to determine the selector for the widget (I use Firebug) and then put the necessary CSS in the CSS Inserts box in the theme options. For instance the widget ID might be #category-3 or #text-2.

Where you put the styling is meant to style all widgets so if you have some style you want as the default style you put it there.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #3  
Old Mar 8, 2012, 09:22 PM
megavolt
 
17 posts · Mar 2012
Thank you for your reply. I've done what you have said, but I am not that familiar with PHP. The theme that I am using (Atahualpa) seems to be putting a lot of the styling in the PHP .
I have found the ID and the class, but I am not sure what to do with this. Can you please put me on the right path?
Thank you
  #4  
Old Mar 8, 2012, 09:39 PM
lmilesw's Avatar
lmilesw
 
10,100 posts · Jul 2009
Central New York State USA
I am not talking about PHP. I am talking about CSS. If you give a link to a site and a specific idea of what you want to do I can perhaps helpl.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #5  
Old Mar 8, 2012, 11:31 PM
megavolt
 
17 posts · Mar 2012
Thank you.
The site is: www.myappliancetips.com

I wanted to have a border around the menu (widget) on various menu pages such as:
http://www.myappliancetips.com/large-appliances/

On the other hand, I do NOT want the border on the right sidebar widgets, such as found on the front page. I realize that my placement of the border is not in the right place, but I don't know where the right place is.

In most themes the style.css is huge and has most of the styling for the theme. In Atahualpa, they seem to put much of the styling elsewhere. As you can obviously see, I am a newbie and not a professional website builder.

Thanks again
  #6  
Old Mar 9, 2012, 04:50 AM
juggledad's Avatar
juggledad
 
22,265 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
What you want to do is style the WIDGET containers (ato->Style WIDGETS->Widget Container) as you are doing, then add a CSS Insert statement to shut off the border on widgets in the right sidebar
HTML Code:
td#right div.widget {
border: none;
}
p.s. if you want the images on the home page to each be wrapped in a border, put them each in their own text widget
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Last edited by lmilesw; Mar 9, 2012 at 05:40 AM.

Bookmarks

Tags
borders, widget

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Varying the stylings for each sidebar wallyman0 Sidebars & Widgets 5 Mar 9, 2012 04:09 PM
BUGFIX 361-04: Allow Custom Menu widget links to use same styling as Pages widget. juggledad Old Version fixes and change logs 1 Jan 22, 2011 08:40 AM
BUGFIX 361-03: Allow Tag widget links to use Atahualpa widget link styling. juggledad Old Version fixes and change logs 3 Jan 14, 2011 03:56 PM
How to fix varying width of submenus? thellancer Page & Category Menu Bars 2 Nov 28, 2010 09:51 PM


All times are GMT -6. The time now is 09:41 AM.


Powered by vBulletin® Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.