Registrierung Galerie    Mitglieder    Team    Suchen    Hilfe
Bilder hochladen    Forum    Portal

haumis-wbb-schule » Suche » Suchergebnis » Hallo Gast [anmelden|registrieren]
Zeige Themen 1 bis 6 von 6 Treffern
Autor Beitrag
Thema: JGS-Portal ~ Menübox erstellen
Listiger_Falke

Antworten: 1
Hits: 5566

Menü 2 mit Pulldown 23.07.2010 00:57 Forum: Tutorials zur individuellen Bordgestaltung

Das im ersten Beispiel gezeigte Menü als Textmenü kann bei sehr vielen Links doch recht groß werden. Um eine Abhilfe zu schaffen bei größeren Menüs kann man auch Pulldowns in das Menü integrieren.

Beispiel 2 Textmenü mit Pulldown
Klick hier für ein Menü mit Pulldownintegration

Code für den Pulldownbereich
code:
<script>
var vers = navigator.appVersion;
var name = navigator.appName;
vers_ie = vers.substring(22,23);
vers_nc = vers.substring(0,1);
if ((name == "Microsoft Internet Explorer" && vers_ie == 5) || (name == "Netscape" && vers_nc == 5)){
function auswahl(link) {
 if(link == "leer") {
   document.forms[0].reset();
  document.forms[0].elements[0].blur();
   return;
 }else {
   location.href = link;
   document.forms[0].reset();
   document.forms[0].elements[0].blur();
  }
 }
}
</script>
<form action="">
<select size=1 name="Auswahl" onChange="auswahl(this.form.Auswahl.options[this.form.Auswahl.options.selectedIndex].value)" style="width:150px; background-color:#FFFFFF; font-size:8; font-weight:bold; font-family:Arial; Color:#000000;" width="150">
<option value="leer">~~~UserCP~~~</option>
<option value="1.php?action=profile_edit{$SID_ARG_1ST}">Profil bearbeiten</option>
<option value="usercp.php?action=options_change{$SID_ARG_1ST}">Einstellungen editieren</option>
<option value="leer">===============</option>
<option value="bank.php?action=view{$SID_ARG_1ST}">Bank</option>
<option value="lottospielen.php{$SID_ARG_1ST}">Lotto</option>
<option value="gutscheinhack.php{$SID_ARG_1ST}">Gutscheine</option>
<option value="leer">===============</option>
<option value="boardhp.php?action=edit{$SID_ARG_1ST}">HP bearbeiten</option>
<option value="vgprofil_gal.php{$SID_ARG_1ST}">Profilgalerie</option>
<option value="autogalerie.php?action=show_user_daten{$SID_ARG_1ST}">Autogalerie</option>
<option value="mein_bazar.php{$SID_ARG_1ST}">Inserate</option>
<option value="leer">===============</option>
<option value="usercp_knuddels_shop.php?do=kaufen{$SID_ARG_1ST}">Knuddelshop</option>
<option value="smilieshop.php{$SID_ARG_1ST}">Smilieshop</option>
<option value="wbbshop.php{$SID_ARG_1ST}">WBB-Shop</option>
</select></form>


Der Obere Bereich des Scripts muß so übernommen werden, im unteren Bereich wo die Links aufgerufen werden kann der Code natürlich an die eigenen Bedürfnisse angepasst werden.

style="width:150px; background-color:#FFFFFF; font-size:8; font-weight:bold; font-family:Arial; Color:#000000;" width="150"> Dieser Bereich bestimmt das aussehen des Pulldowns und kann individuell angepasst werden.
<option value="usercp.php?action=options_change{$SID_ARG_1ST}">Einstellungen editieren</option>Einzelner Linkcode, wie in Beispiel 1 im ersten Tread kann jeder einzelne Code angepasst werden an die Bedürfnisse
<option value="leer">===============</option> Diese Codepassage ist für Trennungen von einzelnen Bereichen


Mittels Pulldowns (Man kann auch mehrere davon innerhalb des Menüs verwenden) kann man die Länge des gesamten Menüs kleiner halten. Natürlich gibt es auch die Möglichkeit andere Pulldownscripte einzusetzen, z.B. mit Bestätigungsbutton.

Thema: JGS-Portal ~ Menübox erstellen
Listiger_Falke

Antworten: 1
Hits: 5566

JGS-Portal ~ Menübox erstellen 23.07.2010 00:40 Forum: Tutorials zur individuellen Bordgestaltung

