I want to add a media-field to the menus settings to pick an image for each menu item and output this as open graph images. I see two options:

  1. I add the field to the tab "Metadata" which then will be outputted via \libraries\src\Document\Renderer\Html\HeadRenderer.php. But i do not know where i can add fields to that tab.
  2. I add the field in my custom (category blog) layout xml-file and then somehow get it in my template index.php but i do not know how to get access to the field there and documentation says:
    "Note that if you add new parameters, these can be used in the layout file but will not be used in the core model or view files."
    Would i somehow have to put my field in the layout file to use it in my index.php?
  • If you have a page with two or more menu items on it with your planned open graph metadata then you will end up with a page header with with more than one set of open graph tags which may not be what you desire or need. As i understand it you use Open graph to tag a single article not a link to an article or group of articles. You can explain a bit more about the problem you are trying to solve as your two solutions above don't seem right to me.
    – Irata
    Commented Jul 26, 2020 at 1:49
  • yes, i do not want more than one open graph image tag in the header. only the one from the shown menu item in its header, like the other metadata tags work (f.e. meta description or robots). i do not want to set the open graph tag for articles but for menu items, since all my pages are built with category blog menu items. does this help?
    – Mano Meter
    Commented Jul 26, 2020 at 5:50
  • Looking at Open graph it doesn't seem that going to a menu or list of blog items is what it is intended to do, they want a direct link to a single article or type. If you went with Grant G answer of a plugin to handle this you would need extra code before the <head> tag is compiled to determine the active menu and then get get the params for the metatag from the correct menu and push that into the header. There is already a media field to select and image for the Menu item but you would need to use CCS to hide it if you don't want to actually display it on your page and just in the OG tag.
    – Irata
    Commented Jul 26, 2020 at 9:04
  • i do not talk about any kind of blog i just use the category blog to organise my pages with categories and articles. every page on my websites has a menu item, thats why i want to handle it here.
    – Mano Meter
    Commented Jul 26, 2020 at 10:39
  • Then I think you will be up for creating a a reasonably involved Plugin as per the answer by Grant G.
    – Irata
    Commented Jul 26, 2020 at 12:01

2 Answers 2


To add the fields to the com_menus item Metadata tab, you would need to write a content plugin to inject the fields.

Your Option 2 sounds clunky. In this case, I expect you would need to create a new filed in your category layout xml, then instantiate menus, loop through categories and insert into the menu based on the category IDs. Option 1 is the go-to solution for this problem.

  • okay, thank you. i will give it a try to write a content plugin.
    – Mano Meter
    Commented Jul 25, 2020 at 5:56
  • If you go with the first solution of creating a content plugin you should to understand that you will need three triggers. One to display your extra fields in the com_menu page(onContentBeforeRender most likely) then you need to Save the additional fields(onContentBeforeSave maybe?) into the params for that menu item and then you need retrieve from the params of the menu item and insert them into the page header whenever the menu is included(onBeforeCompileHead).
    – Irata
    Commented Jul 26, 2020 at 1:59

The solution was a plugin with two functions:

  1. onContentPrepareForm to add the form with a media field.
  2. onBeforeCompileHead to add a custom tag for the og-image.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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