Thursday, June 15, 2017

how to change background color of single menu item



If your template does not include a Custom CSS option, try adding the CSS to the end of your templates CSS file.
  1. Within your Joomla administration navigate to the menu which contains the menu item you wish to style (Menus -> [YourMenu]).

  2. Joomla assigns a unique ID to each menu item. We are going to use this ID when styling the item. Under the ID column of your menu items, take note of the ID for the menu item you wish to style (Eg. 507).

    menu item ID
  3. Using your menu item ID we will add some CSS to your template using the 'Custom CSS' field of your templates parameters. Navigate to Extensions -> Templates and click in to your template settings. Select the 'Custom CSS' tab and add the following CSS to the field provided, editing the ID to match that of your menu item and the color to your own taste.

    .item-507, .item-507 > a { color: #D14233 !important; }
     
  4. Hit 'Save & Close' to apply your custom CSS.

No comments:

Post a Comment