Как изменять атрибуты пунктов выпадающего меню без ссылки в пользовательском меню WordPress?

Question

Как изменять атрибуты пунктов выпадающего меню без ссылки в пользовательском меню WordPress?

7 апр. 2012 г., 01:45:49

Просмотры: 143

Голосов: 0

Мне нужно изменить цвет некоторых пользовательских ссылок в выпадающем меню моего пользовательского меню WordPress здесь. В моем выпадающем меню есть 3 пункта, которые не имеют связанного URL:

Воздуховод
Дымоход
Сушильный канал

Они будут просто заголовками для других пунктов выпадающего меню под ними.

Мне нужно иметь возможность изменять их атрибуты, такие как цвет, семейство шрифтов, размер и т.д.

Я пытался создать классы menu-item-type-custom и menu-item-object-custom и даже menu-item-####, но это не сработало... :( Пожалуйста, помогите!

Acidon

147

меню css

Комментарии

Зачем использовать CMs для этого?

onetrickpony

7 апр. 2012 г. 01:50:58

что ты имеешь в виду?

Acidon

7 апр. 2012 г. 01:52:02

Мне нужно создать выпадающий список как здесь - http://bit.ly/okHDHb (смотрите раздел Services)

Acidon

7 апр. 2012 г. 01:54:03

Понял, значит эти элементы работают как заголовки для группы пунктов меню

onetrickpony

7 апр. 2012 г. 01:55:55

Да, именно так. Какой лучший способ реализовать это? Мне нужно иметь возможность стилизовать именно эти заголовки.

Acidon

7 апр. 2012 г. 01:59:38

Все ответы на вопрос

Комментарии

Я создал класс "gh": .gh {color: red;}
.gh A:link {text-decoration: none; color:red;}
.gh A:visited {text-decoration: none; color:red;}
.gh A:active {text-decoration: none; color:red;}
.gh A:hover {text-decoration: none; color: red;} , но по какой-то причине он всё равно отображает стандартный стиль выпадающего списка. Есть ли какой-то специальный CSS, который я должен использовать для этого класса?

Acidon

7 апр. 2012 г. 02:13:53

Возможно, его переопределяет класс ul ul li?

Acidon

7 апр. 2012 г. 02:26:52

Класс применяется к элементам списка, поэтому используйте его так: li.gh a{color:red;} и так далее. Некоторые псевдоклассы могут не учитываться, потому что элемент является якорем.

onetrickpony

7 апр. 2012 г. 02:28:03

Сейчас у меня в style.css прописано: .gh {color: red;} .gh a{color:red;} .gh a:hover {color:red;}. В инструментах разработчика я вижу, что стиль применяется к элементу, но внешний вид не меняется.. Я вижу, что есть и другие классы, возможно они переопределяют класс gh?

Acidon

7 апр. 2012 г. 02:37:34

Может быть.. Попробуй #top-menu ul li.gh a{color:red;}

onetrickpony

7 апр. 2012 г. 02:44:20

Показать остальные 2 комментариев

Другой способ, используя фильтр, если вы хотите сделать это программно:

add_filter('nav_menu_css_class', function($classes, $item, $args){

  if(empty($item->url))
    $classes[] = 'your-header-class';

  return $classes;

}, 10, 3);

Но вам следует использовать решение keatch :)

onetrickpony

13.6K

7 апр. 2012 г. 02:05:50

Комментарии

да, я как раз читал про хук wp_nav_menu_items перед тем, как создать эту тему.. Ты прав, я очень надеюсь, что получится заставить работать пользовательские css-классы меню

Acidon

7 апр. 2012 г. 02:20:57

кстати, в какой файл мне нужно добавить твой фильтр?

Acidon

7 апр. 2012 г. 02:24:05

keatch 2.6K · Accepted Answer · 2012-04-07T01:58:36Z

Включите опцию CSS Classes (Настройки экрана -> Флаг CSS Classes) и используйте её для настройки каждого пункта меню, который должен быть оформлен особым образом.

Конечно же, вы должны использовать Пользовательское меню.

keatch

2.6K

7 апр. 2012 г. 01:58:36