Benutzer des JGS-Portals haben es schon bemerkt... man kann sehr schlecht andere Seiten in das Menü integrieren als die Vorgegebenen.

Abhilfe gibt es indem man einfach eine eigene Portalbox mit einem eigenen Menü erstellt.

Vorgehensweise.
Erst einmal müßen wir eine tpl erstellen, die als "Linkseite" dient.
Da wir innerhalb der Portalboxen direkt mit html-Codes arbeiten können ohne eine Sprache definieren zu müßen arbeiten wir quasi zwischen <body> ~ </body>. Das bedeutet, wir können den sonst geforderten Headerbereich der html-Sprache genauso weglassen wie den Code <html> </html>

Beispiel 1
Klick hier für ein einfaches Menü

Das ist ein einfaches Textmenü, in dem Beispiel auch ohne Verweise, und vor allem ohne jeglichen zusätzlichen Code auch an das Design (den Style) angepasst.

Code für ein solches Menü:
code:


Den Codebereich kann man jederzeit an die eigenen Bedürfnisse anpassen

Eine einzelne Codezeile lautet immer:
<font class="smallfont"><strong>»</strong><a href="index.php{$SID_ARG_1ST}" style="text-decoration: none"><b>Forum</b></a></font><br />
Wir müßen also für jede Seite, die wir in das Menü einbinden wollen
1. die php ändern, im Codebeispiel index.php{$SID_ARG_1ST} <--- einfach nur den Namen der aufzurufenden Seite eintragen
2. Den Text des Links ändern. "Forum" also in dem Code gegen die Seite ändern, die aufgerufen werden soll.


Wir können nun durch das untereinander schreiben einzelner angepasster Codezeilen ein Menü erstellen.
Wollen wir einzelne Bereiche trennen, z.B. Inhalte des User-CP optisch von Spieleverweisen trennen, so benutzen wir den Code
code:
<hr />

Durch das <hr /> wird eine waagerechte Linie eingefügt

Die Seiten werden durch den oben genannten Code im gleichen Fenster geöffnet. Wollen wir einzelne Seiten in einem separaten Fenster öffnen lassen, so müßen wir den Grundcode ändern.
code:


Durch den Zusatz target="_blank" bestimmen wir nun, das dieser Verweis in einer Extraseite geöffnet wird. Das ist bei einigen Seiten wie z.B. Verweise auf die WIW oder einem Chat sinnvoll.

Änderung der Schriftgröße: In dem Code wird als Schriftgröße "smallfont" benutzt. Natürlich kann man diese Schriftgröße auch austauschen entweder gegen "normalfont" oder eine eigene Schriftgröße.

Durch das einfache untereinanderschreiben dieser Codezeilen können wir uns ein individuelles Menü erstellen.


Einbinden des Menüs in das Portal: Nachdem wir unser Template erstellt haben müßen wir es eindeutig benennen. Ich selbst benutze für eigene Templates immer vor dem Namen einen eindeutigen Zusatz (bei mir z.B. zzz_) Auf diese Weise finde ich eigene Templates schnell wieder und da meines Wissens kein anderer Hack den Zusatz zzz_ benutzt überschreibe ich auch nichts. Wir können also für dieses Beispiel das Template zzz_jgs_portalmenue.tpl nennen.
Nach dem wir das Template hochgeladen und gecacht haben gehen wir in das ACP. Im JGS-Portal-Bereich klicken wir dann auf Box hinzufügen Bei Titel der Box: geben wir nun einen Namen an. Anbieten würde sich "Menü"
In dem Feld Vorgefertigte Boxen tragen wir nun ein

code:
[TPL]zzz_jgs_portalmenue


Falls Ihr dem Template einen anderen Namen gegeben habt natürlich den entsprechenden Namen hinter dem [TPL] verwenden, OHNE den Zusatz .tpl (Also ohne die Dateiendung)

Dann noch die Gruppenrechte eintragen, wer das Menü sehen darf

Boxenausrichtung horizontal ? Links
Boxenausrichtung vertikal ? Oben
Box anzeigen ? Box anzeigen
Alle anderen Anpassungen nach Euren Einstellungen vornehmen
Dann speichern

