Hey there Naveen Naik,
How are you doing today?
I’ve checked the theme that you’re using and as it uses Font Awesome icons you can use that and place an arrow icon as an after element to menu items that have dropdowns.
To do that you can try adding the following CSS to either your child theme or by using the following plugin:
http://wordpress.org/plugins/simple-custom-css
.menu-item-has-children:after {
font-family: FontAwesome;
content: "\f078";
margin: 0 7px 0 -7px;
}
I’ve tried using your theme custom CSS tab but it is having issues with stripslashes so the content part wont work. This should be the result http://screencast.com/t/ekwCItm6.
Hope this helps 🙂
Cheers,
Bojan – WPMU DEV
Hello Bojan,
Thanks for your reply. I tried your piece of code by downloading the plugin and adding your code in it.
The arrow is not added in the menu.
Below is the link to my website.
http://www.linktodestination.in
The website is still under construction and may have some bad looking pages.
I am not sure if i am doing something wrong.
Hey again Naveen Naik,
I’ve checked your site and I can’t see the code added there, are you using any caching on your site, for example caching plugins? If yes can you please try clearing cache?
If not where exactly are you adding the code, can you take a screenshot of the code and where you’re adding it so I can take a look?
Cheers,
Bojan
Hi Bojan,
I am not using any caching plugin.
I cleared by browser cache and tried again but cannot find the arrow.
Steps taken by me to add the code.
1) Downloaded and activated the plugin simple custom css
2) Added your piece of code by navigating Appearance/Custom CSS
.menu-item-has-children:after {
font-family: FontAwesome;
content: "\f078";
margin: 0 7px 0 -7px;
}
3)saved this.
4) cleared browser cache.
I also tried on different browsers but no luck :(.
I don’t find an option to attach a screenshot in the post.
Sorry for my limited knowledge as i am using this forum for the first time
Hey again Naveen Naik,
That’s pretty odd.
You can use apps such as this one to upload screenshots to screencast.com and paste the links here.
Which version of the theme are you using, I’ve tested this multiple times on my end and everything works just fine, see video here: http://screencast.com/t/eCg1RB6ZYA.
Which version of the theme are you using?
Best regards,
Bojan
Hey again Naveen Naik,
Quick update, I just figured it out when I was about to close your site, the menu item selector is not the same on your site and on my sandbox site, please try adding this instead:
.page_item_has_children:after {
font-family: FontAwesome;
content: "\f078";
margin: 0 7px 0 -7px;
}
Sorry about this, I just assumed it is the same as I was testing the same theme.
Hope this one works 🙂
Cheers,
Bojan
Hello Bojan,
Thanks for your efforts. The down arrow is now visible in the menu. I have a small problem now. The arrow is now also visible in the middle footer at the bottom of the page. refer screenshot.
http://screencast.com/t/PQyq5oiMexV
Hey again Naveen Naik,
Glad to hear that code is working now.
We can target page items only in the header by changing the selector a bit, please replace the code with the following:
#top-header .page_item_has_children:after {
font-family: FontAwesome;
content: "\f078";
margin: 0 7px 0 -7px;
}
This should fix the issue in the footer.
Hope this helps 🙂
Cheers,
Bojan
Hey Bojan,
It works perfectly now. You are a rockstar. Thanks for all your efforts and quick help. Thank you very much. Have a nice daya ahead. I will close this topic.
Thanks for the kind words 🙂 Glad I could help and have a great day too!
Cheers,
Bojan
