Archiv für das Jahr: 2016

Aufgaben-Verwaltung mit Things – To-Do’s – aber richtig!

Aufgaben-Verwaltung mit Things To-Dos aber richtig

Aufgaben-Verwaltung mit Things - Screenshot T.Bortels/cpu20.de

Ich nutze schon seit Jahren das kleine aber feine Programm Things sowohl auf Mac OS, als auch als App auf iOS, zur Verwaltung meiner zahlreichen To-Do’s. Ich hatte ursprünglich das Bedürfnis, To-Do’s effizient zu verwalten. EIn einfaches synchronisieren mit dem iPhone war eine der Anforderungen. Things wurde in verschiedenen Besprechungen und Tests immer wieder hoch gelobt – also habe ich ein paar Euro investiert und mir das Programm sowohl auf meinem MacBook als auch auf dem iPhone installiert

Über mehrere Jahre habe ich Things dann auch mehr oder weniger erfolgreich genutzt. Ich war aber irgendwie immer ein bisschen zu bequem, um mir das Programm einmal genau anzusehen. Die Folge: ich habe die Aufgaben-Verwaltung zwar genutzt, aber eben auf meine spezielle Art. Nicht besonders effektiv.

Als ich Things zuerst für mich entdeckte, fand ich die einfache Aufgabenliste für mich und meine Aufgaben vollkommen ausreichend. Also wurde einfach alles als Aufgabe („To Do“) angelegt – egal, ob es sich dabei um ein Projekt (z.B. „Relaunch Webseite XY“) oder um eine kleine häusliche Aufgabe (zB „Hausverwaltung anrufen“) ging.

Um mir selbst etwas Druck zu machen habe ich dann auch noch alles bzw. fast alles unter Heute („Today“) eingeordnet. Das hatte zur Folge, dass ich immer alle Aufgaben auf einer Liste vor mir hatte. Was zunächst nicht weiter problematisch klingt wird bei dutzenden oder gar hunderten von unterschiedlichsten Aufgaben fast nicht mehr bedienbar. Man muss sich das nur mal auf der Zunge zergenen lassen: Immer! Alle! Aufgaben!. Kein WUnder, dass man am berühmten Ende des tages das Gefühl hat, nichts geschafft zu haben – auch wenn die Mamutliste um ein paar Punkte kürzer geworden ist.

Ich wusste zwar, dass Things in Anlehnung an die Methode „Getting Things Done“ entwickelt wurde. Demnach sollte man große Aufgaben bzw. Projekte in kleine Portinen, To-Do’s runterbrechen, sodass man sich eine Tagesliste zusammenstellen kann, die wirklich zu schaffen ist. Klingt nicht so kompliziert – aber ich war einfach zu bequem, mir die Arbeit zu erleichtern. Das Ergebnis: eine unüberschaubar lange Liste von „wichtigen“ Aufgaben, die alle „heute“ erledigt werden wollten. Aber so funktioniert Task-Management nunmal leider nicht.

Neulich habe ich mich dann endlich mal daran gemacht, die verschiedenen Funktionen von Things genauer zu erkunden und anschliessend auch zu nutzen. Und siehe da: ungeahnte Möglichkeiten – ungenutzte Potentiale. Ich hatte im Laufe der Zeit zwar begonnen, Projekte anzulegen und Unter-Aufgaben zu definieren – aber die Aufgaben-Verwaltung war immernoch sehr unübersichtlich. Inzwischen bin ich aber zum Glück einen großen Schritt weiter.

Was hat sich in der Art, wie ich Things benutze, nun eigentlich geändert? Nicht viel. Aber die kleinen Unterschiede haben eine große Wirkung. Ich nutz jetzt lediglich alle Bereiche („Projects“ und „Areas of Responsibility“) sowie die zeitlichen Zuordnungen so, wie es vermutlich gedacht ist. Und das macht einen grpßen Unterschied.

Gut für Produktivität UND Motivation: Wie man Things richtig nutzt