Nachdem nun eine Menübox erstellt wurde muß diese auch in das Portal eingebunden werden. Wir gehen nun auf Seiten/Boxen anzeigen und dort auf Boxen im Bereich Portal (Meist ID 1)
Übersicht Boxen links --> Seite: Portal suchen wir nun in dem Pulldown unsere Menü-Box. Wenn diese eingestellt ist auf neue Box einordnen klicken. Danach die Reihenfolge festlegen, in welcher die Box eingeordet sein soll und auf Boxen sortieren klicken.
Nun sollte die Box im Portal sichtbar und Verwendbar sein.

Thema: WBB 2.3.6 - Eigene Seiten erstellen (Ohne Sprachvariablen)
Listiger_Falke

Antworten: 0
Hits: 2243

Text WBB 2.3.6 - Eigene Seiten erstellen (Ohne Sprachvariablen) 22.07.2010 23:05 Forum: Tutorials zur individuellen Bordgestaltung

In diesem Tread geht es um die Erstellung eigener Seiten für das Forum
Forensoftware WBB 2.3.6

Wir erstellen hiermit reine html-Seiten, möglich wäre auch Javascript, Flasheinbindungen usw. NICHT möglich ist hiermit alles, was Datenbankabfragen benutzt. Für Datenbankabfragen wäre es notwendig den php-Code zu erweitern, das würde allerdings php-Kenntnisse vorraussetzen.


1. Wir benötigen eine php-Seite. Dazu erstellen wir uns eine Seite mit folgendem Inhalt:

php:
<?php
$filename
="xxx.php";
require(
"./global.php");
require (
"./acp/lib/class_parse.php");
if(!
$wbbuserdata['userid']) access_error();
eval(
"\$tpl->output(\"".$tpl->get("xxx")."\");");
?>


Erklärung:
$filename="xxx.php"; <------ der Name der php. Wir ersetzen das xxx gegen das von uns gewünschte, z.B. Impressum oder Foreninfos etc. (Passenden Namen für den Inhalt wählen)

if(!$wbbuserdata['userid']) access_error(); <-------- Dieser Bereich sorgt dafür, das nur Angemeldete User diese Seite betreten können, Gäste eine Fehlermeldung und Aufforderung zum einloggen bekommen. Sollen auch Gäste diese Seite sehen können kann man diese Zeile einfach löschen.

eval("\$tpl->output(\"".$tpl->get("xxx")."\");"); <------ hier muß das xxx gegen einen passenden Templatenamen ersetzt werden


Nun haben wir erst einmal die php fertig. Wir benötigen jetzt aber ein Template, in dem der Inhalt definiert wird. Dazu erstellen wir eine tpl mit folgendem Grundinhalt:

code:


Das Template ruft über $header (und $headinclude ) sowie $footer den Header und den Footer mit auf, so das eine vollständige Forenintegration gegeben ist.

Erklärung:
<title>$master_board_name | Seitentitel</title> <------ Hier müßt Ihr den "Seitentitel" gegen euren Seitentitel ersetzen, also wenn es z.B. ein Impressum werden soll gegen "Impressum"

<td align="left"><span class="smallfont"><b><a href="index.php{$SID_ARG_1ST}">$master_board_name</a> »
Seitenname    </b></span></td>
<-------- "Seitenname" muß natürlich auch gegen einen passenden Titel Eurer Seite ersetzt werden

<!-- Hier Euren eigenen Code einsetzen --> <!-- Ende des eigenen Codes --> <------ Zwischen diesen beiden Zeilen könnt Ihr nun Euren eigenen Code eintragen. Möglich ist hier alles, was auch innerhalb einer html-Seite realisierbar wäre, also neben reinem html-Code auch Javascript, Flash usw.


Das Template muß natürlich identisch mit dem Templatenamen sein, der oben in der php eingetragen wurde.

Die php und die tpl nun hoch laden (mittels FTP), im ACP das Template importieren ( & cachen) und dann die php im Browser aufrufen zum testen.

Kleiner Tip: Ich selber benenne Templates, die ich selbst erstelle, immer mit einer einheitlichen Vorgabe - zzz_namedestemplates.tpl
Auf diese Weise weiß ich immer welches meine eigenen Templates sind, und da meines wissens kein anderer Hack den Vorsatz zzz_ benutzt überschreibe ich auch nie ein schon vorhandenes Template.


Diese Seite benutzt noch keine Sprachvariablen, eine Seite mit Sprachvariablen wird in einem späteren Tutorial behandelt

Thema: Forenbreite - Statisch oder Flexibel?
Listiger_Falke

Antworten: 1
Hits: 2136

