Haumis wbb hilfe | Druckvorschau: WBB2 Styles lernen

Geschrieben von nobody am 05.08.2010 um 17:20:

Was benötigt man um ein eigenes Style für ein WBB2.3.x zu erstellen?
Im Grunde nichts.
Farbsicherheit.
Ein Grafik-Programm um Zum Beispiel Buttons , Logos zu erstellen.
Alles andere ist vorhanden wenn man im Besitz eines WBB2.3.x ist.

Jetzt ist, wie schon so oft Lesen und Üben angesagt.
Dazu sollte man das WBB2.3.x schon auf einen Server am Laufen haben wo man oft etwas verändern kann.
Der Server sollte schon auf dem eigenem Rechner laufen.
Da kann man dann testen bis zum Umfallen.
Farben ausprobieren, Farbspiele testen ….
Wenn etwas nicht gefällt, was zuerst immer der Fall ist einfach neu machen …
Wo finde ich nun dieses „Farbenspiel“ für ein Style?
Setze ein NEUES, TOTAL leeres WBB2.3.x auf.
Erstelle einige Kategorien mit jeweils einigen Foren drin.
Das wird dazu gebraucht um die Optik zu testen.
Nun suche im ACP den Punkt: Designerpack bearbeiten
Öffne diese Rubrik und sieh dir das dann GENAU an.
Das Beste ist du schreibst dir das nun ab, Punkt für Punkt abschreiben.
Nachdem das gemacht ist schließt du diese Seite, da du ja nichts verändert hast einfach durch entweder speichern oder auch einfach das du im ACP auf der RECHTEN Seite auf den Punkt Designerpack erstellen klickst.
Es geht nun links eine neue Seite auf mit genau den gleichen Feldern wie von der Seite die du gerade abgeschrieben hast.
Dort kannst du nun mit Farben spielen.
Um ein schönes Ergebnis zubekommen ist jetzt Geduld und ÜBEN angesagt.
Um jetzt etwas Schönes auf die Beine zu stellen ist vorher „Klauen mit den Augen angesagt“
ABER VORSICHT!!! NICHTS ABKUPFERN!!! DAS IST VERBOTEN!!!DAS ANSEHEN IST ERLAUBT!!!

nobody

Geschrieben von Mirko81 am 05.08.2010 um 17:46:

Nobody wie ich das im Designpack ändere weiß ich ja aber mir kommt es auf andere punkte an z.b. Cellpic vergrößern , überall einen eigenen hintergrund einfügen usw das Farbenändern kann ich ich mag halt einen komplett eigenen style machen und darum fragte ich ja ob vielleicht einer eine styleschule kennt.

Weil empfehlungen sind ja doch manchmal die besten.

Deine anleitung an sich ist aber wiedermal wirklich toll geworden.

Geschrieben von nobody am 05.08.2010 um 18:08:

Eine Style Schule ist mir nicht bekannt.
Alle Boards, besser die Grafiker dort, haben IHRE Geheimnisse die nicht verraten werden wie sie das machen.
Bei einigen bekommt man nicht mal eine Antwort mit welchen Programmen sie "DAS" erstellt haben.

Das einzige was du nach meinem Wissen machen könntest: fragen fragen fragen....
Das kannst du hier, wie du ja gemacht hast machen oder auf reinen Styleboards.
Auf den reinen StyleBoards bekommst du aber mit Sicherheit keine Antwort auf Hilfe.

Es ist ja auch nicht alleine mit Farbe und Pinsel getan, es ist ja auch das Wissen darüber erforderlich wo was wie aufgerufen wird.
Dazu wird das Wissen der Code benötigt.

Es muss ja jeder Farbpunkt aufgerufen werden der genau an dem Punkt erscheinen soll wo er hin muss.

Somit ist es nicht einfach mal eben damit abgetan.

Es muss auch der Code Punkt für Punkt bekannt sein, es muss begriffen sein warum genau dort der Code eingebaut sein muss.

Um dieses zu erlernen ist erst einmal der Aufbau eines WBB2.3.x Code erforderlich.

nobody

Geschrieben von Mirko81 am 05.08.2010 um 18:28:

Mein Lieber nobody könntest du mir den helfen wo ich die cellpic höher mache?Ich habe im Designpack und im Template css nichts gefunden habe extra F3 gedrückt um die stelle zu suchen.

Das wäre sehr freundlich wenn du das wüßtest und mir sagen könntest.

Geschrieben von Listiger_Falke am 05.08.2010 um 19:38:

Das Image cellpic kannst Du je nach Lust und Laune in einer von Dir gewünschten Größe neu erstellen. Da dem Image cellpic weder in Templates noch im CSS eine eigene feste Größe zugeordnet wird kannst Du auch Bilder jenseits von 1000px erstellen.

