This module provides a map area on the site pages. You can search for listings using keywords, filter using categories, or addresses to locate the listings. You can also add custom pin icons for each category for easy identification.
The JomDirectory Maps module upon activation is seen as follows on the pages:
Screen 1: JomDirectory maps screen
Editing the JomDirectory Map Module
To edit the module, click on the module link or select the checkbox next to the module name, and then click Edit.
The following image shows the module edit screen.
Screen 2: Module tab
This tab controls the layout where the maps panel is to be displayed on the screen.
Screen 3: Module tab
Provide the options as per the following table.
a maximum number of pins that can be displayed on the map.
Percentage of map width.
Map height on the page in pixels.
Enable to show category as a search parameter.
Enable to show the address as a search parameter.
Enable to show the keyword text area.
Show or hide the title for the search panel.
Select the position based on your Joomla Template.
Select the status of the module:
Provide a date when the map panel should be published.
Provide a date when the map panel should be unpublished.
Provide access level for the panel.
Provide the order in which the side panel should appear. If more than one module is positioned at the same location, you can set the order of appearance in this field.
Select the language for which you want to display this panel. For each language, you must create a new JomDirectory Search module.
Provide additional information.
Menu Assignment tab
This tab controls where the module should be displayed. You can decide if it should be displayed on all pages for the site or just selective pages.
Screen 4: Menu Assignment tab
Select the required menu for module assignment. The available options are:
- On all pages
- No pages
- Only on the pages selected
- On all pages except those selected
For the last two options, the screen is as shown in the following image:
Screen 4: Menu Assignment options tab
Modifying map to full-width
If the template you are using does not support a full-width display, use the following configuration tips and tricks to display it in full width. You need to edit the current Joomla theme CSS, such as layout.css and insert the following lines of code.
This code will move the map in absolute position. But, the module location will now include no space and the page content will be displayed below the map. This empty space needs to be filled by setting the height to the value of the map height.
To create this space, we need to create a Custom HTML module and place it in the same position as where the map needs to be seen. You need to edit HTML and create a div with the height same as the map:
After this configuration, the map will be displayed in a full-width mode as seen in the image shows above (refer the first section). Other styling elements can also be added as per your requirement to the layout.css file.
Creating custom category markers
When any listing is displayed on the map, it is shown as a pin. This pin icon is as in the default template. To modify this pinned icon as per your category, marker image needs to be placed under module images directory:
The file name should be same as the category. The spaces need to be replaced with dashes " - " and the "marker" prefix. So, suppose category name is Auto Parts, then the file name for the marker should be marker_auto-parts.png.