22.07.2010 20:56 Forum: Tutorials zur individuellen Bordgestaltung

Hier noch einmal die Unterschiede Statisch - Flexibel


Bild 1
Ein Statisches Forum mit 1000 Pixel Breite bei einer Auflösung von 1024x768 Pixel



Bild 2
Ein Statisches Forum mit 1000 Pixel Breite bei einer Auflösung von 1680x1050 Pixel
Das Forum ist identisch groß, der freie Platz der bleibt wurde mit schwarzem Hintergrund gefüllt. Dieser kann aber an das Design angepasst werden (Auf dem Bild ist es kleiner, weil die Bilder angepasst wurden!)


Bild 3
Ein Flexibles Forum mit 98 Prozent Breite bei einer Auflösung von 1024x768 Pixel


Bild 4
Ein Flexibles Forum mit 98 Prozent Breite bei einer Auflösung von
1680x1050 Pixel
Das Forum passt sich dem Bildschirm an, jedoch betrifft dieses nicht Grafiken. Diese bleiben immer identisch groß. Auf den ersten Blick wirkt diese Lösung besser, aber sie birgt viele Probleme bei der individuellen Gestaltung. Daher ist die Statische Variante vorzuziehen, wenn man mit Grafiken arbeiten will.

Thema: Forenbreite - Statisch oder Flexibel?
Listiger_Falke

Antworten: 1
Hits: 2136

Text Forenbreite - Statisch oder Flexibel? 22.07.2010 20:03 Forum: Tutorials zur individuellen Bordgestaltung

Ich gehe hier an dieser Stelle bewußt nicht auf Fachbegriffe wie Pixel, Prozentangaben von Tabellen usw. ein. Dies wird an anderer Stelle geklärt! Falls etwas unklar ist bitte einfach nachfragen :D


Die meißten Foren benutzen Styles mit einer flexiblen Breite. Flexibel heißt es passt sich der Auflösung des Bildschirms des Betrachters an. Jemand der einen Monitor mit 1024 Pixel Breite hat hat also das Forum genauso Bildfüllend (100%) wie jemand, der 1900 Pixel Breite hat. Auf den ersten Blick ist dies schön, da man keine Ränder hat.

Will man sein Board aber individuell gestalten, birgt dies enorme Nachteile. Grade bei Einsatz von Grafiken kann eine flexible Breite das gesamte Design zerstören. Derjenige, der das Design des Forums erstellt, hat einen Monitor, und sieht das Forum in der Auflösung seines Monitors. Jemand Anderes hat eine andere Auflösung, bei Ihm sieht das Forum dann total falsch dimensioniert aus. Das ganze mal in einem Beispiel:

Wir haben einen Newsscroller im Portal erstellt. Der Kopfbereich des Scrollers wurde mit einer Grafik versehen, der Inhalt des Scrollers wird über einen Marquee-Befehl gescrollt.



Dieser Scroller beim Ansehen des Portals über einen Bildschirm mit 1240px-Auflösung



Der gleiche Scroller auf einem Monitor mit 1600px-Auflösung (Beide Bilder verkleinert dargestellt)



Problemstellung: Wir können zwar in Boxen Tabellen mit Werten erstellen, die sich einer flexiblen Auflösung anpassen, so ist in diesem Beispiel die 3-Spaltige Tabelle des eigendlichen Scrollers mit 2 Reihen (Links und Rechts) von je 14px und der 3. Reihe (Die Mitte, das Scrollfeld) mit keiner Angabe, bei einer Tabellenweite von 100 Prozent also dem Restwert (100 % minus 28px) versehen, aber spätestens die obere Grafik passt sich nicht mehr der Tabelle an. Man könnte zwar auch hier wieder mit einer Tabelle arbeiten, um einen Randbereich zu schaffen und einen Innenbereich, aber wer einmal mit Grafiken gearbeitet hat weiß um die Probleme spätestens bei Farbverlaufsbildern. Noch schlimmer wird es wenn man z.B. Linkboxen schafft (Im Ersatz zur Standartbox "Links" im Portal als Beispiel) Arbeitet man hier mit Austauschgrafiken (Hoovereffekt Bildertausch), so muß man eine exakte Breite einhalten.