Ein Projekt ist ein Projekt – und keine Aufgabe.

Ein Projekt lässt sich in Things in beliebig viele Aufgaben unterteilen. Oder anders ausgedrückt: einem Projekt lassen sich beliebig viele Aufgaben zuordnen. Eine Faustregel besagt, dass jede Aufgabe, für die man mehr als 20 Minuten benötigt, in wenigstes zwei Aufgaben aufgeteilt werden sollte. So lässt sich ein Projekt und der damit einhegehende Projektverlauf gut nachvollziehen und dokumentieren. Man weiss nachher ziemlich genau, was man alles gemacht hat, damit ein Projekt abgeschlossen werden konnte.

Sind dann alle Aufgaben erledigt und das Projekt abgeschlossen, kann ein Projekt auch als „erledigt“ markiert werden. Sowohl das Projekt, als auch alle damit verbundenen Teilaufgaben sind anschliessend im Logbook archiviert.

Noch ein Tipp für die Nutzer von zeiterfassungsprogrammen wie Timings: Projekte und Aufgaben am besten immer gleich benennen. So lassen sich nach Projektabschluss Aufwände dokumentieren. So sammelt man ’nebenbei‘ wertvolle Erkenntnisse für kommende Projekte – was einem auch die kalkulation des nächsten Angebots erleichtern kann.

Fortlaufende und wiederkehrende Aufgaben als „Area of Responsibility“ anlegen

Fortlaufende bzw, wiederkehrende Aufgaben lassen sich am besten einer dafür angelegten Area of Responsibility zuordnen. dabei geht es um Projekte, die eigentlich keine Projekte sind – also zum Beispiel „Haushalt“ oder „Büro“ oder „Akquise“ oder ähnliches. Auch hier fallen natürlich Aufgaben an, die erledigt werden können.

Eine Area of Responsibility lässt sich in Things im Gegensatz zu einem Project nicht erledigen. Und wenn man einmal ein bisschen darüber nachdenkt, ist es auch nur logisch so. Es hat aber eben leider ein Weilchen gedauert, bis ich überhaupt anfing, den Bereich Area of Responsibility sinnvoll zu nutzen. Aber zum Glück ist es in Things sehr einfach, Aufgaben umziehen zu lassen. So waren schnell ein paar Area of Responsibility eingerichtet und die dazugehörigen Aufgaben umgezogen.

Aufgaben heute oder später erledigen? Today, Next, Scheduled, Someday

Hier lautet die Empfehlung eigentlich, sich immer nur die Aufgaben für einen bestimmten Tag vorzunehmen, die man auch halbwegs realistisch an diesem Tag erledigen kann. Ich tendiere allerdings leider immernoch dazu, mir zu viele Aufgaben auf Heute bzw. Today zu legen. Ich weiss, dass das nicht sinnvoll ist – aber so ist es nunmal. Lange Zeit hatte ich befürchtet, wichtige Aufgaben nicht wiederzufinden, wenn ich sie in einer der anderen drei Zeit-Bereiche ablegte.

Diese Befürchtung ist aber vollkommen überflüssig, wenn man Things konsequent so nutzt, wie es gedacht ist. Die Projektliste bleibt überschaubar – und mit einem Klick auf einen Projektordner hat man alle Aufgaben in einer übersichtlichen Liste – egal, ob sie für heute, morgen, oder nächste Woche angelegt sind. Und inzwischen habe ich meine Liste für die aktuellen Aufgaben ganz gut unter Kontrolle.

Masonry Webfont-Problem mit Webfont Loader lösen

Das Jquery Plugin Masonry kann ein sehr nützlicher Bestandteil einer Webseite sein – wenn es so funktioniert, wie es funktionieen soll. Gibt es aber Probleme mit der Implementierung – sitzen die Elemente beispielsweise nicht dort, wo man sie erwartet, dann kann Masonry auch schnell zum Ärgernis werden. Die Fehlersuche und Problemsuche kann mitunter recht mühsam sein.

