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 »

Widget links


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 Jun 14, 2010, 10:47 PM
Caryn Inspired Raw
 
28 posts · Jul 2009
I've used ATO Widget List options to set widget hover colors and also tried CSS, but am not seeing anything at http://flow-dynamix.com/free-resources-to-get-unstuck/.

Might it have anything to do with the Flexipages widget? If so, I know I need to follow-up with the author. I did have the hover color when I started but lost it. I'm inclined to think it's more my own lack of knowledge rather than the plug-in, though.

I'm using 3.4.6 and here's what I tried on the CSS based on another thread I read. Most of the CSS is re: the bullets, but I thought it might be important to show it all. If there's an answer for hover, I'll hope to apply it to active, as well, which is why you see the repetitive CSS sections.

div.widget ul li a:link {
border-left: 0 !important;
padding-left: 0 !important;
}
div.widget ul li a:visited {
border-left: 0 !important;
padding-left: 0 !important;
}
div.widget ul li a:active {
font-weight: bold ! important;
border-left: 0 !important;
padding-left: 0 !important;
}
div.widget ul li a:hover {
color: #01857D !important;
font-weight: bold ! important;
border-left: 0 !important;
padding-left: 0 !important;
}
div.widget ul {
/* for other styles, try "disc" and "square" instead of "circle" */
color: #00A79D;
list-style-type: disc !important;
padding-left: 0;
margin-left: 0;
}
div.widget ul li {
/* 1.35 or more required for Safari or bullets too wide on the left */
margin-left: 1.35em;

/* overwrite existing display:block Firefox */
display: list-item;
}
div.widget ul li ul{
list-style-type: none !important;
}

Thanks!
Caryn
  #2  
Old Jun 14, 2010, 11:38 PM
lmilesw's Avatar
lmilesw
 
10,097 posts · Jul 2009
Central New York State USA
Are you using Chrome or Safari. Those two don't show the hover state but Firefox and IE 8 do.
__________________
~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 Jun 14, 2010, 11:41 PM
Caryn Inspired Raw
 
28 posts · Jul 2009
Thanks so much, Larry! Yup, Safari user here. Happy to see the hover in Firefox and I'll have my Explorer-using partner check it out. Still not clear if I can work the active link, but this is a great step forward. Much appreciated... especially at this hour!

Best,
Caryn
  #4  
Old Jun 15, 2010, 03:32 AM
juggledad's Avatar
juggledad
 
22,250 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
...ummm...Hover most certainly does works in Safari and I expect in Chrome also. The order of the psuedo class is very important. Taken from w3schools.com
Quote:
Note: a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective!!

Note: a:active MUST come after a:hover in the CSS definition in order to be effective!!
you need to re-order your css so the active comes last.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Jun 15, 2010, 08:03 AM
Caryn Inspired Raw
 
28 posts · Jul 2009
Ah, LoVe-HAte order. Shame on me for not remembering. Safari's still not cooperating, but since that's likely a small part of audience (primarily business people), I'm not too concerned.

So the hover works great in Firefox (Mac) and Explorer (PC), but still no luck with the active, which I'd love to see as bold to reinforce where people are in the nav -
div.widget ul li a:link {
border-left: 0 !important;
padding-left: 0 !important;
}
div.widget ul li a:visited {
border-left: 0 !important;
padding-left: 0 !important;
}
div.widget ul li a:hover {
color: #D5B35E!important;
font-weight: bold ! important;
border-left: 0 !important;
padding-left: 0 !important;
}
div.widget ul li a:active {
font-weight: bold ! important;
border-left: 0 !important;
padding-left: 0 !important;
}
  #6  
Old Jun 15, 2010, 08:45 AM
juggledad's Avatar
juggledad
 
22,250 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
the last two of your css inserts are causing a conflict, remove
HTML Code:
div.widget ul li {
margin-left:1.35em;
display:list-item;

}

 div.widget ul li ul {
list-style-type:none
}
or just put an 'x' at the begining and see what happens
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #7  
Old Jun 15, 2010, 10:59 AM
Caryn Inspired Raw
 
28 posts · Jul 2009
That indeed restored hover to Safari... but I lost my bullets, which I think are more important, but I'll consider.

Didn't seem to have any impact on Firefox and the active link format.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Changing the Links Widget appearance cactus02 Sidebars & Widgets 3 Oct 5, 2009 01:51 PM
[SOLVED] Help ! Links broken in widget in new widget area mikecnwa Sidebars & Widgets 4 Sep 16, 2009 01:56 PM
Using same links widget for two different lists AnnaMalena Sidebars & Widgets 2 Jul 18, 2009 03:56 PM
How to edit links widget or how to have links in sidebar of page? Joelb53 Sidebars & Widgets 1 May 6, 2009 03:52 AM
How to change the title on links widget? Joelb53 Sidebars & Widgets 2 Apr 15, 2009 08:02 PM


All times are GMT -6. The time now is 11:53 AM.


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