Как добавить избранный элемент в меню WordPress

В этом уроке мы увидим, как мы можем добавить избранный пункт меню.

Мы можем использовать его, чтобы указать, что элемент новый или что-то еще, что вы можете придумать.

Мы также собираемся сделать это без каких-либо плагинов, мы собираемся сделать это с небольшим количеством кода CSS, который вы найдете в этом же руководстве.

В результате вы получите следующее:

Если вы не подписаны на Премиум-зону, вы можете дать зарегистрируйтесь за 10 евро в месяц здесь

Вот видеоурок:

Первое, что мы собираемся сделать, это добавить код CSS в меню настройки -> Дополнительный CSS и добавить следующий код:

.menu-badge {
font-size: 9px;
margin-left: 4px;
position: relative;
top: -10px;
margin-bottom: 13px;
color: #ffffff;
background-color: #FF0000;
padding: 3px 4px;
border-radius: 3px;
}
.badge-bounce {
animation: bouncing .8s cubic-bezier(0.1,0.05,0.05,1) 0s infinite alternate both;
}

@keyframes bouncing{
    0%{top:-6px}
    100%{top:-10px}
}

Теперь, когда у нас есть добавленный код, мы идем в Внешний вид -> Меню и отображаем элемент, который мы хотим выделить и добавить в поле. навигационная метка следующий код:

<span class="menu-badge badge-bounce">NUEVO</span>

Как видите результат очень классный и для его достижения мы не использовали плагин, мы сделали это вручную.

Помните, лучший плагин тот, который не установлен 😉

Надеюсь, вам понравилось, увидимся в следующем уроке.