Eines der wohl bekanntesten Probleme ergibt sich immer dann, wenn man besonders viele oder besonders große Bilder in einem Masonry Layout platzieren möchte. Manchmal bemerkt man das Problem zunächst gar nicht – wenn dann aber im Laufe der Zeit mehr und mehr Inhalte auf die Webseite geladen werden kommt es plötzlich zu eine „haufenbildung“ – die Bilder werden nicht mehr nebeneinander und untereinander angezeigt, sondern übereinander  – in Haufen. Dieses Problem kann auch bei besonders langsamen Internetverbindungen auftreten – oder wenn der Webserver mal ein bisschen länger braucht, um die Bilder auszuliefern. Zum Glück ist das Problem aber nicht nur sehr verbreitet. sondern auch gut dokumentiert – und es lässt sich mithilfe des Zusatzskriptes imagesLoaded relativ leicht beheben..

Das andere, vermutlich nicht so weitverbreitete aber technisch ganz ähnliche Problem kann auftreten, wenn man in den Masonry-Elementen Webfonts verwendet. Das Problem ist nicht ganz so offenischtlich erkennbar – aber dennoch nervig. Es äussert sich, indem einzelne Elemente aus dem Layout zu rutschen scheinen – manchmal sitzen sie nur ein paar Pixel zu weit unten, manchmal auch an falscher Stelle.. Häufig tritt das Problem nur auf, wenn die verwendeten Webfonts noch nicht im Cache des Browsers gespeichert sind. Je nach Seitenstruktur kann es also sein, dass Webdesigner / Webentwickler das Problem gar nicht direkt zu sehen bekommen. Erst nach dem leeren des Caches fällt plötzlich auf, dass ein Element ein paar Pixel zu weit unten sitzt.

Was verursacht die Masonry Verschiebung um ein paar Pixel?

Masonry macht eigentlich nichts weiter, als die größe aller Elemente zu berechnen und anschliessend die jeweilige Position daraus zu berechnen. In den meisten Fällen funktioniert das auch ganz prblemlos. Aber manchmal kann eine langsam ladende Webfont die Berechnungen durcheinander bringen. Masonry berechnet in diesem Falle die Positionen aller Layoutelemente bevor die Webfont geladen ist. Wenn die Webfont dann zB eine geringere Laufweite hat, fallen ggf. Zeilenumbrüche weg – einzelne Elemente benötigen weniger Platz, als Masonry zunächst berechnet hat – und so kommt es zur Verschiebung.

Wie gesagt – das Problem ist unter Umständen nicht so leicht zu erkennen. Nur wenn die Webfont noch nicht geladen ist und durch das Laden Zeilenumbrüche wegfallen kommt es zu der Verschiebung. Es kann unter Umständen Wochen oder Monate dauern, bis das Problem auftritt. Und dann ist es auch nur für diejenigen sichtbar, die die Webfont nicht im Cache gespeichert haben. Und selbst dann fällt der Fehler unter Umständen nicht gleich auf.

Am einfachsten ist der Fehler zu erkennen, wenn das Layout sich aus Elementen zusammensetzt, die alle dieselbe Höhe haben. Wenn dann nur eines der Elemente einen Zeilenumbruch „verliert“ kommt es zu der beschriebenen Verschiebung. Manchmal ändert sich auch die Reihenfolge, in der die Elemete angezeigt werden, weil eines der Elemente zu viel Platz einnimmt. Als ob ein unsichtbaren Element im Wege wäre. Chaos.

Wie auch immer. Auch für dieses Problem gibt es eine Lösung: der Webfontloader prüft zunächst, ob die angegebenen Webfonts geladen sind. Erst dann wird Masonry gestartet.

