Buttons anstelle Links

Alles zu Styles, Templates, Icons und Smilies für phpBB 2.0, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
Forumsregeln
phpBB 2.0 hat das Ende seiner Lebenszeit überschritten
phpBB 2.0 wird nicht mehr aktiv unterstützt. Insbesondere werden - auch bei Sicherheitslücken - keine Patches mehr bereitgestellt. Der Einsatz von phpBB 2.0 erfolgt daher auf eigene Gefahr. Wir empfehlen einen Umstieg auf phpBB 3.0, welches aktiv weiterentwickelt wird und für welches regelmäßig Updates zur Verfügung gestellt werden.
Antworten
Benutzeravatar
Starlord-REAL
Mitglied
Beiträge: 150
Registriert: 20.09.2005 17:15
Wohnort: SH

Buttons anstelle Links

Beitrag von Starlord-REAL »

Hallihallo!

Wie und wo kann man es so einrichten, dass man anstelle der
NAV-LINKS oben im Header, stattdessen BUTTONS einfügen kann?
Das Leben ist hart aber herzlich...
Nach oben
Haruko
Mitglied
Beiträge: 64
Registriert: 03.06.2005 18:57

Beitrag von Haruko »

Meinst du FAQ, Suchen, Mitgliederliste etc.?
Nach oben
Benutzeravatar
Starlord-REAL
Mitglied
Beiträge: 150
Registriert: 20.09.2005 17:15
Wohnort: SH

Beitrag von Starlord-REAL »

Ja, genau!
Das Leben ist hart aber herzlich...
Nach oben
Benutzeravatar
gloriosa
Mitglied
Beiträge: 13770
Registriert: 04.01.2005 20:23
Wohnort: Landeshauptstadt Erfurt

Hinweis

Beitrag von gloriosa »

Hallo,
nutze doch einfach die boardeigene Funktion [ externes Bild ] Suchen und Du wirst zahlreiche Antworten auf Deine Frage finden ! :o
Viele Grüße - gloriosa :D
Die einen schützen sich vor frischem Wind, während die anderen ihn nutzen.
Kein kostenloser MOD-Einbau usw. bzw. Support via PN, Email oder IRC !
Nach oben
Benutzeravatar
DerGonzo
Mitglied
Beiträge: 732
Registriert: 14.09.2005 12:22
Wohnort: Dorsten

Beitrag von DerGonzo »

Das ist ganz einfach:

Erstmal bastelst Du Dir alle Buttons... :D

Dann bearbeitest Du die Datei templates/deintemplate/overall_header.tpl.

In der Originaldatei ist der letzte Teil der Teil, in dem die Tabelle mit den Links steht:

Code: Alles auswählen

<table cellspacing="0" cellpadding="2" border="0">
					<tr> 
						<td align="center" valign="top" nowrap="nowrap"><span class="mainmenu">&nbsp;<a href="{U_FAQ}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_faq.gif" width="12" height="13" border="0" alt="{L_FAQ}" hspace="3" />{L_FAQ}</a></span><span class="mainmenu">&nbsp; &nbsp;<a href="{U_SEARCH}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_search.gif" width="12" height="13" border="0" alt="{L_SEARCH}" hspace="3" />{L_SEARCH}</a>&nbsp; &nbsp;<a href="{U_MEMBERLIST}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_members.gif" width="12" height="13" border="0" alt="{L_MEMBERLIST}" hspace="3" />{L_MEMBERLIST}</a>&nbsp; &nbsp;<a href="{U_GROUP_CP}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_groups.gif" width="12" height="13" border="0" alt="{L_USERGROUPS}" hspace="3" />{L_USERGROUPS}</a>&nbsp; 
						<!-- BEGIN switch_user_logged_out -->
						&nbsp;<a href="{U_REGISTER}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_register.gif" width="12" height="13" border="0" alt="{L_REGISTER}" hspace="3" />{L_REGISTER}</a></span>&nbsp;
						<!-- END switch_user_logged_out -->
						</td>
					</tr>
					<tr>
						<td height="25" align="center" valign="top" nowrap="nowrap"><span class="mainmenu">&nbsp;<a href="{U_PROFILE}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_profile.gif" width="12" height="13" border="0" alt="{L_PROFILE}" hspace="3" />{L_PROFILE}</a>&nbsp; &nbsp;<a href="{U_PRIVATEMSGS}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_message.gif" width="12" height="13" border="0" alt="{PRIVATE_MESSAGE_INFO}" hspace="3" />{PRIVATE_MESSAGE_INFO}</a>&nbsp; &nbsp;<a href="{U_LOGIN_LOGOUT}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_login.gif" width="12" height="13" border="0" alt="{L_LOGIN_LOGOUT}" hspace="3" />{L_LOGIN_LOGOUT}</a>&nbsp;</span></td>
					</tr>
				</table></td>
			</tr>
		</table>
Davon ist jeweils ein solcher Teil für den Link zuständig:

Code: Alles auswählen

<a href="{U_FAQ}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_faq.gif" width="12" height="13" border="0" alt="{L_FAQ}" hspace="3" />{L_FAQ}</a></span><span class="mainmenu">&nbsp; &nbsp;
In meinem Quelltext sieht die abgeandelte Sache so aus:

Code: Alles auswählen

