19 июня, 2022

Стилизуем один из пунктов меню

Привет, друзья! Сегодня меня спросили, как изменить один из пунктов меню в Elementor и я решил написать небольшую статью по этому поводу.

Существует несколько способов решения данной проблемы:

  • при помощи css;
  • jquery

В этой статье мы рассмотрим первый, на мой взгляд, самый простой способ — при помощи css.

Меняем стиль ссылки меню

Итак, создадим меню (как создать меню читайте здесь) и вставим его при помощи виджета в Elementor.

Стилизуем один из пунктов меню

Как видите, все пункты однотипны: цвет текста пунктов белый, а при наведении желтый.

Но вдруг мы хотим, чтобы цвет Пункта меню без ссылки был по умолчанию красным. Для этого откроем консоль разработчика в браузере (кнопка F12 на клавиатуре)

Стилизуем один из пунктов меню

Нас интересует класс тега limenu-item-1390.

Заходим в раздел Пользовательские стили в виджете меню Elementor и прописываем следующий код:

selector li.menu-item-1390 a{
    color: red !important;
}

В итоге получим нужный резальтат

odin iz punktov menyu 003

Меняем стиль пункта меню

Если вам необходимо изменить стиль всего пункта меню, то нужно прописать следующий код:

selector li.menu-item-1390 {
    background-color: red;
    border-radius: 10px;
}

/*Мы убрали из кода тег ссылки*/

Результат аналогичного кода (только классы другие) вы можете видеть у нас на сайте у пункта «КУПИТЬ»:

odin iz punktov menyu 004

На вашем сайте классы элементов будут другие, смотрите их название в консоли разработчика в браузере

Вот и все, мы показали как стилизуем один из пунктов меню WordPress! Пункт меню теперь красный. Таким образом можно оформить пункт меню как вам угодно.

0

Интересные статьи

Секция Elementor. Вкладка Макет.

Секция Elementor. Вкладка Макет Общее описание секций, колонок и внутренних секций, позволяющих создавать нужную структуру шаблона страниц, мы рассмотрели в другой статье.

Читать полностью »

Announce

2019 collection

Let’s face it, no look is really complete without the right finishes. Not to the best of standards, anyway (just tellin’ it like it is, babe). Upgrading your shoe game. Platforms, stilettos, wedges, mules, boots—stretch those legs next time you head out, then rock sliders, sneakers, and flats when it’s time to chill.