Bis zum nächsten Treffen sind es noch genau:


Dies ist lediglich unser Testboard - Unser Forum findest du hier: "Zum Forum"

Tutorial (ohne HTML im Beitrag)


Die "eigene Seite" als Funktion im HPM-Forum

in Tutorial (ohne HTML im Beitrag) 19.01.2010 13:43
von achimth • Administrator | 113 Beiträge

Die "eigene Seite" als Funktion im HPM-Forum nutzen, um das Forum noch informativer zu gestalten. (Noch ohne Bebilderung -Stand 19.01.)

Einleitung:
Um die "eigene Seite" im Forum effektiv zu nutzen, kann es erforderlich sein HTML-Kenntnisse zu besitzen, insbesondere wenn man den sogenannten Quellcode direkt und ohne Editor bearbeiten möchte.
Erforderlich kann dieses z. Bsp. auch sein, wenn eingebettete Objekte den Rahmen des Templates sprengen und anschließen angepasst werden müssen.
Um sich einen Überblick über die Möglichkeiten von HTML zu verschaffen, gibt es eine schöne Seite im Internet, auf der sich sowohl Laien als auch Profis noch Tipps und Erklärungen holen können
http://de.selfhtml.org/

Möglichkeiten

Die "eigene Seite" bietet dem Admin eine große Anzahl an Möglichkeiten das eigene Forum weiter zu entwickeln, ohne dabei das Layout des Forums zu verlassen.
Ich zähle hier mal einen Teil auf und sicherlich gibt es noch viele mehr. Im weiteren Verlauf des Tutorials wird an Hand eines Beispiels eine solche Seite mit Hilfe des Editors erstellt.

Über Uns / Über mich-Seite
Eine Seite, um sich und sein Forum vorzustellen. So eine Seite könnte in der Navigation verankert sein, um dem Gast der das Forum betritt sofort einen Überblick über das Angebot im Forum zu geben. Auch nutzbar um, bei einem ansonsten für Gäste geschlossenen Forum, die notwändigen Informationen geben zu können.

Vorstellung des Teams
Hier könnte man ergänzend zur "Über uns-Seite" das Team des Forums, Admins, Moderatoren vorstellen

Ergänzende Informationen zum Forum
So ein Bereich kann genutzt werden um Regeln und Hinweise zur Benutzung zu ergänzen, wenn Sei den Rahmen des zu lesenden Textes bei der Anmeldung sprengen würden.
Hier könnten auch die FAQ erweitert und detailierter beschrieben werden, sowie zusätzlich hinzugefügte Funktionen erklärt werden.

Webseite in das Forum integrieren
Hat der Admin oder die Forengemeinschaft eine eigene Webseite, so kann man diese mittles iframe in die eigene Seite und somit in das Forum integrieren. Damit kann dem Besucher des Forums ein breiteres Spektrum für Informationen zur Verfügung gestellt werden, ebenfalls ohne das Forumlayout zu verlassen.

Fremdinhalte integrieren
Auch Flashobjekte, Videos (z.Bsp. youTube), Chats bis hin zum eigenen Webcamserver lassen sich in eine solche Seite einbinden

Eigenes Kontaktformular
Vielleicht auch interessant ein eigenes Kontaktformular auf eine solche Seite zu setzen, damit Benutzer nähere Information erhalten können und nicht den Weg über die Info aus dem Impressum gehen müssen.

Zur Praxis
Da nun einige Möglichkeiten aufgezählt sind, soll an Hand von Beispielen nun eine Seite erstellt, werden um den Weg einmal bebildert zu beschreiben.

Beispiel 1

Aufgabe:
Erstellung einer Seite mit einer bebilderten Übersicht von CDs, die ein Musiker herausgebracht hat und die mit Verlinkung in einen Forenbereich versehen werden soll, in dem man dann direkt die Songtexte nachlesen kann.
(Anmerkung: Ob es nun CDs sind, das Foren-Team, Bilder von Spielern einer Fußballmanschaft, Bilde rvon Autos (Flugzeugen, LKWS, Zügen..) , die ich näher beschreiben möchte, ist letztendlich völlig egal, es geht hierbei nur um den Ablauf)