Das Skript wurde von Google in Zusammenarbeit mit Typekit entwickelt und man kann es kostenlos nutzen. Entweder installiert man es direkt auf dem eigenen Webspace, oder man lädt es dynamisch von einer Google-Adresse. Ist das Skript einmal implementiert muss man nur noch die die Skriptanweisungen, die Masonry eigentlich starten,  mit einer entsprechenden Klammer versehen. So stellt man sicher, dass Masonry nur dann geladen wird, wenn bereits alle Webfonts geladen sind.

zunchst muss also der Webfontloader bzw. webfont.js geladen werden:

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js'></script>

Dann klammert man den Masonry Code mit der Webfont Load Abfrage:

// prüfen ob alle Webfonts geladen sind:
WebFont.load({
    custom: {
      families: ['RobotoCondensedRegular','RobotoCondensedItalic', 'RobotoCondensedBold' ]
    },
active: function() {

// cprüfen ob alle Bilder geladen sind:
var $grid = $('.grid').imagesLoaded( function() {
// init Masonry
  $grid.masonry({
    // wir verwenden grid-sizer um die Spaltenbreite zu bestimmen:
    columnWidth: '.grid-sizer',
    // do not use .grid-sizer in layout
    itemSelector: '.grid-item',
    originLeft: true,
    percentPosition: true
  });
});

}

});

Auf der Projektseite bei Github ist das Skript ausführlich dokumentiert:
https://github.com/typekit/webfontloader

El Capitan: Illustrator unerwartet beendet / Pipette [fix]

El Capitan: Illustrator unerwartet beendet / Pipette [fix]

El Capitan: Illustrator unerwartet beendet - Screenshot / Collage T.Bortels/cpu20.de

SIe haben diesen Artikel vermutlich gefunden, weil Sie vor kurzem auf das neue Betriebssystem El Capitan (Mac OS 10.11) umgestiegen sind – so wie ich – und jetzt haben Sie das Problem, dass Illustrator CS5 unerwartet beendet wird, wann immer das Programm ‚regulär‘ beendet werden soll – oder wenn die Pipette genutzt wird. Ich kenne das Problem – ich habe das selber gerade durchgemacht. Und letztendlich endlich repariert. Yay!

Das „unerwartet beendet“ Problem („crash on quit“) bringt noch ein weiteres Problem mit sich: die Preferenzen wirden nicht gespeichert. Also muss beim Neustart alles wieder neu eingestellt werden – je nach Projekt kann das nervig und zeitaufwändig sein. Nicht besonders praktisch.

Beide Probleme – der Pipetten-Crash und der Quit-Crash können aber relativ einfach behoben werden. Man muss eigentlich nur zwei Datein umbenennen – das war’s dann schon. Man muss dafür zwa erstmal unter anderem in den versteckten Library-ordner hinabsteigen – aber eigentlich ist das halb so wild.

„Illustrator unerwartet beendet“ – Problemlösung für El Capitan Bug

Zuerst muss Illustrator beendet werden. Vermutlich stürtzt das Illustrator an dieser Stelle wieder ab – aber das sollte dann eigentlich auch der letzte „Crash on Quit“ gewesen sein. Dann muss man den versteckten Library-Ordner finden und öffnen. Eigentlich muss man sogar zwei Library-Ordner aufsuchen – die reguläre System-Library und die persönliche Benutzer-Library.  Wir beginnen mal mit der versteckten Library im Benutzerverzeichnis.

Zunächst wecheln wir in den Finder Dann ist in der Apple Menuleiste (ganz oben am Bildschrimrand) der Menupunkt „Gehe zu“ zu sehen sein. Bei gedrückter alt-Taste wird dann der Library-Ordner angezeigt – diesen auswählen. Nun sollte sich der Library-Ordner im Finder öffnen.  Im Library-Ordner das Verzeichnis „Application Support“ auswählen und dann ins Unterverzeichnis „Adobe“ wechseln. Hier sollte nun ein Ordner namens“CS5ServiceManager“ zu sehen sein.  Dieses muss in „CS5ServiceManager.bak” umbenannt werden.

