Top Menu

From Smart Job Board help

Jump to: navigation, search

Top Menu is located under the header and remains same for all pages.
Software Themes have different styles of top menus:

GenerationX Theme top menu:

Top menu generationX.png

Intelligent View Theme top menu:

Top menu intelligentview.png

Light View Theme top menu:

Top menu lightview.png

SmartJobBoard Theme top menu:

Top menu smartjobboard.png

Advanced View Theme to menu:

Top menu smartjobboard2.png


 Note: Before editing the Top Menu, make sure that the needed Theme is set to be current. 
 Instructions to make that you can find in the "Themes" section of the Manual. 


  • Top menu design

To modify the top menu design you need to edit the template called header.tpl
The path is:
Admin Panel -> Templates -> Edit Templates -> Menu -> header.tpl

In the bottom part of the code you need to find the following:

Code:

1)     <td><img src="{image}up-menu-left.png" border="0" alt=""/></td>
2)     <td width="100%" background="{image}up-menu-left-bg.png">
        {module name="menu" function="top_menu"}
        </td>

3)     <td><img src="{image}up-menu-right.png" border="0" alt=""/></td>


Explanation:

1) – This is the left corner of the top menu form  Left corner.png - up-menu-left.png

2) – This is the central part of the top menu form Central part.png - up-menu-left-bg.png
I.e. it is the background of the central part which is ‘stretched’ along the full length of the top menu

3) – And this is the right corner of the top menu Right coner.png - up-menu-right.png


Hence to change the top menu color you need to modify its left corner, central part (which will be the background) and right corner.
The new images for just listed components should be uploaded to the:

FTP – templates – GenerationX – main – images folder



  • Top Menu Items

In the mentioned above part of the header.tpl code you can also see the following line:

     {module name="menu" function="top_menu"}     – this module activates the menu itself (menu items)

To modify these menu items you need to edit the top.tpl template.
The path is:
Admin Panel -> Templates -> Edit Templates -> Menu -> header.tpl


This is the way top menu items defined in the top.tpl

Code:

     <td><a href="{$GLOBALS.site_url}/my_account/">My Account</a></td>

     <td><img src="{image}up-menu-left-sep.png" border="0" alt=""/></td>

     <td><a href="{$GLOBALS.site_url}/find_jobs/" >Find Jobs</a></td>

     <td><img src="{image}up-menu-left-sep.png" border="0" alt=""/></td>

Explanation:

      <td><a href="{$GLOBALS.site_url}/my_account/">My Account</a></td> 
- This is the cell <td></td> where the link to My Account page contained

      {$GLOBALS.site_url}/my_account/
- the link URL where a user will be redirected after clicked on the Menu item

 Note: To see the detailed explanation of how the {$GLOBALS.site_url} function operates, click here. 


      <td><a href="{$GLOBALS.site_url}/my_account/">My Account</a></td> - the menu item

      <td><img src="{image}up-menu-left-sep.png" border="0" alt=""/></td>- this is the image of the top menu items separator   Separator.png

 Note: If you change the color of the top menu - the menu separator image should be changed as well.


  • How to add a new item to the Top Menu

E.g. You want to add “About Us” menu item to the Top Menu after the 'Post Jobs' menu item.
For that in the top.tpl code you need to find the lines which describes 'Post Jobs'  menu item, here they are:

     <td><a href="{$GLOBALS.site_url}/post_jobs/" >Post Jobs</a></td>

     <td><img src="{image}up-menu-left-sep.png" border="0" alt=""/></td>


Then you can simply copy these lines and paste after “Find Jobs”, like show below:

     <td><a href="{$GLOBALS.site_url}/post_jobs/" >Post Jobs</a></td>

     <td><img src="{image}up-menu-left-sep.png" border="0" alt=""/></td>

     <td><a href="{$GLOBALS.site_url}/page link/" >About Us</a></td>

     <td><img src="{image}up-menu-left-sep.png" border="0" alt=""/></td>


 Note: Link to the page should be specified correctly, e.g. ‘about_us’.
 Also make sure that this page exists in the system. 
 More information about site pages and instructions how to create them 
 you can find in the “Site Pages” section of the Manual. 


Personal tools

User Manual for the latest version

Toolbox