WordPress Help

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.
  1. Sign in to WordPress.
  2. 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.
  3. In the left-side menu, select Additional CSS.
  4. In the field below, enter the CSS code you wish to use.
  5. 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.
After that, visit your site in a private browsing mode in Chrome, Firefox, or Edge.

More info