Vorbereitung
Falls noch nicht geschehen, wird zunächst das Forum entsprechend vorbereitet. Hierzu werden die notwenigen Kategorien, Foren und Themen erstellt.
In der Regel wird das schon der Fall sein, ich beschreibe es aber hier einmal, für den Fall, das man dabei Neuland betritt.
Im Adminstrationsmenü unter dem Menüpunkt Forum erstellen wir eine Katgorie Musik und eine Forum in dieser Kategorie Songtexte






In der Forenansicht werden nun Themen im Forum Songtexte mit dem Titel der Alben (hier im Beispiel Album 1,2,3 und 4) und in den Beitrag kommen die Songtexte des jeweiligen Albums.






Falls das schon geschehen war, um so besser.

Für den weiteren Ablauf sollten die URL-Adressen der Bilder von den Albencovern zur Verfügung stehen. In diesem Beipiel wird von einem quadratischen Bild von ca. 260x260 Pixel ausgegangen. Sollten Wir möchten in der Gesamtbreite der Seite unter 800 Pixel bleiben, damit alles darauf passt. Sollten Eure Bilde breiter ode rschmaler sein, könnt ihr im späteren Verlauf die Anzahl der Spalten etc. verändern.
Falls noch nicht im Internet hochgeladene Bilder zur Verfügung stehen, so kann man diese z. Bsp. mit
http://www.bilder-hochladen.net hochladen und man bekommt die Bildadresse per Email zugesandt.

Ein Hinweis an dieser Stelle:
Beachtet bitte in jedem Fall die Rechte des Bildinhabers und sichert Euch ab, daß ihr das Bild in dieser Form benutzen dürft.

Die Erstellung der eigenen Seite
(Anmerkung: Ab dieser Stelle sollte vorläufig mit dem Browser Firefox gearbeitet werden, weil die Einbindung des später benötigten Editors beim Internet Explorer noch nicht abgeschlossen ist)

Im Adminmenü Layout wird im Bereich der Punkt "eigene Seite" aufgrufen.





Danach erscheint diese Seite, auf der Neue Seite erstellen ausgewählt wird






Nun baut sich eigentliche Arbeitsfeld zum erstellen de reigenen Seite auf, das sich aus diesen Kernbereichen zusammensetzt:

Bereich für allgemeine Angaben zur Seite
Bereich des Editors, der uns das Erstellen erleichtern soll
Der Ansichtsbereich in dem wir unser Eingaben machen und dank dem Editor alles so sehen, wie es später erscheint
Bereich Speichern







In den oberen Teil werden nun folgende Informationen eingetragen
1. Der Titel (Das wird nachher im Link zur Seite angezeigt)
2. Ein URL-Name (optional) , das heißt so wird es oben in der Adressleiste des Browsers erscheinen, in unserem Fall so: http://xxxxxx.homepagemodules.de/page-CD.html . Das muss nicht angegeben werden, ansonsten wir ein Nummer vergeben.
3. Meta - Description (optional) : Hier kann ein aussagekräftiger Text zur Seite eingetragen werden, der später z.Bsp. über Suchmaschinen gefunden wird.






Die CD-Cover mit Hilfe des Editors auf die Seite

In unserem Beispiel haben wir 4 CD Cover (falls ihr mehr oder weniger habt könnt ihr die folgenden Angaben bei der Erstellung einer Tabelle abändern)
Diese sollen zu dritt in einer Reihe, der Titel darunter, verlinkt in das Forum, dargestellt werden.
Unsere Seite soll symetrisch Aussehen, dazu benutzen wir als erstes die Funktion "Mittig ausgerichtet"

aus dem Editor. Links und rechts davon befinden sich die Symbole für Links und Rechts Ausgerichtet.

