Change the menu appearance in WordPress with CSS
There are times when a theme's capabilities don't meet the design needs of your website. For example, you may wish to use a color that is not offered by default or move an element on the page a bit to the left or to the right. You can use CSS in your WordPress dashboard to make such changes.
Note: These CSS changes only apply to your currently active theme and will continue to work after theme updates without the need for a child theme. If you do switch the active theme, you'll need to apply your CSS changes again.
- Sign in to WordPress.
- On the left-side menu, select Appearance and then Customize.
Note: If you see Editor instead of Customize after you select Appearance, here's how to edit the menu design or add custom CSS in the new Site Editor.
- In the left-side menu, select Additional CSS.
- In the field below, enter the CSS code you wish to use.
- Select Publish.
Your changes are now visible on the edited menu across your entire site.
Note: If you don't see the changes when you reload your browser:
- If your site runs on Managed WordPress, clear the built-in cache this platform uses.
- If your site is not on Managed WordPress and you use a third-party caching plugin, clear the plugin cache. For assistance on how to do this, check the documentation for that particular plugin.
More info
- Check out detailed information on WordPress and CSS, including WordPress-generated CSS classes.