Extra Menu in Header

[Stoker]

Extra Menu in Header
Written by Stoker

This guide will tell you have to get an extra menu in the header.
I have seen it on several german boards and got the idea from flying-bits.org

We will make changes in 2 files.

---

Open styles/prosilver/template/overall_header.html
Find:

Code: Select all

<div class="headerbar">
			<div class="inner"><span class="corners-top"><span></span></span>

add after:

Code: Select all

<div class="menu-block" style="float: {S_CONTENT_FLOW_END}; width: 19%;">
			<div class="menu-row-first"><a class="left menu-link" href="http://www.phpbb3bbcodes.com/">BBCode Board</a></div>
			<div class="menu-row"><a class="left menu-link" href="http://www.phpbb3bbcodes.com/stokerstyles/index.php">Styles Board</a></div>
			<div class="menu-row-last"><a class="left menu-link" href="http://www.phpbb3bbcodes.com/donate.php">Donate</a></div>
		</div>
		<div style="float: {S_CONTENT_FLOW_BEGIN}; width: 79.5%;">

Find:

Code: Select all

<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
			<div id="search-box">
				<form action="{U_SEARCH}" method="post" id="search">
				<fieldset>
					<input name="keywords" id="keywords" type="text" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search" value="<!-- IF SEARCH_WORDS-->{SEARCH_WORDS}<!-- ELSE -->{L_SEARCH_MINI}<!-- ENDIF -->" onclick="if(this.value=='{LA_SEARCH_MINI}')this.value='';" onblur="if(this.value=='')this.value='{LA_SEARCH_MINI}';" /> 
					<input class="button2" value="{L_SEARCH}" type="submit" /><br />
					<a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS}
				</fieldset>
				</form>
			</div>
		<!-- ENDIF -->

Add after:

Code: Select all

		</div>

In the first add you will have to change the links to what ever you prefer, they are just examples.
BUT make sure to use <div class="menu-row-first"> in the first link and <div class="menu-row-last"> in the last link.

---

Open styles/prosilver/theme/colours.css
At the bottom, add on a new line:

Code: Select all

/* Code taken from flying-bits.org Sorry NV ;) */
a.menu-link {
	background-image: url("{T_THEME_PATH}/images/arrow_right.gif");
	font-weight: bold;
	padding-top: 4px;
	padding-bottom: 4px;
	color: #FFFFFF;
}

a.menu-link:hover {
	background-position: 6px 60%;
	color: #9b0000;
}

div.menu-block {
	border-left: #FFFFFF solid 1px;
	padding-left: 6px;
}

div.menu-row-first {
	border-bottom: 1px solid #FFFFFF;
	padding-top: 4px;
	padding-left: 4px;
	padding-bottom: 4px;
}

div.menu-row {
	border-bottom: 1px solid #FFFFFF;
	padding-top: 4px;
	padding-left: 4px;
	padding-bottom: 4px;
}

div.menu-row-last {
	padding-top: 4px;
	padding-left: 4px;
	padding-bottom: 4px;
}

---

Save, upload both files and refresh theme and template.

[Solidjeuh]

yes! This is what I was looking for!
Thank you so much!

[martin123456]

I take it this is not for pre_mod ?

[Stoker]

No, its not included in the premod