Die zweite Datei, die umbenannt werden muss, ist in der System-Library zu finden. Öffnen Sie das Verzeichnis „Festplatte“ – entweder über den Schreibtisch /Finder oder wieder über den Menupunkt „Gehe zu“ > „Computer“. Im Verzeichnis „Festplatte“ sollte dann der Libraby-Ordner zu sehen sein. Gehen Sie dann wieder ins Verzeichnis „Application Support“ > „Adobe“ und ändern Sie den Dateinamen von „CS5ServiceManager“ in „CS5ServiceManager.bak”.

Wenn beide Dateien umbenannt sind kann Illustrator wieder gestartet werden. Jetzt sollte Illustrator weder beim benutzen der Farbauswahl-Pipette, noch beim beenden abstürzen. Und somit sollen auch die Präferenzen erhalten bleiben.

WordPress: HTML-Bildunterschrift zum Beitragsbild hinzufügen

WordPress Bildunterschrift / Caption am Beitragsbild

Bildunterschrift am Artikelbild - Foto: T.Bortels/cpu20.de (Screenshot)

Die meisten WordPress Themes machen es einem ja sehr einfach, einem Artikel bzw. einer Seite ein Beitragsbild („Featured Image“) hinzuzufügen – will man dem aber eine Bildunterschrift zum Beitragsbild hinzufügen kann das ein bisschen schwierig werden. Die Bildunterschrift bzw. „Caption“ wird oft nur bei Bildern angezeigt, die inline – also im Artikeltext platziert werden. Beim Hauptbild bzw. Beitragsbild fehlt die Bildunterschrift häufig, obwohl sie in der Mediathek korrekt in das Feld Beschriftung eingegeben wurde.

Warum braucht man eine Bildunterschrift / Caption?

In vielen Themes ist erstmal keine Caption vorgesehen. Und das muss in den meisten Fällen auch gar kein Problem darstellen. Aber gerade wenn man WordPress als CMS nutzen möchte – zum Beispiel um eine Art Magazin zu betreiben, kann es sein, dass man eine die Bildunterschrift anzeigen möchte – oder anzeigen muss – zum Beispiel um Zusatzinformationen zum Bild bereitzustellen, oder um das SEO-Ranking ein bisschen zu verbessen.

Ausserdem kann es aus rechtlichen Gründen erforderlich sein, dass man eine Caption anzeigt – egal, ob man nun eine Bildbeschreibung oder Bildunterschrift aus SEO-Gründen anzeigen oder aus Design-Gründen verstecken möchte. In vielen Bildlizenzen ist mehr oder weniger klar festgelegt, dass der Name des Fotografen und/oder der Bildagentur und/oder der Lizenz angezeigt werden muss. Wer es versäumt, einen solchen Copyright-Vermerk am Bild anzubringen, riskiert unter Umständen eine teure Abmahnung.

Wie gesagt – bei den meisten WordPress-Themes ist es ohne Probleme möglich, an Inline-Bildern die Caption anzeigen zu lassen. Man gibt am Bild einfach den gewünschten Text in das Feld Beschriftung ein und der Text wird direkt unterhalb des Bildes angezeigt. Nur beim Beitragsbild (Featured Image) funktioniert das häufig nicht. Und gerade das Beitragsbild ist häufig das wichtigste Bild des Artikels. Aber zum Glück kann man mit ein paar Zeilen Code quasi jedes WordPress Theme so nachrüsten, dass die Bildunterschrift (Caption) am Bild angezeigt wird.

Theme-Snippet: Bildunterschrift am Beitragsbild anzeigen

Zunächst muss dem Bild also eine Bildunterschrift hinzugefügt werden. Dies geht am besten direkt beim Bild-Upload – lässt sich in der Mediathek aber auch jederzeit nachträglich ergänzen. Ich trage seit einiger Zeit bei allen Bildern grundsätzlich schon beim Upload einen Titel, einen Alternativtext und auch eine Bildunterschrift ein – meiner Meinung nach eine gute Angewohnheit.

