Knowledge Base

Adding a new link and icon to your header
Article ID: 645
Written By: camm15h
Written On: Sat Jan 17, 2009 11:14 pm
Description: This article describes how to add a new link and icon to the standard header of prosilver based styles.
Link to this article: Select All
[url=http://www.phpbb.com/kb/article/adding-a-new-link-and-icon-to-your-header/]Knowledge Base - Adding a new link and icon to your header[/url]

Introduction
I've compiled this guide as it's not exactly straight forward to accomplish (done properly).

First off, we're going to assume that the new link you are adding is called 'name'. You should change 'name' to whatever you wish when it occurs throughout the following steps.

Modifying files
Open: includes/functions.php, find:
Code: Select all
      'U_RESTORE_PERMISSIONS'   => ($user->data['user_perm_from'] && $auth->acl_get('a_switchperm')) ? append_sid("{$phpbb_root_path}ucp.$phpEx", 'mode=restore_perm') : '',

After, add:
Code: Select all
      'U_NAME'            => append_sid("{$phpbb_root_path}name.$phpEx"),

(*Note: If you are using an outside forum link, use):
Code: Select all
      'U_NAME'            => 'http://www.name.of.website.com/index.$phpEx',


Open: styles/prosilver/theme/bidi.css, find:
Code: Select all
.rtl .icon-search

Inline-after, add:
Code: Select all
, .rtl .icon-name


Open: styles/prosilver/theme/buttons.css, find:
Code: Select all
.icon-search

Inline-after, add:
Code: Select all
, .icon-name


Open: styles/prosilver/theme/colours.css, find:
Code: Select all
.icon-search               { background-image: url("{T_THEME_PATH}/images/icon_search.gif"); }

After, add:
Code: Select all
.icon-name               { background-image: url("{T_THEME_PATH}/images/icon_name.gif"); }


Open: styles/prosilver/template/overall_header.html, find:
Code: Select all
<li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>

After, add:
Code: Select all
<li class="icon-name"><a href="{U_NAME}" title="{L_NAME_EXPLAIN}">{L_NAME}</a></li>


Open: language/en/common.php, find:
Code: Select all
));

Before, add:
Code: Select all
'NAME'                  => 'Name',
'NAME_EXPLAIN'            => 'View the name page',


Uploading your new icon
Next, you need to upload your new icon to styles/prosilver/theme/images and ensure it's called 'icon_name.gif'.

If you haven't made an icon yet, just duplicate 'icon_bookmark.gif' and rename it 'icon_name.gif' for the time being.

Finishing up
Lastly, you need to refresh the whole of your prosilver template through the ACP/Styles tab.

  • 20090118 - edited by Raimon to fix incorrect variable for outside the forum