- Home
- Help & Support
- Developer
- Styling Your Menu Output
Styling Your Menu Output
ButterMenus includes a default stylesheet (butter-menus.css) that styles basic menu layouts. Fonts, colors, and sizing will be inherited and match your theme automatically.
To customize appearance:
- Add your own CSS in your theme or customizer.
- Override or extend the default class names (e.g. .butter-menus, .butter-menu-item).
This lets you match the menu look to your site branding.
Example Classes
.butter-menus
.butter-menu
.butter-menu-name
.butter-menu-group
.butter-menu-group-name
.butter-menu-item
.butter-menu-item-image
.butter-menu-item-body
.butter-menu-item-title
.butter-menu-price-leaders
.butter-menu-item-price
.butter-menu-item-price-below
.butter-menu-item-sizeprices
.butter-menu-item-sizeprice
.butter-menu-item-sizeprice-name
.butter-menu-item-sizeprice-div
.butter-menu-item-sizeprice-price
.butter-menu-item-name
.butter-menu-item-desc
.butter-menu-item-tags
.butter-menu-item-tag
.butter-menu-item-calories
.butter-menu-center
.butter-menu-item-price-inline
.butter-menu-cards
.butter-menu-items
.butter-error
.butter-notice
.butter-menu-group-level-2
.butter-menu-group-level-3