Grundsätzlich sollten Änderungen an Template-Datein immer in einem Child Theme vorgenommen werden. Falls Sie noch kein Child Theme eingerichtet haben, wäre jetzt der richtige Zeitpunkt dafür. Wenn Sie wissen möchten, wie sich mit wenigen handgriffen ein Child Theme installieren lässt, können Sie gerne zunächst diesen früheren Artikel lesen: WordPress Child Theme erstellen – ganz einfach.

In der Template-Datei (z.B. content.php oder single.php oder content-single.php oder page.php etc) müssen Sie dann den Bereich finden, in dem das Beitragsbild („featured image“) geladen wird.  Der entsprechende Code sollte ungefähr so aussehen:

<div class="entry-thumbnail">
    <?php the_post_thumbnail(''); ?> <!-- das Beitragsbild -->
</div>

Je nach Theme und/oder Template kann der entsprechnde Code auch anders aussehen, zum Beispiel wie folgt:

<?php if ( ! post_password_required() && ! is_attachment() ) :
     the_post_thumbnail('large');
endif; ?>

Unterhalb dieses Bereichs müsste dann der folgende Code-Schnippsel eingefügt werden:

<?php if ( $caption = get_post( get_post_thumbnail_id() )->post_excerpt ) : ?>
  <p class="caption"><?php echo $caption; ?></p>
<?php endif; ?>

Dieser Code-Schnippsel testet zuerst, ob überhaupt ein Beitragsbild festgelegt wurde. Anschliessend wird getestet, ob eine Bildunterschrift („post_excerpt“) zum Beitragsbild vorliegt. Wenn beide Voraussetzungen zutreffen wird die Bildunterschrift in einem eigenen Absatz mit der Klasse „caption“ ausgegeben.

HTML 5 Bildunterschrift anzeigen

Ein Detail könnte man dann noch anpassen – wenn das zur Art und Weise passt, wie die Seite Artikelbilder verwendet. Es gibt ja seit HTML 5 passende Tags, mit denen sich Bilder und Bildunterschriften semantisch korrekt markieren lassen: figure kann für Bilder verwendet werden, figcaption für den dazugehörigen Bild-Text. Allerdings ist die Spezifikation der beiden Tags ein bisschen kompliziert. Es wird vorgeschlagen, figure nur für solche Elemente zu verwenden, die theoretisch frei platziert werden könnten, ohne die Bedeutung des Dokuments zu beeinträchtigen. Für die meisten Artikelbilder trifft das meiner Meinung nach zu – aber darüber lässt sich sicherlich vortrefflich streiten.

Wie auch immer – hier der entsprechende Code-Schnippsel:

<figure class="header-image">
    <?php the_post_thumbnail(''); ?> <!-- das Beitragsbild -->
    <?php if ( $caption = get_post( get_post_thumbnail_id() )->post_excerpt ) : ?>
        <figcaption class="caption"><?php echo $caption; ?></figcaption>
    <?php endif; ?>
</figure>

Anschliessend kann die Bildunterschrift per CSS so gestaltet werden, dass sie zum Design der Seite passt.

Links / HTML in Bildunterschrift einbinden

Meistens reicht eine einfache „Plain-Text-Bildunterschrift“ aus – also ohne Links, ohne Formatierung – reiner Text. Manchmal kann es aber sinnvoll sein, eine HTML-Bildunterschrift zu verwenden um z.B. den einen oder anderen Link (zum Fotografen, zur Agentur oder zur verwendeten Lizen) einzubinden. Wie oben bereits erwähnt ist dies bei manchen Bilder-Lizenzen (auch bei Creative Commons) sogar Pflicht! Oder anders ausgedrückt: wer keine HTML-Bildunterschrift einsetzt, riskiert eine Abmahnung. Zum Glück ist es bei WordPress aber relativ problemlos möglich, HTML in Bildunterschriften einzubauen. So kann man beispielsweise wie folgt direkt einen Link direkt in das Feld Bildbeschreibung einbauen:

Frische Kirschen - Foto: <a href="https://creativecommons.org/licenses/by/2.0/" target="_blank">CC BY 2.0</a> lorem ipsum…

Mit diesem HTML wird ein Link zur Seite mit der Creative Commons Lizenz CC BY 2.0 in die Bildunterschrift eingebunden – einfach direkt in das Feld „Beschreibung“ eingeben und schon ist man zu mindest bei diesem Detail auf der (rechtlich) sicheren Seite.

Apple Numbers Tabelle als HTML exportieren / in Blog importieren

Heute eine etwas spezielle Anleitung: wie kann man eine mit Apple Numbers erstellte Tabelle als HTML-Tabelle exportieren – bzw. elegant in einen Blog-Artikel (z.B. WordPress, Drupal etc.)  importieren?

Grundsätzlich lassen sich mit ungefähr jedem CMS Editor Tabellen anlegen, einrichten und bearbeiten. bei manchen ist diese Funktionalität bereits voreingestellt, bei anderen muss man diese ggf. nachträglich einrichten.

Das ist auch schön und gut so, aber häufig hat man die Tabelle zuvor in einem entspechenden Tabellenkalkulationsprogramm angelegt – bei Mac Nutzern ist das häufig Apple Numbers. Und leider gibt es keine Möglichkeit, eine mit Apple Numbers erstellte Tabelle direkt in den Texteditor des CMS zu kopieren.

Die Zahlen und Zeilen werden zwar korrekt kopiert, aber die Tabelle selbst bleibt auf der Strecke – es wird kein HTML kopiert – und damit geht nicht nur die Formatierung, sondern die komplette Tabellenstruktur verloren. Man benötigt also eine Art Brücke, um eine Tabelle von Apple Numbers in den Texteditor zu kopieren.

Text Edit als HTML-Brücke zwischen Apple Numbers und Texteditor

Zum Glück gibt es auf so ungefähr jedem Apple Computer das kleine aber feine Hilfsprogramm Text Edit. Mithilfe von Text Edit ist es relativ einfach, eine mit Aplle Numbers erstellte Tabelle in den Texteditor des CMS zu kopieren.

Zunächst markiert man in Apple Numbers alle Tabellenzellen, die man kopieren möchte. Dann kopiert man diese direkt in ein neues Text Edit Dokument. Damit das reibungslos funktioniert muss das Dokument im formatierten Text erkennen – mit einem reinen Textdokument funktioniert die „Brücke“ leider nicht.

Anschliessend wählt man in Text Edit unter „Ablage“ die Option „Sichern…“ aus – gegebenenfalls muss man das Dokument als neue Version sichern. Im Speichern-Dialog gibt es dann die Möglichkeit, das Dokument als „Webseite“ (.html) zu speichern.

Apple Numbers Tabelle HTML kopieren WordPress CMS

Diese HTML-Datei enthält nun alle HTML-Tags die benötigt werden, um die Tabelle im CMS korrekt anzeigen zu lassen. Allerdings muss man das HTML nun zunächst einmal sauber in das CMS kopieren. Am einfachsten geht das über einen HTML-Editor: einfach das Dokument direkt im HTML-Editor öffnen – schon hat man den entsprechenden Quellcode zur Verfügung.

Tabellen-Quellcode ohne HTML-Editor kopieren

Ein bisschen schwieriger wird es, wenn man keinen HTML-Editor zur Hand hat. Dann kann man die gerade gespeicherte HTML-Datei in einem neuen Browser-Fenster öffnen – einfach per drag’n’drop in das Fenster ziehen oder per cmd+o das Dokument suchen und öffnen. Dann über cmd+u (Firefox) oder cmd+alt+u (Safari) den Quellcode einsehen.

Im Quellcode markiert man dann mithilfe der Maus alles vom ersten „<table…“ bis zum letzten „</table>“ und kopiert diesen dann per cmd-c und cmd+v in die Textanischt bzw. QUellcodeansicht des CMS-Texteditors.

