How to Add a Button to WordPress Menu | Standard & Blinking Button | Using CSS | Manual Coding

Опубликовано: 12 Апрель 2021
на канале: BlogVwant - A Vlog for Bloggers
1,852
5

So do you want to add a button to WordPress Menu, right? We will show you 2 practical methods to put a standard as well as an attractive blinking button on your WordPress menu. More details: https://www.blogvwant.com/add-a-butto...

00:00 Introduction
00:43 Method 1: Add Standard Button to WordPress Menu
02:43 Method 2: Add Blinking Button to WordPress Menu


Method 1: Standard Menu Button CSS Code

Note: Replace the nav-button in the below code if you have mentioned the different “CSS class name” for your menu item which you wanted to convert into a button.


@media (min-width:769px) {
.main-navigation .main-nav ul li.nav-button a{
color: #ffffff;
line-height: 35px;
border-radius: 5px;
background-color: #000000;
}
}

Method 2: Blinking Menu Button CSS Code

Note: Remember if your menu item CSS class name is different, then make sure to replace it with nav-button

@media (min-width:769px) {
.main-navigation .main-nav ul li.nav-button a {
color: #ffffff;
line-height: 35px; /*this number will likely need to be adjusted*/
border-radius: 5px;
-webkit-animation: colorchange 1s infinite alternate
}
}
@-webkit-keyframes colorchange {
0% {
background-color: #f16334;
}

50% {
background-color: #f16334;
}
100% {
background-color: #000000;
}
}



--------------------
Subscribe:    / @blogvwantavlogforbloggers  
---------------------
Blog: https://www.blogvwant.com
---------------------
Facebook page:   / blogvwant  
----------------------


Смотрите видео How to Add a Button to WordPress Menu | Standard & Blinking Button | Using CSS | Manual Coding онлайн, длительностью часов минут секунд в хорошем качестве, которое загружено на канал BlogVwant - A Vlog for Bloggers 12 Апрель 2021. Делитесь ссылкой на видео в социальных сетях, чтобы ваши подписчики и друзья так же посмотрели это видео. Данный видеоклип посмотрели 1,852 раз и оно понравилось 5 посетителям.