Hintergrundbilder einbaun !

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.
EL-NoS
Mitglied
Beiträge: 9
Registriert: 11.05.2004 19:25

Hintergrundbilder einbaun !

Beitrag von EL-NoS »

Hi Leute,
wollte nur mal fragen wie man ein Hintergrundbild in das Forum einbauen kann. Ich wollte ein nettes Galaxiebild nehmen und das als transparenten Hintergrund quasi einbaun, so dass alle Inhalte des Forums zwar im Vordergrund stehn, aber das Bild trotzdem sichtbar ist. Ich benutze das template subBlack von www.phpBB.com. Dumme Umschreibung, aber ich hoffe man raffts. Thx im voraus ! :lol:

MfG

EL-NoS

P.S. : Guckt euch einfach das Forum an und man kapierts durch den Banner vielleicht besser :o http://elnos.funpic.de :o
Benutzeravatar
D@ve
Ehemaliges Teammitglied
Beiträge: 3842
Registriert: 28.08.2002 19:33
Wohnort: Bretzfeld
Kontaktdaten:

Beitrag von D@ve »

Moin,
das ist etwas Arbeit, Du musst erstmal in die Haupt-Tabelle des Forums (ist der zweite <table>-Tag in der overall_header.tpl sein) Dein Hintergrund grund bild eisntellen, dazu fügst Du im Table-Tag

Code: Alles auswählen

style="background-image:url(pfad/zu/Deinem/bild.gif);"
ein

Dann kannst Du Dich daran machen. Die einzelnen Tabellen Transparent zu machen, indem Du im Stylesheet den "background" auf "transparent" setzt. Solltest das aber in verschiedenen Browsern testen... einfacher ist es, wenn Du zB. ein sich wiederholendes Bild hast, dann brauchst Du nur die einzelnen <td>-Klassen anpassen (hauptsächlich row1, 2 und 3)

Gruß, Dave
There are only 10 types of people in the world: Those who understand binary, and those who don't
jelem
Mitglied
Beiträge: 109
Registriert: 18.04.2004 20:43

Beitrag von jelem »

Au ja, das interresiert mich auch. Ich setze auch ein Hintergrundbild ein. (fixed, nicht mitscrollend) Wo kann ich jetzt die einzelnen Tabellen transparent machen? Welche Datei?
EL-NoS
Mitglied
Beiträge: 9
Registriert: 11.05.2004 19:25

Beitrag von EL-NoS »

ja jungs,
hab den code hinter dem zweiten table tag gesetzt aber wird immer noch nix angezeigt, hab gelesen man muss noch die css dateien aktivieren, aber hab ich überprüft, mein template was ich mir gezogen hab, hatte das schon standardmäßig aktiviert. Besser ihr erklärt mir das eben an hand meiner overall_header datei selber, wo muss ich das setzen und wie wird es später dann auch angezeigt ?

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html dir="{S_CONTENT_DIRECTION}">
<head>
<meta http-equiv="Content-Type" content="text/html; charset={S_CONTENT_ENCODING}">
<meta http-equiv="Content-Style-Type" content="text/css">
{META}
{NAV_LINKS}
<title>{SITENAME} :: {PAGE_TITLE}</title>
<link rel="stylesheet" href="templates/subBlack/{T_HEAD_STYLESHEET}" type="text/css" />
<style type="text/css"> 
<!-- 
TH         { background-image: url(templates/subBlack/images/{T_TH_CLASS2}) } 
TD.cat      { background-image: url(templates/subBlack/images/{T_TH_CLASS1}) } 
TD.rowpic   { background-image: url(templates/subBlack/images/{T_TH_CLASS3}); background-repeat: repeat-y } 
TD.catHead,TD.catSides,TD.catLeft,TD.catRight,TD.catBottom { background-image: url(templates/subBlack/images/{T_TH_CLASS1}) } 
--> 
</style>
<!-- BEGIN switch_enable_pm_popup -->
<script language="Javascript" type="text/javascript">
<!--
	if ( {PRIVATE_MESSAGE_NEW_FLAG} )
	{
		window.open('{U_PRIVATEMSGS_POPUP}', '_phpbbprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');;
	}
