[gelöst] 1thank (prosilver) background-image einfügen

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.0.x, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
phpBB Styles Demo
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
Antworten
Johnny80
Mitglied
Beiträge: 7
Registriert: 20.10.2010 21:21

[gelöst] 1thank (prosilver) background-image einfügen

Beitrag von Johnny80 »

Einen wunderschönen guten Abend,

ich möchte auf meinem phpBB 3.0.7-PL1 den Hintergrund mit einer sich wiederholenden Grafik versehen.

Installiert ist 1thank als Style.

Über google bin ich bereits auf "How to add background image to style?" gestoßen, was zumindest laut Pfadangabe ja eigentlich wie die Faust aufs Auge passen müsste ^^.

Es wird empfohlen, die colours.css zu editieren. Leider existiert in dem aktuellen 1thank Style keine colours.css.
"Changing body color (1thank template)" schlägt dann vor, die common.css zu editieren.

Ich hab also versucht die Änderungen aus dem ersten Beitrag auf meine common.css zu adaptieren.

Aus

Code: Alles auswählen

html {
	font-size: 100%;
	/* Always show a scrollbar for short pages - stops the jump when the scrollbar appears. non-IE browsers */
	height: 100%;
	margin-bottom: 1px;
}

body {
	/* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
	font-family: Verdana, Helvetica, Arial, sans-serif;
	color: #828282;
	background-color: #5F5E5E;
	/*font-size: 62.5%;			 This sets the default font size to be equivalent to 10px */
	font-size: 10px;
	margin: 0;
	padding: 27px 0;
}
wurde

Code: Alles auswählen

html {
	font-size: 100%;
	/* Always show a scrollbar for short pages - stops the jump when the scrollbar appears. non-IE browsers */
	height: 100%;
	margin-bottom: 1px;
}

body {
	/* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
	font-family: Verdana, Helvetica, Arial, sans-serif;
	color: #828282;
	background-image: url("{T_THEME_PATH}/images/body-bg.gif");
	background-color: #5F5E5E;
	background-repeat: repeat-x;
	/*font-size: 62.5%;			 This sets the default font size to be equivalent to 10px */
	font-size: 10px;
	margin: 0;
	padding: 27px 0;
}
Das Resultat sieht dann so aus. (shadow-l.gif und shadow-r.gif hab ich bereits gelöscht um den Schatteneffekt beim Header nicht zu haben)
[ externes Bild ]

Bzw. Nochmal hier klicken für großes Bild!

Templates / Themes und Caches etc. hab ich auch aktualisiert. Neuladen von Firefox natürlich auch mit STRG+F5.

Ich bin dankbar für weitere Vorschläge :)
Zuletzt geändert von Johnny80 am 21.10.2010 00:06, insgesamt 1-mal geändert.
Benutzeravatar
Balint
Mitglied
Beiträge: 1815
Registriert: 25.01.2003 21:43
Wohnort: Stuttgart
Kontaktdaten:

Re: 1thank (prosilver) background-image einfügen

Beitrag von Balint »

Hallo,

du definierst ja auch:

Code: Alles auswählen

background-repeat: repeat-x;
also nur horizontal wiederholen.

Richtig wäre es,

Code: Alles auswählen

background-repeat: repeat;
zu definieren, damit die Wiederholung in beide Richtungen stattfindet.


Viele Grüße,
Bálint
Meine MODs für phpBB 2.x und phpBB 3.x!
Johnny80
Mitglied
Beiträge: 7
Registriert: 20.10.2010 21:21

Re: 1thank (prosilver) background-image einfügen

Beitrag von Johnny80 »

Hallo,

das klingt einleuchtend.

