Blogs@TUBAF

Der Blog-Dienst des Universitätsrechenzentrums der TU Bergakademie Freiberg

12. Dezember 2017 – Marius Baak

Tabellen richtig verwenden

Tabellen wurden in dem dunklen Mittelalter des Internets noch als Mittel zur Gestaltung von Webseiten benutzt, das ist heute (zum Glück) per Gesetz (BITV 2.0 unter Punkt 1.3) untersagt. Der Grund ist einfach: Barrierefreiheit. Eine Tabelle, die für Designzwecke verwendet wird, ist für ein Lesegerät nahezu unmöglich vernünftig einem Sehbehinderten vorzulesen. Das bedeutet selbstverständlich nicht, dass das Benutzen von Tabellen generell untersagt ist, allerdings dürfen sie nur als Datentabellen benutzt werden. Hier ein Beispiel für eine richtig verwendete Tabelle:

Beispieltabelle
Name Büro Durchwahl
Brauer, D. 501 -531
Fassbinder, M. 205 -385
Ostermann, M. 101 -422
Schmitz, A. 308 -816
Theiss, N. 502 -532

Die Tabellen werden automatisch via CSS gestaltet. Es müssen und sollten also keine Anpassungen von Farben, Schriftgrößen etc. gemacht werden.

Tabelle richtig einfügen und formatieren

Hier werden die verschiedenen Schritte zum einfügen und formatieren von Tabellen erläutert.

Tabelle einfügen

Es gibt zwei Arten über den Editor Tabellen einzufügen.

  1. Menü
    1. Im Menü auf Tabelle klicken.
    2. Mit der Maus über den Menüpunkt „Tabelle“ hovern.
    3. Gewünschte Zeilen und Spalten anzahl auswählen und mit einem Klick bestätigen.
  2. Symbolleiste
    1. In der Leiste das Tabellen Symbol auswählen.
    2. Mit der Maus über den Menüpunkt „Tabelle“ hovern.
    3. Gewünschte Zeilen und Spalten auswählen und mit einem Klick bestätigen.

Kopfzeile formatieren

  1. Kopfzeile der Tabelle markieren.
  2. Im Menü auf Tabelle klicken.
  3. Über den Menüpunkt „Zeile“ hovern.
  4. Zeileneigenschaften auswählen.
  5. In dem geöffneten Pop-Up bei Zeilentyp anstatt „Body“ nun „Tabellen-Header“ auswählen.

Fußzeile formatieren

  1. Fußzeile der Tabelle markieren.
  2. Im Menü auf Tabelle klicken.
  3. Über den Menüpunkt „Zeile“ hovern.
  4. Zeileneigenschaften auswählen.
  5. In dem geöffneten Pop-Up bei Zeilentyp anstatt „Body“ nun „Fußzeile“ auswählen.

Beschriftung einfügen

  1. Mit der Maus in die Tabelle klicken, damit die richtige Tabelle ausgewählt ist.
  2. Im Menü auf Tabelle klicken.
  3. Den Menüpunkt „Tabelleneigenschaften“ auswählen.
  4. Den Haken bei „Beschriftung“ setzen und das Pop-Up mit OK bestätigen.
  5. Über der Tabelle ist nun ein Feld erschienen in das die gewünschte Beschriftung geschrieben werden kann.

Weitere Links

23. August 2017 – Marius Baak

Tipp: Shortcode für Liste der Autoren

Seit heute kann man via Shortcode eine Liste der Blogautoren abrufen.

[netsposts order_post_by=’date_order desc‘]

So funktioniert’s:

  1. Einfach im Editor den Shortcode
  2. Andreas Kluge
  3. Marius Baak
  4. Stefan Clauß
  5. Stefanie Lorenz
  6. Alexander Winterstein
  7. hinzufügen.
  8. Den Shortcode markieren und danach entweder auf den Button für „Aufzählung“ oder „Nummerierte Liste“ klicken.

