# Menu Items

### Overview

In this section, we will learn how to create menu items to access JomEvents.

Menus are used to control website navigation and are a set of menu items. Menu items provide the navigational experience to your users. The menu items in our case must point to the JomEvents.

### Creating Administration Menu Links

<p class="callout info">This step is not needed if new installation being made.</p>

Go to the System -&gt; Administrator modules and insert new. Than choose Administrator Menu. From the presets, select Comdev and place it under menu position. Do the same for the JomEvents

[![screenshot-2021-12-22-19-30-33-536.jpeg](https://wiki.comdev.eu/uploads/images/gallery/2024-03/scaled-1680-/3q5screenshot-2021-12-22-19-30-33-536.jpeg)](https://wiki.comdev.eu/uploads/images/gallery/2024-03/3q5screenshot-2021-12-22-19-30-33-536.jpeg)

### Creating Menu Items to access JomEvents

<div bis_skin_checked="1" class="confluence-information-macro confluence-information-macro-note conf-macro output-block" data-hasbody="true" data-macro-name="note" id="bkmrk-creating-an-items-me"></div><div bis_skin_checked="1" class="confluence-information-macro-body" id="bkmrk--1"></div><p class="callout warning">Creating an Items menu link is mandatory. If you have a multilingual site, ensure that you create an Items menu link for each language. You can hide this menu link, but it needs to be create nonetheless. Though you are creating an Items link that does not point to any category or address, you can create other links with Items menu type that can point to an address or a category once main Items link has been created.</p>

To create menu items with Items menu item type, do the following:

1. Click **Menus** &gt; **&lt;your\_menu&gt;** &gt; **Add New Menu Items**.
2. Provide a title in our case is **Latest Listings** in the **Menu Title** field. Now, since the Latest Listings menu item provides a list of all the latest postings on the site, we have selected the menu type as Items. The Alias field will build URL for the site. When search is done this will be the landing page for the search results as well.
3. Provide the options as seen in the following image:  
      
    [![obraz.png](https://wiki.comdev.eu/uploads/images/gallery/2024-02/scaled-1680-/huVobraz.png)](https://wiki.comdev.eu/uploads/images/gallery/2024-02/huVobraz.png)
    
      
    **Screen 3:** Items menu item screen
    
      
    Provide the values based on the following table.
    
    <div bis_skin_checked="1" class="table-wrap">  
    </div>

1. <div bis_skin_checked="1" class="table-wrap"><table class="wrapped confluenceTable tablesorter tablesorter-default stickyTableHeaders" role="grid" style="padding: 0px;"><tbody aria-live="polite" aria-relevant="all"><tr role="row"><td class="confluenceTd">**Menu Item Type**
    
    </td><td class="confluenceTd">Click **Select**. A pop up is displayed. In this case, since we are creating the Items menu item, click **JomEvents** &gt; **Items** from the list.
    
    </td></tr><tr role="row"><td class="confluenceTd">**Category**
    
    </td><td class="confluenceTd">Select the appropriate category, if creating direct category link.
    
    </td></tr><tr role="row"><td class="confluenceTd">**Address**
    
    </td><td class="confluenceTd">Select the appropriate address if, creating direct address link.
    
    </td></tr><tr role="row"><td class="confluenceTd">**Link**
    
    </td><td class="confluenceTd">This field is auto populated based on the menu item type selected.
    
    </td></tr><tr role="row"><td class="confluenceTd">**Target Window**
    
    </td><td class="confluenceTd">Select the parent for this menu item.
    
    </td></tr><tr role="row"><td class="confluenceTd">**Template Style**
    
    </td><td class="confluenceTd">Select the template style you want for this menu.
    
    </td></tr></tbody></table>
    
    </div>
2. Click **Save**.

<div bis_skin_checked="1" class="confluence-information-macro confluence-information-macro-note conf-macro output-block" data-hasbody="true" data-macro-name="note" id="bkmrk--2"><div bis_skin_checked="1" class="confluence-information-macro-body">  
</div></div>Ensure that you see a green tick next to this menu item. The green tick indicates that the item is published. To publish an item, select the checkbox next to the item and click **Publish**.

To view the created menu item, go the front end of your site. The new menu item is displayed.

### Creating Menu to access JomEvents Front Admin

To create menu items with Front Admin menu item type, do the following:

1. Click **Menus** &gt; **&lt;your\_menu&gt;** &gt; **Add New Menu Items**.
2. Provide a title as **Front Admin** and the alias as **front-admin** in the Menu Title field.
3. Provide the options as seen in the following image:  
    [![obraz.png](https://wiki.comdev.eu/uploads/images/gallery/2024-02/scaled-1680-/HiSobraz.png)](https://wiki.comdev.eu/uploads/images/gallery/2024-02/HiSobraz.png)
    
      
    **Screen4:** JomEvents Front Admin menu item screen
4. Click **Save**.

Front Admin Options

For the Menu to be able to access the JomEvents Front Admin, certain settings need to be made. The following table shows the three menu links that need to be made and linked with JomEvents Options. You can create these 3 menu items anywhere on the site e.g. link them under User Menu.

<div bis_skin_checked="1" class="table-wrap" id="bkmrk--3"><table class="wrapped confluenceTable tablesorter tablesorter-default stickyTableHeaders" role="grid" style="padding: 0px;"><colgroup><col></col><col></col><col></col><col></col></colgroup><thead class="tableFloatingHeaderOriginal" style="position: static; margin-top: 0px; left: 325px; z-index: 3; width: 1332px; top: 40px;"><tr class="tablesorter-headerRow" role="row"></tr></thead></table>

</div><div bis_skin_checked="1" class="table-wrap" id="bkmrk-profile-edit-menu-li"><table class="wrapped confluenceTable tablesorter tablesorter-default stickyTableHeaders" role="grid" style="padding: 0px; width: 100%;"><tbody aria-live="polite" aria-relevant="all"><tr role="row"><td class="highlight-green confluenceTd" data-highlight-colour="green" style="width: 14.3332%;">##### Profile Edit Menu Link

</td><td class="highlight-green confluenceTd" data-highlight-colour="green" style="width: 16.8164%;">This link should point to Edit profile menu item created using Edit User Profile menu item type.

</td><td class="highlight-green confluenceTd" data-highlight-colour="green" style="width: 26.2052%;">1. Click **Menu** &gt; **&lt;your\_menu&gt;**&gt;**Add New Menu Item**.
2. Provide the Title as **Edit Profile** and the menu item type as **Edit User Profile**.
3. Click **Save**.

</td><td class="highlight-green confluenceTd" data-highlight-colour="green" style="width: 42.6452%;"><div bis_skin_checked="1" class="content-wrapper"><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">![](https://wiki.comdev.eu/download/attachments/5735689/Edit_Profile.jpg)</span></div></td></tr><tr role="row"><td class="highlight-red confluenceTd" data-highlight-colour="red" style="width: 14.3332%;">##### Admin Menu Link

</td><td class="highlight-red confluenceTd" data-highlight-colour="red" style="width: 16.8164%;">This link should point to the login form menu item created using Login Form menu item type.

</td><td class="highlight-red confluenceTd" data-highlight-colour="red" style="width: 26.2052%;">1. Click **Menu** &gt; **&lt;your\_menu&gt;**&gt;**Add New Menu Item**.
2. Provide the Title as **Login Form** and the menu item type as **Login Form**.
3. Click **Save**.

</td><td class="highlight-red confluenceTd" data-highlight-colour="red" style="width: 42.6452%;">The following image shows how the Login Form menu item is used

[![Bez nazwy.jpeg](https://wiki.comdev.eu/uploads/images/gallery/2024-03/scaled-1680-/12Lbez-nazwy.jpeg)](https://wiki.comdev.eu/uploads/images/gallery/2024-03/12Lbez-nazwy.jpeg)

<span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">![](https://wiki.comdev.eu/download/attachments/5735689/Login_Form.jpg)</span>

When user is not logged into the front page, he will be redirected to the built-in Joomla login form. After successful login, he will be redirected to the JomEvents Front Admin.   
The following image shows the redirect URL that needs to be provided. The value you provide in the Login Redirect field depends on the following:

<div bis_skin_checked="1" class="content-wrapper">- <span class="nolink">http://domain.com/index.php/front-admin</span> - Use if URL rewriting is not applicable.
- <span class="nolink">http://domain.com/front-admin</span> - Use if URL rewriting is applicable.

</div>In our example, we are using the <span class="nolink">http://domain.com/front-admin</span> URL as shown in the following image where front-admin is the alias of the [JomEvents Front Admin Menu Link](https://wiki.comdev.eu/display/JE/Menu+Items#MenuItems-front-admin):

<span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">![](https://wiki.comdev.eu/download/attachments/5735689/Login_Form_redirect.jpg)</span>

</td></tr><tr role="row"><td class="highlight-yellow confluenceTd" data-highlight-colour="yellow" style="width: 14.3332%;">##### Profile View Menu Link

</td><td class="highlight-yellow confluenceTd" data-highlight-colour="yellow" style="width: 16.8164%;">This link should point to the user profile created using User Profile menu item type.

</td><td class="highlight-yellow confluenceTd" data-highlight-colour="yellow" style="width: 26.2052%;">1. Click **Menu** &gt; **&lt;your\_menu&gt;**&gt;**Add New Menu Item**.
2. Provide the Title as **User Profile** and the menu item type as **User Profile**.
3. Click **Save**.

</td><td class="highlight-yellow confluenceTd" data-highlight-colour="yellow" style="width: 42.6452%;"><div bis_skin_checked="1" class="content-wrapper"><span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">![](https://wiki.comdev.eu/download/attachments/5735689/User_Profile.jpg)</span></div></td></tr></tbody></table>

</div>**Now link menus with JomEvents Options**:

Make the following settings for the Front Admin are made in the JomEvents options for the user to be redirected correctly to the Front Admin, when he is not logged in.

1. Click **System** &gt; **Control Panel**.
2. Under **Extensions**, click **JomEvents**.
3. Click **Options** in the top right-hand corner of the screen.
4. Click the **Front Admin** tab.
5. Change the **Profile Menu Link**, **Login Menu Link**, and **View Profile Menu Link** field as per the following image.  
    <span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">![](https://wiki.comdev.eu/download/attachments/5735689/menuitems2.jpg)</span>  
    **Screen5:** JomEvents Front Admin options
6. Click **Save**.

The Front Admin lets users add listings in the front of the site. For more information about how to add listings, see [Front Admin](https://wiki.comdev.eu/books/jomevents/page/front-admin-overview "Front Admin Overview"). The following image shows the Front Admin.