[3.2] Bilder anordnen mit Endlosbildern + Rahmen + Suchfeld + Kategorien einklappen + Forenliste als Rechteck

[Rieke]

Hallo,
Ich bastel gerade an meinem Forumdesign und habe da ein paar Fragen an dich. Als Ausgangspunkt verwende ich Prosilver. (localhost auf dem Computer, wenig Erfahrung, alle Videos von Lehrling gesehen die sind echt super).
1.) Welchen Code muss ich hinter dem Background-image eingeben, damit sich dieser immer wieder wiederholt? Ich will eine Seamless Textur verwenden. Könnte das Probleme mit kleineren Bildschirmen geben? Wäre so etwas möglich: http://www.bilder-upload.eu/show.php?fi ... 249007.jpg
2.) Bei den Kategorien würde ich ebenfalls gerne Leisten verwenden die aus einem Anfangsbild, einem sich wiederholenden Bild und einem Endbild bestehen. Wie muss ich das schreiben?
3.) So in etwa will ich auch den Rahmen um den body herum getalten. Also wie bei dem PBWoW-Style (gibt es nicht für 3.2): https://www.phpbb.com/customise/db/styl ... e242e2d663. Kann ich bestimmen, wie viel Abstand der Rand des Bodys zu den Kategorien hat? Mache ich das über die Forenbreite?
4.) In dem zuletzt erwähnten Style -PBWoW- ist die Suchleiste anders. Wo finde ich im PBWoW-Style den Code und wo muss ich ihn dann in der 3.2'er Version eintragen?
5.) Und wie mache ich es, dass die Kategorien so angezeigt werden, wie in dem PBTech und PBWoW Style? Kann ich es so formulieren, dass die Sub-Foren auch angezeigt werden? In dem PBWoW-Child-Style PBHeros ( http://www.avathar.be/bbdkp/?style=53 ) wird für die Foren-Rechtecke ein Mouseover Effect verwendet. Bedeutet das, dass ich dort ein Hintergrundbild verwenden kann? Kann ich die Größe der Rechtecke festlegen, so dass es auch bei kleinen Bildschirmen die Größe behält (Will auch dort einen schönen Rahmen drum machen)?
6.) Und zum Schluss noch die Frage, wie die hübschen Dreiecke vor die Kategorien kriege, um diese einzuklappen, wie bei dem zuletzt gelinkten PBHeros-Style.
Ich hoffe du kannst mir ein bischen weiterhelfen.
Hab einen schönen Tag und liebe Grüße
Rieke

[Lehrling]

Uih, das sind ja viele Frage...

1.) Welchen Code muss ich hinter dem Background-image eingeben, damit sich dieser immer wieder wiederholt?

Das sollte damit funktionieren:
background-repeat: repeat;

2.) Bei den Kategorien würde ich ebenfalls gerne Leisten verwenden die aus einem Anfangsbild, einem sich wiederholenden Bild und einem Endbild bestehen. Wie muss ich das schreiben?

Dafür braucht man drei Container. Reine Änderungen im Stylesheet reichen da also nicht aus. Du musst die entsprechende Template-Datei abändern und da wird es knifflig.

3.) Kann ich bestimmen, wie viel Abstand der Rand des Bodys zu den Kategorien hat? Mache ich das über die Forenbreite?

Am sinnvollsten wird es sein,wenn du dem page-body einen Marginwert größer 0 zuweist, also z.B. margin: 25px; oder so.

4.) In dem zuletzt erwähnten Style -PBWoW- ist die Suchleiste anders. Wo finde ich im PBWoW-Style den Code und wo muss ich ihn dann in der 3.2'er Version eintragen?

Du solltest in der Datei overall_header.html nach

Code: Alles auswählen

<!-- EVENT overall_header_searchbox_before -->
			<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
			<div id="search-box" class="search-box search-header" role="search">
				<form action="{U_SEARCH}" method="get" id="search">
				<fieldset>
					<input name="keywords" id="keywords" type="search" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search tiny" size="20" value="{SEARCH_WORDS}" placeholder="{L_SEARCH_MINI}" />
					<button class="button button-search" type="submit" title="{L_SEARCH}">
						<i class="icon fa-search fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH}</span>
					</button>
					<a href="{U_SEARCH}" class="button button-search-end" title="{L_SEARCH_ADV}">
						<i class="icon fa-cog fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH_ADV}</span>
					</a>
					{S_SEARCH_HIDDEN_FIELDS}
				</fieldset>
				</form>
			</div>
			<!-- ENDIF -->
			<!-- EVENT overall_header_searchbox_after -->