Ganz einfach. Oder? Naja. Immerhin – möglich.

WordPress: Revolution Slider Interval anpassen (Visual Composer Element)

Sehr praktisch: viele WordPress Premium Themes werden mit mächtigen Plugins aufgeliefert, die man nicht extra bezahlen muss. Allerdings kann die Anpassung dieser Plugins ein wenig schwierig sein – und beim Support fühlt sich plötzlich niemand zuständig.

Kauft man beispielsweise eine Lizenz des beliebten Themes Stockholm, dann gibt es unter anderem gleich noch den Visual Composer und den Revolution Slider dazu. Somit kann man einfach per Drag’n’Drop eine Slideshow / einen Slider in beliebige Seiten einbauen – und über das mitgelieferter Interface auch bedingt anpassen.

Der Interval, in dem die Bilder wechseln lässt sich allerdings nur in 4 Stufen regeln. Das Dropdown Menu „auto rotate“ bietet lediglich die Auswahl 3 Sekunden, 5 Sekunden, 10 Sekunden und 15 Sekunden an – alternativ kann man die Funktion „auto rotate“ auch ausschalten.

In den meisten Fällen ist diese Auswahl siecherlich ausreichend – aber manchmal kommt es eben doch auf die Feinheiten an. Und wer es zB von jQuery-Slidern  gewöhnt ist, den Bilderwechsel-Interval auf die Tausendstel Sekunde genau einstellen zu können, der kommt sich bei der beschränken Auswahl doch ein wenig ‚ausgebremst‘ vor, um es einmal milde auszudrücken.

Wordpress Slider auto rotate Bildwechsel Interval anpassenIch habe mich also zunächst an den Support des Themes Stockholm gewandt – aber eigentlich wäre das Sache des Visual Composers. Dort sagte man mir, ich solle mir doch mal die API ansehen – ausserdem hätte der Visual Composer ja nur indirekt mit dem Revolution Slider zu tun. Langer Rede kurzer Sinn: so kam ich nicht weiter. Also ab in den Quellcode.

Um den Code des eigentlichen Sliders herum ist ein div zu finden, das ungefähr so aussieht:

<div class="wpb_gallery_slides wpb_flexslider flexslider_fade flexslider" data-flex_fx="fade" data-interval="10">

Wenn ich als Wert für „auto rotate“ 5 auswähle, steht bei „data-interval“ eine „5“ – der Bilderwechsel-Interval wird also vom Visual Composer Interface in das div – und aus dem div heraus an den Slider übergeben.

Anstatt das Interface des Visual Composer zu hacken kann man nun einfach in die Quellcode-Ansicht wechseln und den Wert dort manuell anpassen.

Zunächst also über die blaue VC-Schaltfäche den „Klassischen Modus“ aufrufen – dann über den Reiter „Text“ in den textmodus wechseln. (Geht vermutlich auch in der regulären Ansicht – mir ist aber persönlich lieber, wenn ich Shortcodes im Quellcode ändere.)

Anschliessend bekommt man unter Umständen eine sehr umfangreiche Sammlung verschiedener Shortcodes zu sehen – je nachdem, wieviele und welche Elemente man bereits über den Visual Composer in die Seite eingebaut hat. Die entscheidende Stelle sieht dann so aus:

[vc_gallery interval="10" images="22390,23006" img_size="full"]

Hier einfach den Wert für den Interval anpassen – zum Beispiel auf 7 Sekunden – und schon wechseln die Bilder im 7-Sekunden-Takt.

[vc_gallery interval="7" images="22390,23006" img_size="full"]

Der Revolution Slider bzw. das Visual Composer Interface zum Revolution Slider kann mit diesem Wert leider nichts anfangen. Wenn man zu einem späteren zeitpunkt also Bilder hinzufügt kann es passieren, dass das Interface den Wert erstmal wieder auf 3 Sekunden zurücksetzt. Dann muss man *einfach* noch einmal in den Quellcode und den Interval entsprechend anpassen.