Wenn man nun statt „Visuell“ den Editor auf „Text“ stellt, dann sollte um den Shortcode ein <ul></ul> oder <ol></ol> Tag gesetzt sein. So sollte es aussehen:
<ul>

  • Andreas Kluge
  • Marius Baak
  • Stefan Clauß
  • Stefanie Lorenz
  • Alexander Winterstein
  • </ul> bzw. <ol>
  • Andreas Kluge
  • Marius Baak
  • Stefan Clauß
  • Stefanie Lorenz
  • Alexander Winterstein
  • </ol>

    Und so sieht das Resultat aus:

    11. Juli 2017 – Marius Baak

    Tipp: Weiterlesen-Tag

    Wahrscheinlich ist schon einigen aufgefallen, daß die Beiträge in der Blogroll in gesamter Länge angezeigt werden. Wenn man sehr lange Beiträge verfasst, dann kann das nervig sein.

    Weiterlesen-Tag Button
    Weiterlesen-Tag Button

    Zum Glück hat WordPress die Funktion „Weiterlesen-Tag einfügen“. Wenn man den Tag hinzufügt, dann kann man nach eigenem Ermessen entscheiden welcher Abschnitt als Teaser angeboten werden soll.  Das hat besonders zum Vorteil, daß nicht mehr nach einer festen Anzahl von Worten der Text abgeschnitten wurd und man selber entscheiden kann wie viel oder wenig man dem Leser zeigen möchte, bevor er auf den Artikel klickt.

    Im Editor sieht man dann gestrichelte Linien mit der Schrift „MORE“ (siehe unten). Alles was da vor steht wird in der Blogroll angezeigt, alles was dahinter steht ist nur zu sehen wenn der Artikel geöffnet wurde.

    Eingefügter Weiterlesen-Tag
    Eingefügter Weiterlesen-Tag

    09. Juli 2017 – Marius Baak

    Tipp: Autoren Seite

    In dem letzten Update haben wir die Profilseite der Autoren überarbeitet. Vorher wurden wie in einer Blogroll die einzelnen Beiträge angezeigt. Jetzt ist es übersichtlicher und zeigt neben der Beitragsüberschriften auch eine kurze Biografie, die Webseite, und die verschiedenen Social Media Profile an, sofern sie im Backend eingetragen sind.

    Wo finde ich die Felder um etwas einzutragen?

    Hier kann man Profil bearbeiten auswählen.

    Wenn man im Backend eingeloggt ist, kann man einfach über die Willkommensnachricht hovern und dann „Profil bearbeiten“ auswählen.

    Wenn man dann etwas runter scrolled, dann sieht man schon die einzelnen Felder, die man ausfüllen kann.

     

     

     

    Felder zum ausfüllen für das Autoren Profil

    Die E-Mail Adresse wird automatisch von Shibboleth ausgefüllt und kann nicht geändert werden.

    Was genau in die anderen Felder geschrieben wird steht in diesem Beitrag weiter unten.

    Biografie und Webseite

    Die Biografie und die Webseite konnte man schon vor dem Update im Backend eintragen. Wenn nichts in die Felder eingetragen ist, dann wird auch nichts auf der Profilseite ausgegeben.

    Social Media

    Doch was muss wo eintragen werden, damit der korrekte Link angezeigt wird?

    Facebook

    Bei Facebook wird das eingegeben, was hinter dem „/“ nach Facebook.com steht. Wenn man zum Beispiel das Facebook Profil des URZ angeben wollen würde, dann müsste man in die Facebook-ID „Rechenzentrum.Bergakademie“ eintragen (selbstverständlich ohne die „“).

    URL Beispiel für die URZ Facebook Seite

    Xing

    Bei XING muss, ähnlich wie bei Facebook, das eingegeben werden, was hinter dem „/“ nach xing.com/profile/ steht. Im Falle meiner Xing-Seite wäre es „Marius_Baak“.

    Beispiel der XING URL

    Twitter

    Beispiel des Twitter Usernames.

    Bei Twitter wird der Username angegeben, also der Name, vor dem das @ steht. Der Username entspricht gleichzeitig dem Namen bzw. der Bezeichnung, die hinter dem „/“ von Twitter.com steht.

    Beispiel der Twitter URL.

    Skype

    Bei Skype wird ebenfalls der einzigartige Username eingegeben.

    Instagram

    Bei Instagram wird auch der Username eingegeben. Der Username muss nicht zwangsläufig dem angezeigten Namen entsprechen.

    Instagram Profil der TU Freiberg.

    Das, was auf dem Bild im roten Kasten steht ist der Username. Was im blauen Kasten steht ist der angezeigte Name.

    Snapchat

    Bei Snapchat wird auch der einzigartige Username angegeben.