I have a menu Item, and I added a custom css class so I could modify it like so:

enter image description here

In Firefox's F12 developer tool, when I look up testphpmenuclass I find it just fine here:

enter image description here

So I create a Custom Module (on every tutorial, other people use "Custom HTML module" but I can't find this mysterious module that everyone else has access to but me.)

enter image description here

Then I add code for adding css I found directly from the Sourcerer FAQ website

   $css = "
      .testphpmenuclass {
         display: none !important;
   $doc->addStyleDeclaration( $css ); 

Then I save the module, and go to my index page, and add the module like so:

enter image description here

Then I visit my website, and the menu item is still there.

enter image description here

Before you tell me maybe the addon doesn't work, I tested a printf function in the php section, and the printf function works:

enter image description here

And here is the code:

enter image description here

So trying all this, what other method can I do to hide a menu item?

My hopes is to do this conditionally (if user visits at a certain time of the day, show, otherwise hide it, etc)

3 Answers 3


It looks like you have a typo in your CSS. Your code section at the beginning is fine, but the screenshot at the end of your post is showing incorrect use of the !important rule.

The semi colon should be placed after !important, not before:

display: none!important;

In addition, make sure the CSS rule is actually applied (use the code inspector by right-clicking your menu item and select "Inspect" or similar from the dropdown menu).

Finally, if it still doesn't work, you could try using jQuery to hide the menu item. Place the following code inside your <script></script> tags:


The code will add an inline style <li style="display: none;"> which should override any other CSS settings.

  • This worked for me, thank you! I would upvote you if I had the rep but I don't, so I hope an accepted answer is enough for you.
    – arsarc
    Jul 27, 2018 at 21:38
  • @arsarc - I'm glad it worked. And welcome to JSE!
    – johanpw
    Jul 27, 2018 at 22:29

Assuming this is your full code, $doc is undefined. Add this before using it:

$doc = JFactory::getDocument();

Also, this is a very weird way of adding CSS. You could do this in the template instead.

  • Unfortunately this did not work. In addition, the extension faq link "Sourcerer already creates the $document (or $doc) object for you when it is needed. So you do not have to initialize this yourself."
    – arsarc
    Jul 27, 2018 at 20:49

I think you can also hide a menu item by simply setting an access level for the menu item. For example if the user is logged in with x permissions then make it visible. If not then hide. You can also set modules to show on certain pages, both methods should work.

Hope this helps

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.