- This topic has 3 replies, 2 voices, and was last updated 4 years, 6 months ago by
.
-
Posts
-
Hi Wes! I would like to add a little > arrow on my dropdown menu.
https://movingintoharmony.com/practice/
Under OUR PRACTICE, the item OUR PERSPECITVE has 3 sub pages, but one cannot tell without the little arrow. Can you please advise on how I might add that? Thanks so much!
Here’s a few tutorials that show how to do it.
https://amethystwebsitedesign.com/how-to-add-arrow-indicators-to-genesis-navigation-menus/
https://docs.cobaltapps.com/article/170-how-to-add-font-awesome-icons-to-your-custom-menu-items
https://www.billerickson.net/code/add-arrows-to-menu-items/
You may have to make some CSS adjustments if you need it to look a certain way, but these all should work by default.
If you want to try some other tutorials just let me know. There are a few different ways to do it.
Thanks Wes, super articles! I followed the first one and added arrows. I wish that the top level arrows would point down like V
I do like how the 2nd-level arrows point out like >
https://movingintoharmony.com/
Do you by chance know how I might do that? This is the code I added:
/* Menu Dropdown arrows
——————————————— */.genesis-nav-menu > .menu-item-has-children > a:after {
content: “\f347”;
display: inline-block;
-webkit-font-smoothing: antialiased;
font: normal 16px/1 ‘dashicons’;
padding-left: 3px;
vertical-align: top;
}.genesis-nav-menu .menu-item-has-children > a:after {
content: “\f345”;
display: inline-block;
-webkit-font-smoothing: antialiased;
font: normal 16px/1 ‘dashicons’;
padding-left: 3px;
vertical-align: top;
}
- You must be logged in to reply to this topic.