Anleitungen

Anleitungen und How-Tos zur Gestaltung der Homepage.

Mathematische Formeln einfügen

Du möchtest Formeln in einem Beitrag darstellen wie

a^{2} + b^{2} = c^{2}

oder

V = \frac{1}{3}a^{2} \cdot h      ?

Mit Hilfe des Formeleditors auf http://www.matheboard.de/formeleditor.php kannst Du Dir eine Formel zusammenstellen, die Du dort zur Kontrolle auch angezeigt bekommst. Das wird dann zum Beispiel für die Formeln oben solcher Code:

a^{2} + b^{2} = c^{2}

bzw.

V = \frac{1}{3}a^{2} \cdot h

Diesen Text musst Du dann nur in einen Beitrag hineinkopieren und zwischen {*tex} und {*/tex} (ohne die Sterne nach { !) einfügen (nicht [latex] und [/latex]) - und schon hast Du Deine Formel.

Info für neue Autoren: zuerst Editor auswählen

Um komfortabel Beiträge schreiben und gestalten zu können, sollte der JCE-Editor verwendet werden. Diesen könnt Ihr im Benutzermenü unter "Deine Details" auswählen ("Editor - JCE 1.5.4").

Bitte beachtet, dass neue Beiträge noch nicht sofort erscheinen - sie müssen erst noch durch Thomas & Gehilfen freigeschaltet werden.

Datei zum Download bereitstellen

Auch als normaler Autor ist es möglich, eine Datei auf dem Webserver zu laden und in einem Beitrag zu verlinken, wie zum Beispiel die pdf Dateien der langfristigen Hausaufgaben.
Erstelle dazu einen normalen Textbeitrag. Markiere den gewünschten Verweis-Text und wähle im Editor den Button "Link einfügen".
datei_einf_1

Es öffnet sich das Fenster des "erweiterten Linkmanagers". Wähle den Button "Durchsuchen".

datei_einf_2

Im folgenden Dialog gibt es die Möglichkeit, deine Datei hoch zu laden (Upload). (Vorher solltest du bitte unbedingt ein sinnvolles Verzeichnis auf dem Server wählen bzw. ein neues Unterverzeichnis anlegen.

Datei_einf_3

Nun öffnet sich ein drittes Fenster und endlich kannst du Dateien vom eigenen Computer auswählen und hochladen. Diese lassen sich dann mit "Insert" einfügen.


Einen Beitrag schreiben (z.B. für Klassen-Homepage)

Sobald man als Autor angemeldet ist, kann man über den Punkt "Beitrag erstellen" unter "Schulhomepage bearbeiten" im Benutzermenü einen Beitrag schreiben.

Bei einem neuen Beitrag sollte man zuerst einen Titel vergeben und im unteren Teil unter "Freigeben" schon einmal die passende Kategorie auswählen. Damit wird gesteuert, unter welchem Menüpunkt der Beitrag erscheint. Bei einem Beitrag, der auf der Klassenseite erscheinen soll, die Kategorie "Klassen" und als Unter-Kategorie dann das Jahr, in dem Schulzeit zu Ende geht (gegebenenfalls mit a oder b ergänzt), eintragen. Diese Kategorie bleibt über alle Schuljahre gleich - man kann die Zahl auch herausfinden, wenn man im Klassenhomepage-Menü auf seine Klasse geht und dort in die Zeile mit der Web-Adresse schaut.

Wichtig ist die Auswahl "Freigegeben - ja". Den Beitrag normalerweise nicht auf der Startseite anzeigen lassen, "Autor-Alias" kann frei gelassen werden und weitere Punkte erklären sich selbst. Die Zugriffsebene "öffentlich" bedeutet, dass der Beitrag für alle sichtbar ist, "registriert" heißt, nur für registrierte Benutzer und bei "spezial" wird der Beitrag nur für Autoren und Mitwirkende angezeigt.

Dann kann man im jce-Editorfenster den Beitrag schreiben. Hier ist die Erfassung von Text und Tabellen einschließlich verschiedener Formatierungen möglich, ebenso können Bilder und Links eingefügt werden. Wenn man mit der Maus über die Buttons vom Editor fährt, werden die Funktionen der Buttons aufgeblendet.

Bitte für Überschriften keine größere Schrift, sondern unter "Format" besser "Überschrift 1-4" auswählen, damit die Schriftgröße sich bei Änderung der angezeigten Schriftgröße durch den Leser entsprechend mit verändert.

Neben dieser Anleitung bitte auch die für Tabellen, Bilder und Bildergalerien beachten.

Früher erstellte Beiträge ändern kann man an der Stelle, wo sie im Menü erscheinen, bearbeiten über das orangefarbene Stift-Symbol links über der Beitragsüberschrift.

Bei weiteren Fragen bitte im Forum unter "Homepage bearbeiten" nach einer Lösung suchen oder fragen.


Kalendereintrag vornehmen

Kalendereintrag vornehmen

Um selber einen Eintrag zu machen, muss man angemeldet sein.
Dann geht man zu Service und klickt auf den Kalender. (Ganzer Kalender anzeigen auf der Startseite geht auch). Man erhält solch eine Ansicht. (evtl. nach unten scrollen)
Kalendereintrag_1_k
großes Bild
Nun klickt man einfach auf Neuen Termin einfügen:
Kalendereintrag_2_k
großes Bild
1. Bei Titel kommt das hin, was als Überschrift im Kalender erscheinen soll - z.B. Elternabend Klasse 10
2. Kategorie aussuchen (Farbe wird dann automatisch festgelegt)
3. In das große freie Feld wird nun die Beschreibung des Termines hinein geschrieben z.B. die Tagesordnung, der Raum und am besten noch mal die Zeit
Nun geht man auf den "Reiter" Kalender (neben Allgemein)
Kalendereintrag_3_k
großes Bild
Nun geht man auf den kleinen Knopf unter erster Tag, es geht ein Fenster auf und man sucht sich das passende Datum. Das wird auch automatisch das Datum des letzten Tages, was in den meisten Fällen Sinn macht, da es Einzeltermine sind. Bei der Startzeit nimmt man am besten die Anfangszeit der Veranstaltung und entsprechd dann die Endzeit.
Jetzt braucht man nur noch auf Speichern gehen und das war es auch schon.
Viel Erfolg

Bildergalerien in 2 Varianten

Auf unserer Homepage können über 2 verschiedene Plugins Bildergalerien dargestellt werden. *der nachfolgende Text wurde aus der Anleitung des Entwickler (www.bretteleben.de) übernommen*:

1. Variante: Über das plugin "vsig" kann man Bildergalerien mit Thumbnails einfügen (siehe Beispiel: past rhymelights in Englisch).

Der Code, der in einen Beitrag einzufügen ist, besteht aus dem Aufruf selbst {*vsig}{/vsig*} (ohne die Sterne) und enthält den Namen des Ordners, in dem wir sich die Bilder befinden (müssen vorher hochgeladen werden). Der eingestellte Pfad zum Hauptordner (imageroot), also per Default "/images/stories/" wird vom Plugin automatisch ergänzt und ist nicht mit anzugeben.

Um einen Ordner in einem Unterordner zu verwenden, wird sinngemäß der Pfad unterhalb des eingestellten Hauptordners (per default "/images/stories/") angegeben, also zum Beispiel für den Ordner "/images/stories/ordner/unterordner":

{*vsig}ordner/unterordner{/vsig*} - ohne die Sterne

An sich war es das und die Galerie ist einsatzfertig. vsig="very simple image gallary"...

Bilder hochladen:

  • bitte die Größe vorher "webtauglich" anpassen - 500 Pixel Breite reichen aus, weil ja auch die Galerie nur 500 Pixel breit ist (geht gut in irfanview für mehrere Bilder gleichzeitig)
  • weil die Bilder in alphabetischer Reihenfolge angezeigt werden, die Bilder bei Bedarf umbenennen
  • Im Editor-Fenster auf "Bild einfügen" (untere Zeile) gehen, dann öffnet sich der Bild-Manager
  • in einen passenden Ordner wechseln und dort ein neues Unterverzeichnis erstellen
  • im Bildmanager am rechten Rand Mitte ist der Button für den Upload vom eigenen PC - hier können dann Bilder im jpg-, gif- und png-Format hochgeladen werden

...und man hat noch mehr Möglichkeiten: 

Eine ausführliche Anleitung dazu ist hier zu finden.

Im oben genannten Link sind auch noch andere Anwendungsbeispiele zu finden (über das Menü links) - man hat da verschiedene Möglichkeiten, mit zusätzlicher Angabe von Parametern das Aussehen zu ändern. Hier zur Info für die gewünschten Anpassungen die Grundeinstellungen des plugins auf unserer Homepage zusammen mit einer kurzen Erläuterung:
  • Gallery width: 500 - Breite der gesamten Galerie in Pixel (ganze Zahl)
  • max. Image height: 450 - maximale Höhe der Bilder in Pixel; mögliche Werte: leer (gesamte Breite ausnützen), (ganze Zahl)
  • Image quality: 80 - Qualität der Bilder in Prozent (ganze Zahl von 1-100)
  • Align the gallery: Mitte - Ausrichtung der Galerie im Artikel; mögliche Werte: 0 (rechts), 1 (mitte), 2 (links), 3 (float left), 4 (float right)
  • Thumbnail width: 135 - Breite der Thumbnails in Pixel (ganze Zahl)
  • Thumbnail height: 110 - Höhe der Thumbnails in Pixel (ganze Zahl)
  • Crop thumbnails: keep proportions - Sollen die Thumbnails proportional skaliert oder beschnitten werden; mögliche Werte: keep (proportional), crop (beschnitten)
  • Image thumbnail quality: 80 - Qualität der Thumbnails in Prozent (ganze Zahl von 1-100)
  • Space between thumbs: 3 - Platz zwischen den Thumbnails (ganze Zahl in Pixel)
  • Thumbnails are shown: Justified - below the image (0) - Lage der Thumbnails; mögliche Werte: 0 (unten), 1 (rechts), 2 (unten und am rechten Bildrand ausgerichtet)
  • Place for thumbnails in percent of gallery width: 30 - Prozent der Gesamtbreite reserviert für die Thumbnails (ganze Zahl von 1-100) z.B.: 30
    Hinweis: nur relevant wenn die Thumbnails rechts angezeigt werden
  • Sort order: A-Z - Sortierung der Bilder; mögliche Werte: 0 (A-Z - DEFAULT), 1 (Z-A), 2 (alt-neu), 3 (neu-alt), 4 (zufällig)
  • Use sets of size: 3 - Zahl der Thumbnails je Set unterhalb vom Galeriebild
  • Label sets: Serie
  • Link/button forward: - Wert für das Kontrollelement "Vor"; mögliche Werte: leer (Standardbutton); beliebiger Text; Dateiname eines Buttons
  • Link/button backward:  - Wert für das Kontrollelement "Zurück"; mögliche Werte: leer (Standardbutton); beliebiger Text; Dateiname eines Buttons (siehe Plugin Howto)
  • Show captions? Ja - Captions anzeigen; mögliche Werte: 0 (nein), 1 (ja)
  • Position of captions? Below - Position der Captions; mögliche Werte: 0 (unter dem Hauptbild), 1 (überblendet über das Hauptbild)
  • Use links? Ja - Links anzeigen; mögliche Werte: 0 (nein), 1 (ja)
  • Image root: /images/stories/
  • Buttonfolder: /images/stories/vsig_buttons/
  • Use JavaScript? Ja - soll JavaScript verwendet werden; mögliche Werte: 0 (nein), 1 (ja)
  • Foldername as ID? Nein - Name des Ordner als Identity des obersten DIV-containers; mögliche Werte: 0 (nein), 1 (ja)


Dann gibt es noch eine 2. Variante: die Bretteleben.de Simple Image Slideshow - hier werden einfach die Bilder der Reihe nach mit automatischem Wechsel und paralleler Weiterschaltemöglichkeit dargestellt.

(Hinweise zum Bilder hochladen siehe oben = analog zu "very simple image gallery".)

Das "Simple Picture Slideshow" Plugin wird aus dem jeweiligen Artikel aufgerufen. Dabei gibt es - neben der Wahl des Ordners, in dem die Bilder liegen - weitere Möglichkeiten, die Slideshow aufzuwerten oder zu gestalten.

Der Code besteht aus dem Aufruf selbst {*besps}{/besps*} (ohne die Sterne) und enthält den Namen des Ordners, in dem wir gerade die Bilder abgelegt haben. Der Pfad zum Ordner, also "/images/stories/" wird vom Plugin automatisch ergänzt und ist nicht mit anzugeben.

Um einen Ordner in einem Unterordner zu verwenden, wird sinngemäß der Pfad unterhalb von "/images/stories/" angegeben, also zum Beispiel für den Ordner "/images/stories/ordner/unterordner":

{*besps}ordner/unterordner{/besps*} - ohne die Sterne

Ein Aufruf sieht also zum Beispiel so aus:
{*besps}klassen/20nn/bilder/xyz{/besps*} - ohne die Sterne

An sich war es das und die Slideshow ist einsatzfertig.

Eine ausführliche Anleitung findet Ihr beim Entwickler www.bretteleben.de.

 


Grafiken und Tabellen im Beitrag

Wenn man große Grafiken und Tabellen mit Größenangabe "100%" bei "Breite" im Beitrag plaziert, dann erscheinen diese so groß wie die Spalte breit ist und passen sich automatisch an die Größe des Browserfensters an.

Bei keiner Angabe unter Breite erscheint die Grafik in der Originalgröße und ragt in die rechte Menü-Spalte hinein, wenn sie zu groß ist. Das kann bei Tabellen auch passieren, wenn die addierten Spaltenbreiten zu groß werden, also am besten entweder keine Breitenangaben für Tabellen machen oder bei der Tabellenbreite 100% eingeben, dann passt sich die Tabelle der Breite des Inhalts und des Anzeigefensters an.

Popup aus Beitrag heraus aufrufen

Wenn man aus einem Beitrag heraus ein Bild oder eine php-Datei oder eine html-Datei in einem Popup-Fenster aufrufen möchte, dann hat man 2 Möglichkeiten:

  1. mit javascript (unter advcode"Code bearbeiten")

    1
    2
    3
    4
    <a target="popup" onclick="window.open ('','popup','width=600,height=600,
    scrollbars=yes,toolbar=no,status=no,resizable=yes,menubar=no,location=no,
    directories=no,top=10,left=10')" href="images/stories/verzeichnis/unterverzeichnis/
    usw/dateiname.php">Link-Titel</a>

    Fenster-Name: hier: "popup" - Name ist egal, sollte aber jeweils gleich bleiben, wenn man mehrere fenstererzeugende Links im Beitrag hat und diese nacheinander anklickt - dann aktualisiert sich deren Inhalt / aber nicht die Größe! (ansonsten kommen die Popup-Fenster übereinander)
    Fenstergröße, Abstand vom Seitenrand, php-Datei oder Bild (mit Verzeichnisangabe)

    Beispiel: Entfernung (Geografie)

  2. mit jce-Editor als Light-Box

    mit "Link einfügen/bearbeiten" - dort im Reiter "Link" die URL bzw. über den Link-Browser das Bild auswählen, dann im Reiter "Erweitert" bei "Klassenliste" jcepopup auswählen (jcepopup erscheint dann automatisch auch unter "Klassen") und dazu noch unter "Relationship page to target" Lightbox auswählen

    Dabei wird im Quelltext folgendes eingefügt:

    <a rel="lightbox" class="jcepopup" href="images/stories/anleitungen/schulserver.jpg">Link-Titel</a>

    (wer sich mit html auskennt, könnte rel="lightbox" class="jcepopup" über advcode "Code bearbeiten" auch selbst in den Link-Tag einfügen)

    Beispiel: stumme Karte (Geografie)

Schulserver

Als Schüler einer Chemnitzer Schule bist du ziemlich gut vernetzt.

Dateizugriff

Möchtest du vielleicht deine Präsentation für den Unterricht schon am Abend vorher auf den Schulrechner speichern? Über http://ies.c.sn.schule.de/ ist das kein Problem. Nutze einfach deinen Login-Name und dein Passwort. Achte darauf, dass du als Standort "CSM" auswählst.
schulserver

E-mail

Auch eine eigene E-mail Adresse hast du schon. Leider ist sie etwas umständlich. Du nimmst einfach deinen Login-Namen und schreibst dahinter: @ms-csmc.c.sn.schule.de

Also zum Beispiel:

Diese E-Mail-Adresse ist vor Spambots geschützt! Zur Anzeige muss JavaScript eingeschaltet sein!

Schreiben und Lesen kannst du deine E-mails über: http://mail.ms-csmc.c.sn.schule.de/
Natürlich musst du dich auch hier erst wieder mit Login-Name und Passwort anmelden.
schul_mail

Nach dem Login landest du erst einmal bei einem Kalender. Deine Post findest du unter dieser Schaltfläche: navbar