Is it possible to load the same module into two different positions and have it use two different IDs?

Question

While building a website, I came to the conclusion that I had two positions that included identical modules (Header and Footer). Both include the exact same menu and small blurb of text.

For the sake of time and efficiency, I tried to set it up so both positions loaded modules that were set to load in Header. However, this raises a problem; my menu requires a unique ID to run some JavaScript. Granted, I could modify the module to just create a random ID, but that's not garuanteed to be 100% unique.

Is there a way to modify the ID of a module loaded into Footer so that it's different from the duplicates in Header? Or am I stuck creating duplicates of the modules in Header for Footer?

Answer 1

This id attribute is an attribute attached to a certain element of the output of your menu module - it is an internal handling of your menu.

The module position in your template cannot define an id for an element that is used/gets created by any module, which is rendered in that position. Simply, the Module position/template doesn't know what is going to come out from the module it will render, in terms of the markup of the module will eventually will have.

It will be faster if you duplicate your modules and place them in 2 different module positions, but if that's a must requirement then the following solutions could be applied.

Solutions

I will use the core mod_menu as an example.
Adjust any of the below examples for your specific case/module.

Solution #1.

Check for $module->position in a Module's Template override.

EDIT: this solution won't work as described for this particular use-case. Better Check solution 2 and read bottom notes.

1. Create a template override for your module:

   templates/YOU_TEMPLATE/html/mod_menu/default.php 
   

2. Inside your template override check for the module's position like so:

   if ($module->position == 'bottom-position')
   {
     $idd = 'bottomMenuID';
   }
   else
   {
     $idd = 'normalMenuID';
   }
   

3. Then later in your menu code, replace the value of the ID attribute for your element with the $idd;

Solution #2.

Use JModuleHelper and override $module->params.

1. Create a template override for the mod_menu: Add this:

   templates/YOU_TEMPLATE/html/mod_menu/default.php 
   

2. Rename default.php to something like footermenu.php

3. Edit the footermenu.php template and change the id attribute on question to the one that you want to use for the second menu.

4. In your template, at the desired location where you want to display the menu for a second time:

   jimport( 'joomla.application.module.helper' );
   $module = JModuleHelper::getModule( 'menu', 'Main Menu');
   $module->params = '{"menutype":"mainmenu","base":"","startLevel":"1","endLevel":"0","showAllChildren":"1","tag_id":"","class_sfx":"","window_open":"","layout":"webxcon:footer","moduleclass_sfx":"","cache":"1","cache_time":"900","cachemode":"itemid","module_tag":"div","bootstrap_size":"0","header_tag":"h3","header_class":"","style":"0"}';
   echo JModuleHelper::renderModule( $module, $attribs );
   

Update

@Chaosxmk and anyone that might reach here having the same question:

Notes:

I have to admit, that I didn't try the above solutions and Actually you are right for Solution 1. In fact, solution 1 came to mind, while I was writing solution 2 after the point of using JModuleHelper -which at that point it made sense to me to say that I will ask the module to search for its position. I had forgotten at that point that you want to call the same module / same module position. So, solution 1 actually won't work as described above.

I am leaving solution 1 here as reference and because it presents how someone could check a module's current position from within a module and possibly provide further ideas to someone.