Für unser Beispiel brauchen wir folglich Tabelle die 3 Spalten hat und mindestens 4 Zeilen ( 1. Zeile: 3 Cover; 2. Zeile: 3 Titel, 3. Zeile: das letzte Cover; 4. Zeile: der letzte Titel
Wir rufen im Editor die Funktion Tabelle Erstellen,bearbeiten auf



Es erscheint dieses PopUp Fenster

in das wir nachfolgende Eingaben machen:
Spalten :3
Zeilen: 4
Abstand innerhalb der Zellen: 10 (Dadurch legen wir einen Abstand um unser späteres Bild fest, damit diese nicht zu eng aneinander stehen)
Rahmen: 2 (weil hier im Beispiel alles umrahmt sein soll, kann hier die Stärke des Rahmens eingesetzt werden, bleibt das Feld leer erscheint auch kein Rahmen)

Nun den "erweitert" Tab anwählen,

um die folgenden Angaben einzugeben:
Rahmen : dahinter die Option des Rahmens auswählen, im Beispiel nehme ich "alle 4 Seiten Border")
Rahmenfarbe: mit dem Farbfeld eine Farbe auswählen

Jetzt auf "aktualisieren" klicken und im Feld unterhalb sollte nun eine Tabelle mit Rahmen stehen.

Über die Größe nicht wundern, die passt sich nachher der Größe unserer Coverbilder an.

Funktion des Editors "Bild einfügen/ersetzen"






In das linke obere Feld der Tabelle klicken, denn hier soll später das erste Cover erscheinen.
Die Funktion "Bild einfügen/ersetzen" aufrufen und es erscheint ein PopUp-Fenster

Folgende Einagben werden gemacht
Adresse: hier kommt die URL Adresse eures Bildes rein, im Beispiel von meinem Bild.
Beschreibung:Hier der Name des Albums (Dieser würde erscheinen, falls die Grafik mal nicht angezeigt wird)
Titel: Hier der Name des Albums (Dieser erscheint beim Überfahren des Bildes mitz der Maus)

Oben im PopUp in den Tab "Aussehen" wechseln.

Eingaben:
Ausrichtung: mittig (weil das Bild in der Mitte stehen soll)
Ausmaße: hier ist in der Grundeinstellung die Abmessung zu sehen und der Haken steht bei "Ausmaße". Wenn das Bild nun größer oder kleiner wie vorgesehen ist und das Aussehen in allen Feldern gleich sein soll, kann hier der Haken bei Ausmaße entfernt werden und die Abmessung in px kann eingegeben werden.

Der Rest soll und jetzt nicht interessieren.
Auf "einfügen" klicken und das 1. Bild sollte in der Tabelle erscheinen. Die Größe hat sich automatisch geändert.
Das wird jetzt für die Bilder 2 und 3 wiederholt, dann ist unsere 1. Zeile komplett und sollte jetzt ungefähr so aussehen, natürlich mit den eigenen Bildern.






Verlinkung des Bildes mit dem Forumthread herstellen

Nun soll jedes Cover mit einer Seite aus unserem Forum (die hatten wir am Anfang angelegt, oder sind schon da) verlinkt werden.
Dazu klicken wir das Cover 1 an und markieren es somit.
Im Editor wird das Menü "Link einfügen/ersetzen" aufgerufen



und das PopUp Fenster erscheint




