Я согласен в основном с тем, что говорит @thirtydot, поскольку, вероятно, существует более простой способ WP добавить класс к активной ссылке ... но, следуя своей логике, вы можете сделать все это намного проще.
СначалаCSS.хотя я скопировал немного больше из вашего файла подкачки, вы можете удалить все эти повторяющиеся объявления, так что единственное, что нужно каждой конкретной ссылке, это background-image .. исходный размер, background-position и т. д. не изменяютсячто-то вроде этого облегчает чтение:
#sidenav {
width:204px;
list-style:none;
margin:0;
padding: 0;
padding-bottom:40px;
float:left;
}
#sidenav li {
float:left;
width: 100%;
}
#sidenav li a {
display: block;
height:53px;
background-repeat: no-repeat;
background-position: 0 0;
text-indent: -9999px;
}
#sidenav li a:hover {
background-position: 0 -53px;
}
#sidenav li.visionside a {background-image : url(http://jumpthru.net/newsite/wp-content/themes/twentyten/images/side/vision2.png);}
#sidenav li.teamside a {background-image : url(http://jumpthru.net/newsite/wp-content/themes/twentyten/images/side/team2.png);}
#sidenav li.mtlside a {background-image : url(http://jumpthru.net/newsite/wp-content/themes/twentyten/images/side/mtl2.png);}
#sidenav li.blogside a {background-image: url(http://jumpthru.net/newsite/wp-content/themes/twentyten/images/side/content2.png);}
#sidenav li.orgside a {background-image: url(http://jumpthru.net/newsite/wp-content/themes/twentyten/images/side/org2.png);}
теперь вашему «активному» состоянию нужна только одна релевантная ссылка, чтобы его background-position было изменено на 0 -106px - не нужно повторно объявлятьизображение снова
так что ваша логика PHP может быть такой (возможно, даже проще), но я пытаюсь использовать то, что у вас есть:
<?php
if ( is_page('vision') ) { $current = 'visionside'; }
elseif ( is_page('team') ) { $current = 'teamside'; }
elseif ( is_page('???') ) { $current = 'mtlside'; }
elseif ( is_page('commentary') ) { $current = 'blogside'; }
elseif ( is_page('organizations') ) { $current = 'orgside'; }
?>
Примечание: та же переменная используется (и вопросдля вашей ссылки mtlside нужно будет пометить метки), а затем строку в стилях <head> нужно будет прочитать:
#sidenav li.<?php echo $current ?> a {
background-position: 0px -106px;
}
Таким образом, это будет только одна ссылка, которая получает более конкретный показфоновая позиция "активной страницы".
Я не уверен, что вы на самом деле хотите, чтобы ваше наведение делало, но правило a:hover не будет переопределять новый "активный" селектор, потому что правило в стилях <head> выше более конкретное, есливы действительно хотите, чтобы активная ссылка показывала то же состояние :hover, что и обычное, вам нужно сделать правило a:hover в таблице стилей более конкретным, что вы можете сделать следующим образом:
#sidebarnav #sidenav li a:hover {
background-position: 0 -53px;
}
примечание, которое я удалилдвойные ID из селекторов таблиц стилей, поскольку в них нет необходимости, один идентификатор достаточно уникален ... но тогда вы можете использовать второй идентификатор (#sidebarnav), если требуется, чтобы последнее правило "весило" больше, еслитогда требуется конкретность.