How to add my own personal menu label
Flatsome comes with nice clean pre-made menu labels, the documentation on how to use/activate them per menu item can be found here Menu dropdown
In order to create your own custom labels, a little bit of CSS is needed. e.g. the CSS to create a new purple colored label with the content `Purple`
Custom CSS:
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Code goes in style.css of your child theme or Advanced > Custom CSS | |
| */ | |
| .label-purple.menu-item > a:after { | |
| content: 'Purple'; /* Change text */ | |
| display: inline-block; | |
| font-size: 9px; | |
| line-height: 9px; | |
| text-transform: uppercase; | |
| letter-spacing: -0.1px; | |
| margin-left: 4px; | |
| background-color: #572fbd; /* Change color */ | |
| font-weight: bolder; | |
| border-radius: 2px; | |
| color: #fff; | |
| padding: 2px 3px 3px; | |
| position: relative; | |
| top: -2px; | |
| } |