Zum Verständniss. Cellpic-Images werden normalerweise innerhalb des Boards als Tabellenfüllung eingesetzt, wenn Du z.B. ein cellpic von 1px Breite und 50 px Höhe erstellst, so wird dieses Image einfach so oft in die Zelle eingefügt (automatisch) wie es in die Zelle geht. Ist die Zelle 1000px lang, so geht es also 1000mal nebeneinander rein. Ist die Zelle 100px hoch, so ist das cellpic in 2 Reihen übereinander angeordnet.

Das ist wichtig bei Farbverläufen! Ist das cellpick monocrom (einfarbig) kannst Du es also sehr klein machen, selbst 1x1px sind möglich. Hast Du allerdings einen Farbverlauf, so mußt Du darauf achten das es eine Höhe hat, die die gesammte Tabellenspaltenhöhe abdeckt, denn sonst wiederholt es sich in einer 2ten Reihe untereinander, was sehr unschön aussehen wird. Das gilt auch für die Breite. Bei einem Monocromen Farbverlauf in der <--------> Längsrichtung kann das Bild auch nur 1 px. Breit sein, hat man allerdings einen Farbverlauf in der Längsrichtung wird es schwierig.

Ich empfehle hierz mal den Tread Forenbreite -

Forenbreite - Statisch oder Flexibel?

aus dem Html-Lehrforum zu lesen. Bei einem Farbverlauf sollte man zwingend ein Forum in fester Breite benutzen. Hat man z.B. eine Forenbreite von 1000px, so kann man für Kategorien-Füllung durch cellpic eine Feste Größe von 980px breite vorraussetzen (Ohne einen Tabellenrahmen benutzt zu haben!) Man muß seinem cellpick also in diesem Fall eine Breite von indestens 980px geben.

Auf der anderen Seite sollte man ein cellpic nicht größer machen, als notwendig, denn durch größere Bilder kommt es natürlich auch zu höheren Ladezeiten.

Um das ganze vollständig zu begreifen empfehle ich Dir dich mit Tabellenaufbau und der Füllung von Tabellen zu beschäftigen.

Geschrieben von nobody am 05.08.2010 um 19:42:

Sehe bitte in deinem images Ordner nach.
Dort sollte eine Grafik auffindbar sein mit dem Namen: cellpic.gif

das ist dieser "Grafikschnipsel" der feststeht.
Wenn du jetzt die Höhe, das Aussehen (Farbe ...) verändern möchtest musst du eine neue Grafik bauen mit einem Grafikprogramm.

nobody

Geschrieben von Mirko81 am 05.08.2010 um 20:25:

Hi ich will diese Spalte höher haben die ich makiert habe.
Da bringt nichts mit größere Bilder machen.

Geschrieben von nobody am 05.08.2010 um 20:34:

Meinst du die cellpic.gif in der die Überschrift der Shortbox steht?

Geschrieben von Mirko81 am 05.08.2010 um 20:38:

Ja genau den dunkelgrünen Streifen den möchte ich gerne höher haben das ist ja das Cellpic.gif bild.

Geschrieben von Listiger_Falke am 05.08.2010 um 21:43:

Zitat:

Original von Mirko81
Hi ich will diese Spalte höher haben die ich makiert habe.
Da bringt nichts mit größere Bilder machen.

Da hast Du Recht, denn das cellpick ist nur ein Hintergrundbild und bestimmt daher nicht die Höhe der Spalte. Um die höhe der Spalte zu ändern mußt Du der Spalte eine feste höhe zuweisen oder innerhalb der Spalte ein Bild einfügen.

Die Spaltenhöhe könntest Du ändern in dem Du das zugehörige tpl bearbeitest und der Spalte dort eine feste höhe zuweist

Geschrieben von haumi am 06.08.2010 um 01:36:

So nun mal von vorne.
Die Höhe einer html Zelle wird vom Browser berechnet und kannl über html NICHT beeinflußt werden.
Da kann man noch so viel lesen es geht nicht.

Die Höhe einer Zeilenbox wird jedesmal individuell berechnet und die Berechnungsgrundlage ist der Inhalt dieser Zellenbox.
Die Zeile wird immer so hoch dargestellt so dass das höchste Element in dieser Zellenbox reinpasst.
Setzt ein großes gif in eine Zeile rein und ihr werdet sehen das sie größer dargestellt wird.

Ist die Zellenbox leer, so nimmt der Browser als Berechnungsgrunglage die im Browser eingestellte Schrift und stellt die Höhe der Zellenbox auf das 1,2-fache der Schrifthöhe ein.
Per html kann ich da NICHTS beeinflussen!!!!!!