<table cellspacing="0" cellpadding="2" border="0">
					<tr> 
						<td align="center" valign="top" nowrap="nowrap">
                                                  <a href="{U_FAQ}" class="mainmenu"><img src="templates/subSilver/images/icon_header_faq.png" width="120" height="20" border="0" alt="{L_FAQ}" hspace="3" /></a>
                                                  <a href="{U_SEARCH}" class="mainmenu"><img src="templates/subSilver/images/icon_header_search.png" width="120" height="20" border="0" alt="{L_SEARCH}" hspace="3" /></a>
                                                  <a href="{U_MEMBERLIST}" class="mainmenu"><img src="templates/subSilver/images/icon_header_memberlist.png" width="120" height="20" border="0" alt="{L_MEMBERLIST}" hspace="3" /></a>
                                                  <a href="{U_GROUP_CP}" class="mainmenu"><img src="templates/subSilver/images/icon_header_groups.png" width="120" height="20" border="0" alt="{L_USERGROUPS}" hspace="3" /></a>
                                                  <a href="statistics.php" class="mainmenu"><img src="templates/subSilver/images/icon_header_statistics.png" width="120" height="20" border="0" alt="Boardstatistiken" hspace="3" /></a>
						  <a href="{U_CALENDAR}" class="mainmenu"><img src="templates/subSilver/images/icon_header_calendar.png" width="120" height="20" border="0" alt="{L_CALENDAR}" hspace="3" /></a>
						  <!-- BEGIN switch_user_logged_out -->
						  <a href="{U_REGISTER}" class="mainmenu"><img src="templates/subSilver/images/icon_header_register.png" width="120" height="20" border="0" alt="{L_REGISTER}" hspace="3" /></a>
						  <!-- END switch_user_logged_out -->
						  <!-- BEGIN switch_report_list -->
						  <a href="{switch_report_list.U_REPORT_LIST}" class="mainmenu"><img src="templates/subSilver/images/icon_header_report_list.png" width="120" height="20" border="0" alt="{switch_report_list.L_REPORT_LIST}" hspace="3" /></a>
						  <!-- END switch_report_list -->
						</td>
					</tr>
					<tr>
						<td align="center" valign="top" nowrap="nowrap">
                                                <a href="{U_VIEW_PROFILE}" class="mainmenu"><img src="templates/subSilver/images/icon_header_profile.png" width="120" height="20" border="0" alt="{L_PROFILE}" hspace="3" /></a>
	                                        <!-- BEGIN Shownickpagebutton -->
	                                        <a href="{Shownickpagebutton.U_NICKPAGE}" class="mainmenu"><img src="templates/nickpage/icon_header_nickpage.png" width="120" height="20" border="0" hspace="3"></a> 
	                                        <!-- END Shownickpagebutton -->
						<a href="{U_Nickpagelist}" class="mainmenu"><img src="templates/subSilver/images/icon_header_nickpagelist.png" width="120" height="20" border="0" hspace="3"></a>
                                                <a href="{U_PRIVATEMSGS}" class="mainmenu"><img src="{PRIVMSG_IMG}" width="120" height="20" border="0" alt="{PRIVATE_MESSAGE_INFO}" hspace="3" /></a>
                                                <!-- BEGIN switch_user_logged_in -->
                                                <a href="javascript:void(0);" onClick="window.open('{S_JOIN_CHAT}','{CHATBOX_NAME}','scrollbars=no,width=540,height=450')" class="mainmenu"><img src="templates/subSilver/images/icon_header_chat.png" width="120" height="20" border="0" hspace="3" /></a>
                                                <!-- END switch_user_logged_in -->
                                                <!-- BEGIN switch_user_logged_out --> 
                                                <a href="{U_LOGIN_LOGOUT}" class="mainmenu"><img src="templates/subSilver/images/icon_header_login.png" width="120" height="20" border="0" alt="{L_LOGIN_LOGOUT}" hspace="3" /></a> 
                                                <!-- END switch_user_logged_out --> 
                                                <!-- BEGIN switch_user_logged_in --> 
                                                <a href="{U_LOGIN_LOGOUT}" class="mainmenu"><img src="templates/subSilver/images/icon_header_logout.png" width="120" height="20" border="0" alt="{L_LOGIN_LOGOUT}" hspace="3" /></a> 
                                                <!-- END switch_user_logged_in --></span></td>
					</tr>
				</table></td>
			</tr>
		</table>
Ich habe mir Buttons gemacht, die das Mini-Icon beinhalten und diese dann eingefügt.

Dabei gelten folgende Spezifikationen:
Dateiname der Grafik: icon_header_namedesicons.png
Breite (width): 120 Pixel
Höhe (Height): 20 Pixel

So sieht das dann im Header aus: >>Klick<<

Denk auf jeden Fall daran, daß Du verschiedene Grafiken für verschiedene Situationen brauchst:
- Login / Logout
- Registrieren angezeigt oder nicht
- Nachrichten oder neue Nachrichten (nicht jeder nutzt das Popup-Fenster!)

Viel Erfolg! :wink:
Nach oben
Benutzeravatar
Starlord-REAL
Mitglied
Beiträge: 150
Registriert: 20.09.2005 17:15
Wohnort: SH

Beitrag von Starlord-REAL »

Woow!!!

HERZLICHEN DANK Gonzo !!

Absolut mega-super-Antwort!


VIELEN VIELEN DANK DIR !!!!!!!!!!! :P :P :P
Das Leben ist hart aber herzlich...
Nach oben
Benutzeravatar
DerGonzo
Mitglied
Beiträge: 732
Registriert: 14.09.2005 12:22
Wohnort: Dorsten

Beitrag von DerGonzo »

Tja, ich laß mir ja auch gerne helfen, wenn ich nicht weiterkomm... :D

Also meine Bitte an Dich: Wenn Du mal jemandem helfen kannst, TU ES! :wink:

Wenn Du fertig bist, laß mal Dein Ergebnis sehen!
Nach oben
Antworten

Zurück zu „phpBB 2.0: Styles, Templates und Grafiken“