Ich hab es geändert. Neu hochgeladen. Im ACP alles unter "STYLE-KOMPONENTEN" aktualisiert. Im General Tab den Cache ebenfalls gelöscht. Mit STRG+F5 Seite neu geladen.
Keine Veränderung.
Hab mich dann ausgeloggt. Mit STRG+F5 nochmal neugeladen und anschließend eingeloggt.
Leider keine Verbesserung :(
Benutzeravatar
Balint
Mitglied
Beiträge: 1815
Registriert: 25.01.2003 21:43
Wohnort: Stuttgart
Kontaktdaten:

Re: 1thank (prosilver) background-image einfügen

Beitrag von Balint »

Hallo,

das "body" wird in deinem Style ein zweites Mal definiert: in der stylesheet.css selbst (erschließt sich mir absolut nicht):

Finde dort

Code: Alles auswählen

body {
    background: #5f5e5e url("{T_THEME_PATH}/images/body-bg.gif") 0 0 repeat-x;
    padding: 30px 0 0 0;
    margin: 0;
}
und entferne das mal probeweise.


Viele Grüße,
Bálint
Meine MODs für phpBB 2.x und phpBB 3.x!
Johnny80
Mitglied
Beiträge: 7
Registriert: 20.10.2010 21:21

Re: 1thank (prosilver) background-image einfügen

Beitrag von Johnny80 »

Ich hab das mal auskommentiert,

Code: Alles auswählen

/*
body {
    background: #5f5e5e url("{T_THEME_PATH}/images/body-bg.gif") 0 0 repeat-x;
    padding: 30px 0 0 0;
    margin: 0;
}
*/
Und das hatte tatsächlich eine Auswirkung. Wenn auch nicht ganz die, die ich erhofft hatte ^^

[ externes Bild ]
[ externes Bild ]
Und das geht dann in grau bis zum Schluss unten weiter.

Bild 1 groß
Bild2 groß

Mir ist allerdings grad beim editieren der stylesheet.css noch folgende Zeile aufgefallen

Code: Alles auswählen

/*  	
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */

html, body {
	color: #536482;
	background-color: #5F5E5E;
	background-image: url("{T_THEME_PATH}/images/background.gif");
	background-repeat: repeat-x;
}
Die gleicht zumindest von der Syntax her, dem ersten Vorschlag aus meinem ersten Post. Die dort vorgeschlagenen Änderungen werd ich hier auch noch ausprobieren.
Zuletzt geändert von Johnny80 am 20.10.2010 23:51, insgesamt 1-mal geändert.
AY110
Mitglied
Beiträge: 26
Registriert: 20.05.2004 13:46
Kontaktdaten:

Re: 1thank (prosilver) background-image einfügen

Beitrag von AY110 »

Hallo,

ich würde folgendes in der common.css versuchen:

Code: Alles auswählen

html {
   font-size: 100%;
   /* Always show a scrollbar for short pages - stops the jump when the scrollbar appears. non-IE browsers */
   height: 100%;
   margin-bottom: 1px;
}

body {
   /* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
   font-family: Verdana, Helvetica, Arial, sans-serif;
   color: #828282;
   background-image: url("{T_THEME_PATH}/images/body-bg.gif");
   background-color: #5F5E5E;
    /*font-size: 62.5%;          This sets the default font size to be equivalent to 10px */
   font-size: 10px;
   margin: 0;
   padding: 27px 0;
}
MFG
- It is not enough to do your best; you must know what to do, and THEN do your best.
- The only way to really live is to sometimes be on the edge of living and dying, or danger and nondanger.
Johnny80
Mitglied
Beiträge: 7
Registriert: 20.10.2010 21:21

Re: 1thank (prosilver) background-image einfügen

Beitrag von Johnny80 »

Gut möglich, dass das auch funktioniert. Aber hier meine Ergebnisse.

Also:
stylesheet.css

Code: Alles auswählen

/*  	
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */

html, body {
	color: #536482;
	background-color: #5F5E5E;
	background-image: url("{T_THEME_PATH}/images/body-bg.gif");
	background-repeat: repeat;
}
und die von dir vorgeschlagene Löschung bzw. Auskommentierung von

Code: Alles auswählen

/*

body {
    background: #5f5e5e url("{T_THEME_PATH}/images/body-bg.gif") 0 0 repeat-x;
    padding: 30px 0 0 0;
    margin: 0;
}
*/
funktioniert. Ich kriege folgendes angezeigt :)

[ externes Bild ]

----------------------------

Um das nochmal übersichtlich zusammenzufassen.
Die common.css ist original und unverändert!

In der stylesheet.css wird

Code: Alles auswählen

/*  	
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */

html, body {
	color: #536482;
	background-color: #5F5E5E;
	background-image: url("{T_THEME_PATH}/images/background.gif");
	background-repeat: repeat-x;
}
zu

Code: Alles auswählen

/*  	
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */

html, body {
	color: #536482;
	background-color: #5F5E5E;
	background-image: url("{T_THEME_PATH}/images/body-bg.gif");
	background-repeat: repeat;
}
Und aus

Code: Alles auswählen

body {
    background: #5f5e5e url("{T_THEME_PATH}/images/body-bg.gif") 0 0 repeat-x;
    padding: 30px 0 0 0;
    margin: 0;
}
wird

Code: Alles auswählen

/*
body {
    background: #5f5e5e url("{T_THEME_PATH}/images/body-bg.gif") 0 0 repeat-x;
    padding: 30px 0 0 0;
    margin: 0;
}
*/
bzw. ganz gelöscht.

Ich probier deine Variante jetzt aber trotzdem noch aus :D
Johnny80
Mitglied
Beiträge: 7
Registriert: 20.10.2010 21:21

Re: 1thank (prosilver) background-image einfügen

Beitrag von Johnny80 »

AY110 hat geschrieben:Hallo,

ich würde folgendes in der common.css versuchen:

Code: Alles auswählen

html {
   font-size: 100%;
   /* Always show a scrollbar for short pages - stops the jump when the scrollbar appears. non-IE browsers */
   height: 100%;
   margin-bottom: 1px;
}

body {
   /* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
   font-family: Verdana, Helvetica, Arial, sans-serif;
   color: #828282;
   background-image: url("{T_THEME_PATH}/images/body-bg.gif");
   background-color: #5F5E5E;
    /*font-size: 62.5%;          This sets the default font size to be equivalent to 10px */
   font-size: 10px;
   margin: 0;
   padding: 27px 0;
}
MFG
Ausprobiert. Originale Dateien mit nur dieser Änderung. Und funktioniert nicht. backgroundimage bis Header-Ende, ab dann grau. Wie im ersten Post zu sehen!
In sofern bleibe ich bei der Lösung direkt hier drüber!

Viele Dank für die Hilfe :D

Ciao
AY110
Mitglied
Beiträge: 26
Registriert: 20.05.2004 13:46
Kontaktdaten:

Re: [gelöst] 1thank (prosilver) background-image einfügen

Beitrag von AY110 »

Hi,

na dann ist doch alles gut, hatte es bei mir auch ausprobiert, allerdings mit einer jpg Datei...

Ende gut alles gut ;)

MFG
- It is not enough to do your best; you must know what to do, and THEN do your best.
- The only way to really live is to sometimes be on the edge of living and dying, or danger and nondanger.
Antworten

Zurück zu „[3.0.x] Styles, Templates und Grafiken“