Es gibt jedoch eine css-Eigenschaft mit der man diese Zeilenhöhe explizit festlegen kann.
Es ist die Eigenschaft line-height.

Diese Eigenschaft nimmt aber auch wieder als Berechnungsgrundlage die Schrifthöhe des Browsers (oder einer vorgegebenen Schrift)
Die Schrifthöhe wird dabei mit 1 em festgelegt.

Der Browser stellt somit die höhe erst mal auf 1,2 em ein.

gebe ich mit line-height = 3em vor, so wird die Zeile tatsächlicht dreifach höher angezeigt.

Jedoch ragen dann Inhalte die höher sind über die Zellbegrenzung hinaus.

Wird der line-height - Wert < 1 oder <100% oder < 1em gewählt, so ragen alle Elemente über die Zellbegrenzung hinaus.

Fazit: Mirko konnte NIRGENDWO eine Antwort auf seine Frage finden,
und wurde meines Erachtens zu Unrecht beschuldigt, er könne nicht lesen.

Ich hoffe das hier nun die Frage erst mal beantwortet ist.

Man kann individuell und nur per css Eigenschaft line-height die Höhe beeinflussen.

LG
haumi

Geschrieben von Listiger_Falke am 06.08.2010 um 02:15:

Vielleicht reden wir etwas aneinander vorbei st1

Wir reden ja nicht von Schriftgrößen und eventuellen Schriftabständen.

Es geht um eine Tabelle. Tabellenaufbau 1 Spalte und 1 Zeile. Als Background dieser Tabelle (Zelle) wird ein Bild, das erwähnte cellpic eingesetzt.

Gewollt ist das die Tabelle höher wird, um ein größeres (höheres) cellpic darzustellen. Die Schrift innerhalb der Zelle wird dabei nicht berücksichtigt, man könnte sie also mittig setzen wie auch obenbündig oder untenbündig.

Wir können aber die Tabelle (und damit die einzelne Zelle) in der Höhe beeinflußen, und zwar über den Zusatz style="height: XXXpx" im <td> - Tag oder im <table> - Tag

Möglicher Aufbau wäre damit z.B. dann

code:
1: 2: 3: 4: 5:	<table style="width: 100%; height: 50px"> <tr> <td>Text oder Inhalt</td> </tr> </table>

Wir kümmern uns also gar nicht um Schriftatribute, sondern nur um die Tabelle. Theoretisch wäre damit das von Mirko gewünschte möglich, praktisch ist dies jedoch mit einem erheblichen Aufwand verbunden, da bei dieser Lösung jedes tpl angepasst werden müßte.

Geschrieben von haumi am 06.08.2010 um 06:22:

Hi Listiger Falke,
mit dem height in deinem code legst du die Höhe der gesamten Tabelle fest und nicht der einzelnen Zelle.
Das Attrubut height gilt für das <td> tag nicht.

Für eine Zellenbox gilt das was ich oben beschrieben habe.

Zitat:

Die Höhe einer Zeilenbox wird jedesmal individuell berechnet und die Berechnungsgrundlage ist der Inhalt dieser Zellenbox.

Zitat:

Wie wird die Höhe der Zellen bestimmt?

Aufgrund der Ausmaße und der vertikalen Ausrichtung ihres Inhalts berechnet der Browser eine Mindesthöhe für jede Zelle. Falls im Stylesheet eine Höhe vordefiniert wurde, wird geprüft, welcher der beiden Höhenwerte der größere ist. Dieser Wert wird dann verwendet. Dabei spielt es keine Rolle, ob es sich um Headerzellen oder Datenzellen handelt.

Die Alternative per css ist die Eigenschaft line-height!

Ich hab jetzt im Designpack bei Tabellenkopf die Zeile

background-image: url(images/cellpic.gif);

ergänzt mit

line-height: 1.2em;

also
line-height: 1.2em;
background-image: url(images/cellpic.gif);

und schon passt es.

Aber das steht nirgendwo beschrieben.

@listiger Falke:

Dein Zitat:

Zitat:

Versuche mal in einem Teplate die Zellenhöhe (td>-Tag) mit height zu vergrößern.
Du wirst feststellen das es nicht geht.

Und natürlich kümmern wir uns auch nicht um Schriftattribute.
Der Browser legt die Höhe fest und wenn nichts zur Berechnung da ist nimmt er die eingestellte Schrift als Grundlage.
Hat mit Schriftattributen in html oder css nicht das geringste zu tun.
Es ist und bleibt eine Browsergeschichte.

LG
haumi

Geschrieben von Listiger_Falke am 06.08.2010 um 11:58:

Gegenbeweis:

Ich habe ein Template mit einer Tabelle erstellt. Der Tabelle wurde nun ein Border gegeben, um sie besser zu sehen. Die Tabelle hat keine Höhe. Die Tabelle hat 2 Zeilen um den Unterschied zu zeigen. Die obere Zeile hat keine Attribute zugewiesen bekommen, die untere einen height-Zusatz hinter dem <td
Um Schriftattribute habe ich mich nicht gekümmert. Der height-Zusatz bezieht sich ausdrücklich nur auf die Zelle, den <td>-Tag

Der vollständige Code der Testtabelle:

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:

<table style="width: 90%" align="center" border="2px" bordercolor="#000000">
	<tr>
		<td style="width: 100%" align="center" border="2px" bordercolor="#000000">Dies ist eine Testtabelle</td>
	</tr>
	<tr>
		<td style="width: 100%" align="center" height="100px" border="2px" border="2px" bordercolor="#000000">Diese Zelle hat 100 Pixel höhe</td>
	</tr>
</table>

Ergebniss siehe Bild im Anhang

Ein sehr gutes Anwendungsbeispiel für die Zuweisung von Höhen innerhalb von Tabellen sind z.B. Flashuhren auf Hintergrundbildern. Dabei muß man die Uhr pixel-genau verschieben können, um sie an der gewünschten Stelle zu plazieren. Würde man das mit Schriftattributen machen würde jeder Browser die Uhr an anderer Stelle zeigen. Um eine Konformität in allen Browsern zu erreichen muß man die Uhren per Standortdefinition der einzelnen Zelle justieren (Es werden 9 Zellen angelegt, die mittlere Zelle enthält die Uhr, die restlichen Zellen dienen der Fixierung innerhalb der Tabelle)

Man kann also das von Mirko gewünschte erreichen, aber der Aufwand wäre sehr hoch.

LG
Listiger_Falke

Geschrieben von haumi am 06.08.2010 um 12:46:

Hi Listiger Falke,
Da muss ich dir Recht geben.
Das kann aber noch nicht allzulange sein.
Alle meine Bücher und auch die Internetseiten, die ich auch eben noch aufgerufen habe, betreff Zeilenhöhe
verweisen NUR auf die css-Eigenschaft line-height.
Aber wie du aufzeigst erkennt das <td> - Tag ja nun auch das Attribut height an.
Wieder dazugelernt.

Da hast du natürlich Recht das man auf diesem Wege in jedem Template dies Zugabe machen muss und das lohnt die Arbeit nicht.

Ich denke aber das die Lösung (per css) die wir nun angewandt haben den Wünschen von Mirko entspricht.

LG
haumi

Geschrieben von nobody am 06.08.2010 um 19:45:

Höhe und Breite erzwingen
http://www2.biochemtech.uni-halle.de/lernwww/tcec.htm

Gestaltung einer Tabelle
http://de.selfhtml.org/html/tabellen/gestaltung.htm

Das zum Thema nicht lesen, nicht suchen.

Wenn ich ausgesprochen habe, was ich ja gemacht habe, dann hat das schon seine Richtigkeit.
Ich habe auch in den Raum gestellt das nicht gesucht wird, das sich darauf verlassen wird das die anderen es schon machen.
Ich habe auch in den Raum gestellt das Tipps und Tricks nicht angenommen werden.
Ich habe auch in den Raum gestellt das man um dieses hier, WBB (html und php) zu erlernen mit den Augen geklaut werden sollte, bzw. da man ja nichts davon kennt klauen muss.
Ich stehe auch dazu dass ich diese Aussagen getroffen habe.

nobody

Geschrieben von Mirko81 am 06.08.2010 um 19:59:

So nun reicht es mir endgültig ich habe sehr wohl angenommen und gelesen nobody wenn man was nicht versteht fragt man dafür ist doch das board da.

Dann deine öffentliche bloßstellung in der Box war verletzend ich sage auch ncht irgendwas über dich.

Aber das du mir sehr oft unschöne patzige antworten gibst und das nur bei mir was anderen schon auffällt das siehst du scheinbar nicht oder?

Ich werde mich hier nun komplett zurückziehen den das muß ich mir nicht geben wenn du ein problem mit mir hast dann sage es mir direckt oder ignoriere mich einfach.Ich lasse mir von dir jedenfalls nicht mehr unterstellen das ich nicht lese oder sonst der gleichen tut mir leid aber das war meiner meinung nach respecktlos.

So für mich hat das Thema sich jetzt erledigt und wenn die Boardleitung mich nun rauswirft tut es mir zwar leid da ich hier ein zwei drei Leute irklich mag aber meine meinung wollte ich jetzt einfach kund tun den das tat weh und ich denke das man auch sowas mal öffentlich schreiben kann.