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.