В този пост ще опиша как може да си добавяте икони в главното Меню.
Списък с кодовете на иконите може да намерите тук – The Elegant Icon Font – 360 Of The Best Free Icons For The Modern Web
|
nav li a:before { |
|
font-family: ‘ETMODULES’; |
|
content: ’24’; |
|
text-align: center; |
|
vertical-align: middle; |
|
margin-right: 10px; |
|
margin-left: –10px; |
|
color: #2cba6c; |
|
font-size: 1em; |
|
transition: all .3s ease; |
|
} |
По този начин се добавят икони във всички менюта (еднакви).
За да добавите специфична икона за всяко едно меню или под меню поставяте следния снипет в Divi – Theme Option – Custom CSS
Снипет за добавяне на икона в под меню –
За целта първо създаваме CSS Class в Apperance – Menu и задаваме съотвения къстъм клас. Тук в случая и трите ще са с еднаква икона, но ако желаете може да създадете за всяка една поотделно с различен клас.
| .shoes-icon> a:before { |
| font-family: ‘ETMODULES’; |
| content: ‘e015’; |
| text-align: center; |
| vertical-align: middle; |
| margin-right: 10px; |
| margin-left: –10px; |
| color: #2cba6c; |
| font-size: 1em; |
| transition: all .3s ease; |
| } |
Снипед за добавяне на икона в специфично меню
По същия начин добавяте къстъм CSS Class за всяко едно меню поотделно
След това добавяте следния код в Divi – Theme Option – Custom CSS
| .home-icon-menu> a:before { |
| font-family: ‘ETMODULES’; |
| content: ‘e074’; |
| text-align: center; |
| vertical-align: middle; |
| margin-right: 10px; |
| margin-left: –10px; |
| color: #2cba6c; |
| font-size: 1em; |
| transition: all .3s ease; |
| } |
И ще изглежда по следния начин
По следния начин ще изглежда когато се добавят икони за всяко меню поотделно
kampungbet kampungbet kampungbet