Nun wird in einem neuen Browserfenster oder -Tab (das Fenster "eigene Seite", die wir gerade bearbeiten, nicht schließen !!!) unser Forum ganz normal auf und wechseln in das Forum Songtexte und dann auf das Theme Album 1. bei euch sind die Aufrufe dann entsprechend dem was ihr dort habt.
Aus der Adresszeile des Browser, die Seitenadresse kopieren, das geht in dem an sie markiert und mit STRG +C kopiert oder dieses mit der rechten Maustaste anklickt und dann dort auf kopieren geht.
Jetzt zürück in das Fenster, wo die eigene Seite erstellt wird.
In das offene popUpFenster wird dann bei
Adresse: mit STRG + V oder mit den Meü rechte Maustaste "einfügen" die Adresszeile eingefügt.
Titel: Hier wieder den Titel des Albums (im Beispiel Album 1- das wird ebenfalls beim Überfahren mit der Mas angezeigt

Unten im PopUp auf "einfügen" und schon ist die erste Verlinkung erstellt.

Auch das wird wiederholt für die Cover 2 und 3, wobei jedesmal der Link zum jeweiligen Thread im Forum eingefügt wird.

Danach ist die 1 Zeile mit 3 verlinkten Covern fertig

Titel der Alben in die 2. Zeile


In die 2. Zeile kommen nun die Namen der Alben.
Das erste Feld der 2. Zeile anklicken und den Titel des Albums dort eintippen, im Beispiel "Album 1"
Dieser Text steht nun "Links ausgerichtet" in dem Feld. Den Button "Mittig ausgerichtet" aus dem Editor Menü anklicken und schon ist der Text in der Mitte.
Der Text soll etwas größer erscheinen oder eine andere Schriftart haben ?
Dazu wird der Text wie üblich mit der Maus markiert, dann im Editor Menü das Feld "Schriftart" aufklappen, eine Schrift auswählen und der Text wird sich verändern. Das selbe kann mit der "Schriftgröße" gemacht werden

Wiederholt wird das alles für die nächsten 2 Felder.
Und dürfte dann so aussehen






Ausfüllen der Zeilen 3+4

Hier wird der Vorgang für das Cover 4 wiederholt ebenso für den Titel in der untersten Zeile

Abspeichern und Enbinden in die Navigation

Nun ist der Teil beendet und mit dem Klick auf "Speichern" wird die Seite abgespeichert und erscheint als angelegte Seite im Adminmenü "eigene Seiten"

Hinter der angelegeten Seite erscheint der Menüpunkt: Seite der Navigation hinzufügen
Ein Klick hierauf und es wird in das Navigationsmenü gewechselt.


Dort seht die Seite schon in der Bearbeitung.

Wenn der Link nun für Jeden (Gast oder Mitglied) belasse ich es wie es ist und klicke auf Speichern.

Ansonsten hat man unter:
Weitere Einstellungen
und dem weiteren Unterpunkt
Einstellungen für Benutzergruppen


die Möglichkeit das Erscheinen des Links ganz genau einzustellen.

Nach dem Abspeichern sollte jetzt in der Navigationsleiste ein neuer Link zu sehen sein, der zu der eben erstellten Seite führt

Die fertige Beispielseite ist hier zu sehen:
http://204256.homepagemodules.de/page-cd.html

Achim

P.S.
Das Tutorial ist noch nicht abgeschlossen, sondern es wird derzeit daran gearbeitet. Daher ist der Teil hier noch unbebildert und noch nicht abschließned beendet.

Das Copyright des Beitrags und der enthaltenen Bilder liegt beim Autor (Username im HPM-Support-Forum: mihca02) und darf ohne dessen Zustimmung nicht kopiert oder ohne seine Zustimmung verwendet werden.
Kontakt über Impressum


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

Bis zum nächsten Treffen sind es noch genau:





Infos zum Projekt 2009

Testboard


*this message is printed on 100% recycled electrons*

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

zuletzt bearbeitet 20.01.2010 11:23 | nach oben scrollen






Neuestes Mitglied:

Im Moment sind 1 User online ( 0 Mitglieder | 1 Gast).
Das Forum hat 73 Themen und 141 Beiträge.
Der Rekord liegt bei 26 Benutzern am 01.11.2012 12:08 Uhr.
Mitglieder | Wer ist Online? | FAQ | Impressum


Xobor Einfach ein eigenes Forum erstellen | ©Xobor.de
Datenschutz