suchen.

6.) Und zum Schluss noch die Frage, wie die hübschen Dreiecke vor die Kategorien kriege, um diese einzuklappen, wie bei dem zuletzt gelinkten PBHeros-Style.

Lad dir den Style herunter und suche im Stylesheet nach /* Collapseable blocks (ab Zeile 2072). Nimm das als Vorlage für deinen Style.
LG

[Rieke]

Hallo Lehrling,
Vielen Dank für deine Antwort.
Ich fange mal von unten an: Das mit den Einklapp-Dreiecken habe ich versucht, aber das Ergebnis sah so aus: http://www.bilder-upload.eu/show.php?fi ... 295600.png. Muss das wirklich ins Stylesheet rein? Das ist der Code, den ich gefunden habe:

Code: Alles auswählen

/* Collapseable blocks
--------------------------------------------- */
.collapse-box h2,
.stat-block h3 {
	font-family: "exo","Myriad Pro",Myriad,Arial,sans-serif;
	color: #ECFFFF;
	text-shadow: 0 0 16px #009CFF;
	border-bottom-color: #172040;
}
.collapse-box h2:hover,
.stat-block h3:hover {
	border-bottom-color: #FE00F5;
}

.collapse-box h2 a:link, .collapse-box h2 a:visited,
.collapse-box h2 a:link a, .collapse-box h2 a:visited a,
.stat-block h3 a:link, .stat-block h3 a:visited,
.stat-block h3 a:link a, .stat-block h3 a:visited a { color: #ECFFFF; }

.collapse-box h2 a:hover,
.collapse-box h2 a:hover a,
.stat-block h3 a:hover,
.stat-block h3 a:hover a { color: #FFF; text-decoration: none; }

.collapse-box h2 a[href="#"]:before,
.stat-block h3 a[href="#"]:before {
	content: "\f0d8";
	font-size: 0.8em;
	opacity: 1;
}
.collapse-box h2.open a[href="#"]:before,
.stat-block h3.open a[href="#"]:before {
	content: "\f0d7";
}

.collapse-box h2 a:before,
.stat-block h3 a:before {
	color: #523878;
}
.collapse-box h2:hover a:before,
.stat-block h3:hover a:before {
	color: #A41CB0;
	text-shadow: 0 0 5px #FE00F5;
}

Ich habe mirden PBWoW Style genauer angesehen. Dabei habe ich festgestellt, dass die Collaps-Box an weiteren Stellen erwähnt wird. Zum Beispiel auch im Template: forumlist-body . Darin werden auch Forum-blocks erwähnt. Ich nehme mal an, dass diese für die Darstellung der Foren als Rechtecke sind.

dann die Suchleiste. Ich habe das in die overall_header eingetragen doch leider finde ich im ACP den Link zum Cache leeren nicht (vigLink ist aktiviert): http://www.bilder-upload.eu/show.php?fi ... 297016.jpg Wie finde ich denk Link? Ich habe das ganze ACP nun durchsucht, kann es aber nicht finden.

Page-body Marginwert habe ich geändert und das hat super funktioniert. Vielen Dank.
Der sich wiederholende Background hat auch funktioniert.

Ich denke ich werde mir mal das PBWoW Style genauer ansehen und mir alle Sachen rauskopieren, die mir verdächtig vorkommen. Ich habe im template Ordner gesehen, dass in der Forumlist_body.html eine Klasse definiert wird, die sich Forum-Blocks nennt. Ich nehme mal an, dass das mit der Darstellung des Forums als Rechtecke zu tun hat. Ich nutze Firefox und habe mal durch Rechtsklick- Element untersuchen mir das Style etwas genauer angeschaut. Die Klassen für die Rechtecke / Blocks ist Forum-locks und row. Ich glaube bis ich da durchblicke dauert es noch eine Weile .
Vielen Dank nochmal und liebe Grüße
Rieke