WordPress.org

1. word-wiz
   Member
   Posted 7 months ago #

   Hi,

   I want to stop hard coding info into the footer and think text widgets would be a good way to go. I have not used them before but have just inserted simple text into all 4 widgets into a theme based on 2010.
   It seems that their is no way to target a specific footer widget area via CSS.

   <ul class="xoxo">
   						<li id="text-3" class="widget-container widget_text"><h3 class="widget-title">1st fw title</h3>			<div class="textwidget">1st fw</div>
   		</li>					</ul>
   
   					<ul class="xoxo">
   						<li id="text-5" class="widget-container widget_text">			<div class="textwidget">2nd FW</div>
   
   		</li>					</ul>
   
   					<ul class="xoxo">
   						<li id="text-4" class="widget-container widget_text">			<div class="textwidget">3rd fw</div>
   		</li>					</ul>
   
   					<ul class="xoxo">
   						<li id="text-6" class="widget-container widget_text">			<div class="textwidget">4th FW</div>
   
   		</li>					</ul>

   If this about how it works or am I missing something?

   Thanks, David

2. sixhours
   Member
   Posted 7 months ago #

   You can target the areas using the unique list item ID, ie. li#text-3, li#text-4, li#text-5, etc.

3. word-wiz
   Member
   Posted 7 months ago #

   Hi 6 hrs,

   I did not test but thought the order of these ids look a bit random. What would happen if the widget was removed then reapplied, would the id change? I thought the 4 widgets in the footer would be clearly identified to allow them to be styled.

   Thanks.

4. alchymyth
   The Sweeper
   Posted 7 months ago #

   twenty ten's footer widget areas have individual css ids - #first, #second, #third, and #fourth;

   for instance:
   

   <div id="first" class="widget-area">
   					<ul class="xoxo">
   						<li id="text-6" class="widget-container widget_text">			<div class="textwidget">first footer widget area text</div>
   		</li>					</ul>
   				</div><!-- #first .widget-area -->

   if you really have added one textwidget per footer widget area (however, your code does not look like it) then you should be able to style them with, for example:

   #first .textwidget { ... }
   #second .textwidget { ... }
   etc

5. word-wiz
   Member
   Posted 7 months ago #

   Hi alchymyth, yep the bare bones theme had stripped the divs out with the first, second etc

   Thanks.

Reply

You must log in to post.