Adding Custom CSS

You can put your CSS styles in any stylesheet that makes you happy. Your choice depends on an inherent trade-off in ease vs. maintainability.

Option 1: UberMenu’s Style Configuration > Custom CSS Tweaks (Control Panel)

If you have a small amount of CSS code to add, you can place it in your site head by adding it to Appearance > UberMenu > Style Configuration > Custom CSS Tweaks

Option 2: UberMenu’s custom.css

This is the recommended solution for significant customizations. Remember, custom.css is only loaded if you have the Style Application set to Custom in the UberMenu options. You’ll need to copy your preferred preset styles into this file, and add your custom styles as well. See Creating a Custom Skin for details. This is the best place from a maintenance perspective, because when you upgrade you’ll just need to preserve the custom.css file.

Option 3: A special place where you keep custom CSS.

If you have created (or if your theme provides) a special location for custom CSS styles, this is a great place for custom UberMenu styles as well.

Note: Just keep in mind that this stylesheet is likely loaded before UberMenu’s, so if you’re trying to override existing styles you’ll need to either use more specific selectors or use the !important flag in your styles.

Option 4: Your theme’s style.css

You might already be putting your customizations in your theme’s style.css. This is fine, just make sure you keep track of them. It’s best to keep them all in one place so you can easily transfer them if you upgrade your theme. Also, see the above note regarding specificity.

Option 5: UberMenu’s preset files


This is discouraged, because it will make it difficult to upgrade. If you want to edit or add to one of these files, copy it to custom.css first as described in Option 1.

Option 6: UberMenu’s basic.css


This is a core file. It should never be edited unless you have no intention of ever upgrading UberMenu

On this page