Lösung: Wir definieren von vornherein eine feste Auflösung des Forums. Wenn wir dem Forum eine feste Darstellungsbreite geben, bewährt haben sich hier 1000 Pixel, so sieht das Forum egal auf welchen Bildschirm man es betrachtet immer identisch aus. Das Verhältniss der Boxen z.B. ist dann immer identisch zueinander. Man kann im Forum nun in allem, was man anpasst, immer eine feste Breite messen. Mit der gemessenen Weite kann man dann die Grafiken immer genau an die Größe anpassen, die man benötigt, um bei jedem Betrachter das gleiche zu zeigen.

Als Beispiel: Im myWBB-Portal lite (Forensoftware wbblite 1.0.2) haben bei Einsatz von 2 Boxen (Links und Mitte) die Boxen immer folgende Breite:
Linke Box – 170 Pixel (Innenmaß)
Mittlere Box – 784 Pixel (Innenmaß)
Bei Benutzung von 3 Reihen ändern sich diese Maße natürlich, daher muß man vorher festlegen, wie viele Reihen man benutzen möchte.
Je nachdem wie viele Boxen wir nun benutzen, 1-, 2- oder 3- Reihig können wir nun immer bestimmen wie breit eine Grafik sein muß, um Boxenfüllend zu sein. Die Box sieht bei jedem identisch aus. Das gleiche gilt auch für die WBB 2.3.6-Portale (Dazu allerdings mehr in den Tutorials zu diesen Portalen)


Wie stellt man eine feste Breite ein?

WBBlite 1.0.2
Im ACP unter Designpack bearbeiten bei den einzelnen Designs (Styles) bei äußere Tabelle ----> Weite der äußeren Tabelle: 1000px eintragen


WBB2.3.6
Im ACP unter Designpack bearbeiten bei den einzelnen Designs (Styles) bei Äußere Tabelle ----> Tabellenweite: 1000px eintragen



Das gilt NUR für Designs, die nicht schon von vornherein eine Größe zugewiesen bekommen bestimmt durch Ihr Designinhalt, also Designs, die nicht explizit Randgrafiken (Styleabschlussgrafiken) benutzen! Falls Designs benutzt werden, die schon eine feste Pixelangabe haben, also KEINE Prozentangabe, so auch bei diesen Designs keine Änderung vornehmen! Es ist auf jeden Fall sinnvoll keine Designs zu mischen, die feste Werte, also Pixelangaben haben, und Designs, die flexible Werte haben (Prozentwerte).


Nachteile:Benutzer, die eine kleinere Auflösung als 1024px benutzen haben durch diese Anpassung einen Scrollbalken unten. Allerdings dürfte dies eher eine verschwindend geringe Anzahl von Benutzern betreffen, denn 1024px Auflösung hat heutzutage jeder auch kleinere Laptop.
Nachteil 2: Benutzer mit größeren Bildschirmauflösungen haben nun neben dem Forum einen Rand. Dieses ist jedoch nicht wirklich ein Nachteil, sondern kann durchaus positiv in das Design integriert werden. Unter Rand versteht man links und rechts einen Hintergrund, weil das Forum nun nicht mehr 100 Prozent der Breite des Bildschirms ausfüllt.


Thema: Der Falke ist gelandet
Listiger_Falke

Antworten: 1
Hits: 1826

Der Falke ist gelandet 22.07.2010 00:46 Forum: Wer bin ich? oder auch ich stelle mich vor

Hallöchen, ich bin der Listige_Falke,
in den meißten Fällen bin ich zusätzlich noch mit dem Nick Frechdachs unterwegs, welcher aber überhaupt nicht zu mir passt, denn eigendlich bin ich viel zu lieb für diese Welt *gg*

Real höre ich auf den Namen Thorsten...... oder hin und wieder auch auf Kosenamen wie "Nervi" - zumindest wenn meine Frau sie benutzt :D
Tja, was will ich hier? Im besten Falle meine Hilfe anbieten, denn im Prinzip beherrsche ich html zumindest soweit, als daß ich meine Probleme selbst lösen kann. Ich bin zwar kein Fachmann, aber doch durchaus erfahren im HP-Bau.

Falls Bedarf besteht würd ich auch hin und wieder mal ein Tutorial veröffentlichen für den Einsatz von html innerhalb der Forensoftware Lite 1.0.2 sowie 2.3.6 (Andere Forensoftware benutze ich nicht, deswegen spezifisch für diese Boards - schließlich muß alles immer geprüft sein)

LG
Listiger_Falke

Zeige Themen 1 bis 6 von 6 Treffern

Powered by Burning Board Lite 1.0.2 © 2001-2004 WoltLab GmbH