Hi @lajang
You can use custom CSS.
Access WordPress Customizer: In your WordPress admin dashboard, go to “Appearance” and click on “Customize.”
Navigate to Additional CSS: Look for an option like “Additional CSS” or “Custom CSS” within the Customizer.
Insert Custom CSS: Paste the following CSS code into the Additional CSS section:
css
.menu-item-has-children > a:after { content: ' →'; /* Unicode character for right arrow */ display: inline-block; margin-left: 5px; /* Adjust the margin as needed */ }
Adjust Styling (Optional): To adjust the distance between the text of the menu item and the arrow, change the margin-left attribute. Moreover, you have other customisation options for the arrow appearance according to your preferred style.
Preview and Publish.
This CSS code inserts a right arrow after the menu item text, targets menu items with a sub-menus (menu-item-has-children), and modifies the margin for spacing.
Thread Starter
lajang
(@lajang)
Hi MilesWeb
Thank you for your reply. I tried it, and it worked perfectly. Thank you so much, bro. I change the .menu-item-has-children to menu-item-2630 so the arrow will show only on the sub-menu item not on the main menu.