//-->
</script>
<!-- END switch_enable_pm_popup -->
</head>
<body bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">

<a name="top"></a>

<table width="100%" cellspacing="0" cellpadding="10" border="0" align="center"> 
	<tr> 
		<td class="bodyline"><table width="100%" cellspacing="0" cellpadding="0" border="0">
			<tr> 
				<td width="200"><a href={U_INDEX}><img src="templates/subBlack/images/logo_phpBB.gif" width="200" border="0" alt={L_INDEX} vspace="1" /></a></td>
				<td align="center" valign="middle"><span class="maintitle">{SITENAME}</span><br /><span class="gen">{SITE_DESCRIPTION}<br />&nbsp; </span> 
				<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/subBlack/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/subBlack/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/subBlack/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/subBlack/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/subBlack/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/subBlack/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/subBlack/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/subBlack/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>

		<br />
Benutzeravatar
Markus67
Ehrenadmin
Beiträge: 28346
Registriert: 12.01.2004 16:02
Wohnort: Neuss
Kontaktdaten:

Beitrag von Markus67 »

Hi ...

Es ist einfacher du packst das wie folgt in deine CSS-Definition mit rein
(entweder im Stylesheet oder in der overall_header.tpl ....

Code: Alles auswählen

 /* Fixiertes Hintergrundbild */
body {
	background-image: url(images/dein_hintergrund.gif);
                background-attachment: fixed;
    }
Markus
Benutzeravatar
D@ve
Ehemaliges Teammitglied
Beiträge: 3842
Registriert: 28.08.2002 19:33
Wohnort: Bretzfeld
Kontaktdaten:

Beitrag von D@ve »

Die meisten Tabellen in phpBB haben irgendeine Hintergrundfarbe angegeben: zB. background: #FFFFFF; das musst Du auch löschen, oder eben (eleganter) durch transparent ersetzen.

Gruß, Dave
There are only 10 types of people in the world: Those who understand binary, and those who don't
EL-NoS
Mitglied
Beiträge: 9
Registriert: 11.05.2004 19:25

Beitrag von EL-NoS »

Code: Alles auswählen

/* Fixiertes Hintergrundbild */ 
body { 
   background-image: url(images/dein_hintergrund.gif); 
                background-attachment: fixed; 
    } 
Sry Jungs, hab alles gemacht was ihr mir vorgeschlagen habt, hab den code da oben in dir overall_header.tpl eingefügt und im administrationsbereich die hintergrundfarbe gelöscht, also kästchen frei gelassen, aber funtzt net. Brauche weiterhin ne gute Beratung :) !
Danke nochmals für eure Hilfe !
Benutzeravatar
D@ve
Ehemaliges Teammitglied
Beiträge: 3842
Registriert: 28.08.2002 19:33
Wohnort: Bretzfeld
Kontaktdaten:

Beitrag von D@ve »

URL???
There are only 10 types of people in the world: Those who understand binary, and those who don't
Benutzeravatar
Markus67
Ehrenadmin
Beiträge: 28346
Registriert: 12.01.2004 16:02
Wohnort: Neuss
Kontaktdaten:

Beitrag von Markus67 »

Hi ....

Das sind die Angaben in der subSilver.css für die Hintergründe der Tabellen ....

Code: Alles auswählen

  However, you could replace this with a bitmap specific for each forum
*/
td.rowpic {
		background-color: #FFFFFF;
		background-image: url(images/cellpic2.jpg);
		background-repeat: repeat-y;
}

/* Header cells - the blue and silver gradient backgrounds */
th	{
	color: #FFA34F; font-size: 11px; font-weight : bold;
	background-color: #006699; height: 25px;
	background-image: url(images/cellpic3.gif);
}

td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {
			background-image: url(images/cellpic1.gif);
			background-color:#D1D7DC; border: #FFFFFF; border-style: solid; height: 28px;
}
Jetzt musst du einfach mal in deinem Style schauen wo background-color verwendet wird ... und dies entsprechend ersetzen ....

Die Änderungen im Adminbereich sind mit der Aktivierung der Stylesheets wirkungslos .... bis auf wenige Ausnahmen im Adminbereich ...

Markus
Antworten

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