Skip to end of metadata
Go to start of metadata

Header is the upper part of the site pages. By default it remains same for all front-end pages.

Header template is located in the Admin Panel > Layout and Content > System Templates > Menu folder and called "header.tpl"

E.g. below you can see the GenerationX Theme header:


Edit Header image

E.g. you need to change the picture on the right part of the header.
For that you need to go to Edit CSS page: Admin Panel > Dashboard Quick Links > Edit CSS

Note: GenerationX should be set as the current Theme in order to modify its header and other components.
In the "Themes" section of the Manual you will find the instructions how to make a certain Theme current.

There in the text area containing the code you need to find the following:

.HeaderRight {
background-image:url(header.png);

This part of the code indicates the picture to be used for the header.

You can upload another picture instead of the existing one via FTP:
The path is: ftp > templates > GenerationX > main > images

Note: The quick way is to rename the uploading file to "header.png" – and the system will replace the existing image with the new one.
Thus you will not need to put the new image file name to the header template.

Edit header image size

To edit width and/or height of the header picture you need to find the following part of the code:

.HeaderRight {
...
float:right;
height:155px;
width:407px;
}


Here you can set the needed numbers for the header image width and height.

‘Home, Register, Sign in’ block


To move this block to another place you need to edit the_header.tpl (System templates > menu > header.tpl)
There you need to find the following part of the code:

{if $GLOBALS.current_user.logged_in}
[[Welcome]]{$GLOBALS.current_user.username},  <br> {if $GLOBALS.current_user.new_messages > 0} <br><a href="{$GLOBALS.site_url}/private_messages/inbox/"><img src="{image}new_msg.gif" border="0" alt="[[You have]] {$GLOBALS.current_user.new_messages} [[Message]]" title="[[You have]] {$GLOBALS.current_user.new_messages} [[Message]]" /></a><br>{/if} <br>   <a href="{$GLOBALS.site_url}/"> [[Home]]</a>     <img src="{image}sepDot.png" border="0" alt="" />     <br> <a href="{$GLOBALS.site_url}/logout/"> [[Logout]]</a><br> {else} <br> <a href="{$GLOBALS.site_url}/"> [[Home]]</a>     <img src="{image}sepDot.png" border="0" alt="" />     <br> <a href="{$GLOBALS.site_url}/registration/"> [[Register]]</a>   <img src="{image}sepDot.png" border="0" alt="" />     <br> <a href="{$GLOBALS.site_url}/login/"> [[Sign In]]</a>

And move it to the needed place in the template code depending on where you want it to be displayed.

 

  • No labels