Wer den Objektorientierungsansatz von Mootools oft nutzt wird das factory method pattern früher oder später nutzen wollen. Eine einfache Implementierung als Mixin könnte wie folgt aussehen:

var Factory = new Class({
   factor: function(classname, params) {
      return new window[classname](params);
   }
});

Jede Mootools-Klasse wird bei ihrer Definition einer Variablen zugewiesen, welche sich automatisch im global scope, dem window-object, befindet und über den Objektzugriff “[]” angesprochen werden kann.

Die Implementierung dieses Entwurfsmusters lässt sich nun in jeder weiteren Klasse einfach als Mixin nutzen.

var myClass = new Class({
   Implements: [Factory]
});

Related posts:

1. mootools – “SmartTabs” : Tab-Klasse / Tabbing für semantisch korrekt ausgezeichnetes XHTML
2. mootools 1.1 – cheat sheet
3. Javascript Framework mootools 1.1 released / draußen

CSS Sprites sind ein sehr gutes Mittel zur Verringerung der Ladezeiten von Webseiten. Dennoch scheuen viele Entwickler noch den Einsatz von CSS Sprites, da fehlende Erfahrung beim Erstellen viel Zeit kosten und den Performancegewinn zunichte machen kann. In diesem Artikel möchte ich gängige Verfahren und Ansätze darstellen, um übliche Fehler zu vermeiden. Ich möchte dem Leser damit die Fähigkeit vermitteln, die richtigen Entscheidungen zum Einsatz von CSS Sprites treffen zu können.

Was sind CSS Sprites?

Eine knappe Einführung noch vorweg, für alle die mit dem Begriff per se (noch) nichts anfangen können:
Sprites sind (Bild-)Dateien, in denen viele Bilder nebeneinander angeordnet sind. Bei der Darstellung eines Sprite wird aber immer nur ein Ausschnitt gezeigt, während die anderen Bilder verborgen bleiben (maskiert). Beim Verschieben der Grafik im Hintergrund wird ein weiterer Teil sichtbar. Animiert man die Position des Hintergrundbildes, kann so der Eindruck von Bewegung entstehen. Diese Technik entstammt der Computerspielindustrie, wo sie bereits seit Jahrzehnten eingesetzt wird. Genaueres zu Sprites im Allgemeinen findet sich in der Wikipedia.

Kirby Idle Animation by hextupleyoodot - Thanks

Die Einzelbilder der Kirby Idle Animation by hextupleyoodot

CSS Sprites nutzen ebenfalls eine Bilddatei, in der mehrere Einzelbilder enthalten sind, aber meist nicht zum Zwecke der Animation. Vielmehr werden sie als Hintergrundbild vieler Elemente referenziert, wobei durch Angabe der Position das gewünschte Bild dargestellt wird.

CSS Sprites kommen vor allem für kleinere Grafiken und Hintergrundgrafiken zum Einsatz, welche auf einer Webseite zur Gestaltung eingesetzt werden. Diese Technik eignet sich für Designelemente und nicht für inhaltsbezogene Bilder wie Fotos.

Wie funktionieren CSS Sprites genau?

Das folgende Beispielbild enthält mehrere Zustände einer Auswahlbox. Anstatt per :hover, :focus etc. die Bilder auszutauschen, habe ich sie in ein Bild gepackt (>> CSS Sprite). Sie sollen nun als Hintergrundbilder eines HTML-Elements zum Einsatz kommen. Mittels CSS wird dabe das Sprite als background-image zugewiesen. Der Trick besteht nun darin, für jeden Status des Elements die passende background-position zu definieren. Damit wird das Sprite unter dem Element so positioniert, dass die gewünschte Teilgrafik sichtbar wird.

Beispiel für die Verwendung von CSS Sprites

Das passende CSS

.checkbox{
  background: url(checkboxes.png) no-repeat 0 0;
  height: 25px;
  width: 25px;
}

.checkbox.checked{
  background-position: 0 -40px;
}

.checkbox:focus{
  background-position: 0 -80px;
}

[...]

Demo (customformelements.net)

No related posts.

Das Konvertieren von Text in ein DOM und zurück ist z.B. bei der Widget-Entwicklung sehr nützlich. Meist steht nur ein Key/Value Store zur Verfügung, um Daten abzuspeichern. Um darin XML zu speichern und wieder auszulesen, können die Klassen DOMParser und XMLSerializer verwendet werden.

var xmlstring = 'Blink';

var dom = (new DOMParser()).parseFromString(xmlstring, "text/xml");

var stringAgain = (new XMLSerializer()).serializeToString(dom);

No related posts.

Heute musste ich mich um ein Typo3 Problem kümmern, bei dem eine Seite im Vorschau-Modus in Typo3 nicht angezeigt wurde, nachdem das Projekt auf einen neuen Server umgezogen war (The requested page does not exist!).

Nach kurzer Recherche stellte sich heraus, dass Typo3 immer wieder versucht hat, den Inhalt vom alten Server zu holen. Da es sich um eine neu angelegte Seite handelte, fand er diese nicht auf dem alten Server und lieferte obigen Fehler zurück.

Ein Hilferuf von 2006 in der Typo3 Mailingliste beschreibt das Problem ebenfalls sehr gut:
#Auszug#
> hab vor ein paar tagen eine fertiges typo3 system von meinen
> testserver exportiert und auf einen neuen server importiert.
> verlief soweit fast alles problemlos, probleme gibt es nur wenn ich
> versuche im rechten menu “anzeigen” oder bei der seitenerstellung die
> funktion “vorschau (lupe)” nutzen möchte das dann immer wieder meine
> alte serverurl aufgerufen wird.

Michael Hoffmann michael at steinefrenz.net
Fri Oct 13 13:18:08 CEST 2006
#Auszug Ende#

Lösung

In meinem Fall lag das Problem an der Domainkonfiguration im Typo3. Wie im Bild zu erkennen, stand die alte Domain an erster Stelle in der Konfiguration.

Falsche Domainkonfiguration

Nachdem sie mit den Schaltflächen (grün markiert) in der Liste nach unten verschoben wurde, funktionierte auch die Vorschau-Ansicht wieder problemlos und zeigt nun auf den aktuellen Server.

Richtige Domainkonfiguration

Related posts:

1. Extension Backend Konfiguration in Typo3 4.2.8 von Typ file
2. Leerzeichen im Typo3 wrap ohne   per noTrimWrap
3. TYPO3 – Direct Mail Newsletter werden nicht verschickt

Ein kleiner Tipp, um (beliebige) verschiedene Templates in tt_news in Abhängigkeit der Seiten-ID oder irgendeiner anderen Condition zu verwenden.

In der tt_news Dokumentation wird dies nur beiläufig erwähnt. In meinem konkreten Fall wollte ich mehrere Templates für die SINGLE-View verwenden, um in einem den kompletten Artikel darzustellen, und in einer Multibox auf einer anderen Seite dann nur die NEWS_IMAGEs anzuzeigen.

# Change single template for "Galerie" to fetch another template than standard single
[PIDinRootline = {$galleryPageId}]
plugin.tt_news {
  altMainMarkers.TEMPLATE_SINGLE = TEMPLATE_SINGLE_GALLERY
  altMainMarkers.TEMPLATE_SINGLE.wrap = ###|###
}
[global]

Im news-HTML-Template muss dazu ein neues Subpart namens TEMPLATE_SINGLE_GALLERY angelegt und befüllt werden. In meinem konkreten Beispiel schaut das dann so aus:

%MINIFYHTML78c2e5f4a0df4e733dccf2f923de553b0%
###NEWS_TITLE###



            ###NEWS_IMAGE_BOX###
            ###NEWS_IMAGE###
        

Auf der entsprechenden Seite mit der uid {$galleryPageId} muss in diesem Beispiel natürlich ebenfalls ein tt_news Plugin hinzugefügt werden und mit dem code “SINGLE” konfiguriert werden.

Related posts:

1. Typo3 – Benutzer > Aufgaben richtig nutzen (Taskcenter)
2. Leerzeichen im Typo3 wrap ohne   per noTrimWrap
3. dynamischer Seitentitel in Typo3 wie Klickpfad/Breadcrumb

No related posts.

Ich bin gerade bei der Entwicklung einer neuen Extension auf ein seltsames Problem gestoßen, bei der in der Typo3 Extension Backend Konfiguration kein File Upload möglich ist:

In der ext_conf_template.txt (vgl. Hintergrundinformationen zum Konfigurieren von Extensions) habe ich folgende Konfiguration vorgenommen:

# cat=cfe.basic/file; type=file[js]; label= Use your own configuration
customConfig = EXT:cfeConfiguration.js

Nun sollte Typo3 im Backend ein Uploadfeld bereitstellen, welches nur Javascript-Dateien akzeptiert.

Der Output sieht aber ganz anders aus: ein Select-Feld mit der Dateiendung – nichts weiter.

Konfigurationstyp: file wird als select gerendert und nicht wie erwartet als upload Feld

Kennt jemand dieses Problem unter Typo3 4.2.8? Würde mich freuen zu hören! Derweil versuche ich dem Problem auf die Schliche zu kommen…

Related posts:

1. Backend / BE Extension – Konfiguration von Konstanten direkt nach Installation möglich machen
2. eigenes Stylesheet / CSS im Backend Modul der eigenen Extension in Typo3
3. Typo3 nach Umzug auf neuen Server: “Anzeigen / Vorschauoption” springt auf alten Server

Der Internet Explorer verhält sich mal wieder ausnahmslos inkonsistent. Gibt man einem form-Element das Attribut accept-charset=”UTF-8″ und ist dieses Formular in einer ISO-kodierten (oder auch andere) Seite eingebettet, so verschickt der IE (alle Versionen) die Inhalte nur in UTF-8 wenn folgende Bedingung erfüllt ist:

Die Lösung für das UTF-8 charset Problem

Die Eingabe muss ein UTF-8 Zeichen enthalten, welches NICHT in der umgebenden Kodierung (bspw. ISO) abgebildet werden kann. Andernfalls behält der IE die umgebende Kodierung und ignoriert damit das accept-charset.

Abhilfe schafft das Einfügen eines hidden-Fields, welches ein UTF-8 Zeichen enthält. Beispielsweise:

<input type="hidden" name="dummyChar" value="♥" />

Ausführliche Informationen finden sich unter: http://michi.knallgrau.at/blog/stories/3643754/

Meinen besten Dank an Michi von Knallgrau, you made my day!

Da kram ich mir doch meine IE Voodoo Doll wieder raus !!

Related posts:

1. Internet Explorer parsing #1 : Listen und nicht-listen-Elemente

Der Comic mit technischen Ausführungen zum neuen Browser von Google: Google Chrome. Er wurde von Scott McCloud gezeichnet und ist unter der Creative Commons license veröffentlicht.

Einige sehr interessante Einblicke in eine neue Browserarchitektur. Eine Zusammenfassung der Features habe ich ebenfalls veröffentlicht.

Related posts:

1. Google Chrome – Googles Antwort auf neue Anforderungen im Browsermarkt
2. Spam: Entfernung Ihrer Webseite aus dem Google Index von DONOTREPLY@gmail.com
3. Spam: Wichtig: 90 Tage Entfernung Ihrer Webseite www.domain.de aus dem Google Index

Mit Google Chrome geht nun bald ein neuer Browser an den Start. Entwickelt von Google und an die neuen Herausforderungen im Netz angepasst, soll er als weiterer Konkurrent zum Internet Explorer fungieren.

Was für die Webentwickler und Datenschützer zunächst wie ein Albtraum erscheint, könnte sich dennoch als eine echte Alternative zu aktuellen Browsern herausstellen.

Der Browser soll noch im Verlauf des heutigen Tages als Testversion zum Download erhältlich sein.

Weitestgehend technische Erklärungen der Funktionen erhält man beim Lesen eines von Scott McCloud wunderschön gestalteten Comics (erhältlich bei blogoscoped.com oder hier im Blog).

Eine Übersicht der Inhalte / Funktionen:

• Multi-Prozess orientiert:
  Das Problem heutiger Browser sei, dass der Speicher über den Tag beim Öffnen vieler Seiten und dem Laden von Web-Applikationen langsam fragmentiert und somit für den Browser immer mehr speicher eingeräumt werden muss. Google will dies verhindern, indem jeder Tab seinen eigenen Prozess startet, der beim Schließen restlos entfernt und aufgeräumt werden kann (inkl. Speicher). Somit hängt auch nicht gleich der gesamte Browser fest, wenn es in einem Tab zu Problemen kommt > ein robuster Browser.
• Überwachung des Speichers und der CPU-Auslastung von Tabs und Plugins:
  
  Speicherfresser können dank integriertem “Task-Manager” erkannt und eliminiert werden, falls es zu Problemen kommt frei nach dem Motto: “Placing blame where blame belongs”
• Rendering Engine:
  Es wurde die Open Source Webkit Engine eingesetzt, welche auch im Safari und im Opera zum Tragen kommt und für Geschwindigkeit und Konformität steht.
• Javascript Engine V8:
  Von einem dänischen Team wurde eine komplett neue Javascript Virtual Machine namens V8 entwickelt, da bisherige Engines nicht für die Anforderungen (Speicherbedarf..) moderner Web-Applikationen ausgelegt sind. V8 wird unter Anderem den Javascript Code in Maschinencode wandeln, anstatt ihn zur Laufzeit zu interpretieren, was die Abarbeitung schneller macht. Außerdem soll eine präzise Garbage-Collection zum Einsatz kommen. Durch diese und andere Features soll Javascript nun endlich schnell und stabil laufen, was allen Youtubes, Mindmeistern und Online-Offices zu Gute kommt. Zu guter Letzt steht sie unter einer Open Source Lizenz und kann somit auch von Anderen Projekten eingesetzt werden.
• Tabs:
  
  Die Tabs beim Google Chrome Browser werden über der Adressleiste angezeigt (anstatt wie üblich unter dieser). Außerdem sind sie wie eigenständige Anwendungen zu betrachten (vgl. weiter oben) und lassen sich einzeln entkoppeln und mitsamt ihrem Status auf andere Monitore verschieben uws.
• Suche über Fremseiten:
  Ein interessantes Feature, welches in dem Comic auf Seite 20 erwähnt wird ist folgende Funktionalität der Adressleiste: Während der Suche auf einer Seite (z.B. Amazon) erkennt der Browser das Suchfeld und es kann künftig direkt über die Adressleiste gesucht werden, indem man den Namen der Seite angibt und Tab drückt. Nun noch das Suchwort eigetragen und mit enter bestätigt spart man sich das laden einer kompletten Seite und gelangt sofort zu den Ergebnissen. Fraglich ist, bei welchen Seiten diese Funktion unterstützt wird bzw. wie gut die Erkennung eines Suchfeldes funktioniert
• Startseite:
  Ähnlich wie beim Opera setzt man anstelle einer leeren Seite auf eine Art Übersichtsseite mit den neun zuletzt besuchten Seiten, den zuletzt durchgeführten Suchen und den letzten Bookmarks.
• Incognito Surfen:
  Google Chrome bietet eine Tab-Variante für aonymes Surfen an. Keine Daten werden von diesem Tab gespeichert und tauchen somit auch nicht in der History auf. Lesezeichen können nicht angelegt, sonder nur gelesen werden. Cookies werden nach Beenden entfernt. Eine ähnliche Funktion bietet momentan noch der Internet Explorer 8 mit dem InPrivate-Modus (oder auch Porn-Modus laut diversen Diskussionen :)
• Web-Applikationen in eigenem schlanken Browser-Fenster:
  Per Schortcut lassen sich Webapplikationen starten, in denen die übrigen Funktionen wie Adressleiste und Navigation ausgeblendet werden können um nicht von der Anwendung abzulenken.
• Funktionen gegen Malware und Phishing:
  Die Tabs arbeiten in einer Art Sandbox (die Entwickler nennen die Umgebung sogar Jail”) ohne die Rechte Dateien auf die Festplatte zu schreiben oder zu lesen. Dadurch sollen sich auch eventuelle Schadprogramme nicht aus diesen Grenzen bewegen und werden beim Schließen eines Tabs ebenfalls zerstört. Google gibt aber zu, dass vom Nutzer (evtl. unabsichtlich) installierte Plugins diesen Sicherheitsmechanismus umgehen können. Um Phishing vorzubeugen, lädt Google Chrome ständig aktualisierte Listen von Malware und Phishing Seiten herunter und warnt den nutzer beim Betreten der Seite.
• Google Gears:
  Die API für Google Gears ist gleich im Chrome Browser integriert.
• Open Source:
  Der gesamte Code wird unter einer Open Source Lizenz veröffentlicht (ähnlich Mozilla Firefox), so dass andere Entwickler Teile in Ihren eigenen Projekten nutzen können.

Fazit

Mit dem neuen Browser könnte Google nun schon nicht mehr nur das Internet, sondern auch die Anwendung “drumherum” beherrschen, was natürlich einige Ängste schürt. Trotzdem klingen die Features vielversprechend, insbesondere die V8 könnte die Performance von heutigen Webanwendungen erheblich steigern und Entwickler und Endnutzer könnten davon‚ profitieren. Nebenbei wird – sollten die Versprechen gehalten‚ werden – der relativ festgefahrene Browsermarkt mal wieder in Bewegung kommen und Browserhersteller gezwungen sein neue Wege einzuschlagen (ich denke da insbesondere an den Internet Explorer).

Ich bin gespannt, ob alle Erwartungen und Versprechen gehalten werden können und freue mich darauf, den neuen Browser mal auf einer Testfahrt zu erproben.

Hier noch einmal der Link zu den Comics, falls‚ er oben überlesen wurde :)

[Bild: Copyright by Google]

Related posts:

1. Google Chrome Comic
2. Spam: Entfernung Ihrer Webseite aus dem Google Index von DONOTREPLY@gmail.com
3. mootools – “SmartTabs” : Tab-Klasse / Tabbing für semantisch korrekt ausgezeichnetes XHTML

Ich habe vor Kurzem in der PM Kreativ einen mir bis dato unbekannten Rätseltyp entdeckt:

Kropki

Die Regeln sind sehr einfach gehalten. Ein n x n großes Feld soll so mit Zahlen ausgefüllt werden, dass jede Zahl von 1 bis n in jeder Spalte und jeder Zeile nur einmal vorkommt.

Soweit ähnelt es dem sudoku sehr, nun sind aber meistens keine Zahlen vorgegeben. Stattdessen finden sich zwischen einzelnen Feldern zwei Typen von Punkten (meist durch unterschiedliche Farben gekennzeichnet), welche den Witz in diese Rätselart bringen.

Kropki bedeutet übrigens auf Polnisch “Punkte”.

Weitere Regeln:

1. Befindet sich ein schwarzer Kreis zwischen 2 Feldern, so muss in einem der beiden Felder das Doppelte des anderen Feldes stehen.
2. Befindet sich ein weißer Kreis zwischen 2 Feldern, so unterscheiden sich die Zahlen dieser beiden Felder genau um den Wert 1.
3. befindet sich zwischen 2 Feldern kein Kreis, so darf keine der oben genannten Eigenschaften auf die beiden Zahlenwerte der Felder zutreffen

Mir hat das erste Kropki sehr viel Spaß gemacht, zumal es sehr logisch aufgebaut ist und es sich gegen Ende zu rasch entwickelt. So bietet diese Rätselart einen kurzweiligen Gehirntwist, der nicht gleich 4 Stunden frisst.

Ein Beispiel

Ein paar Beispiele finden sich auf Matroids Matheplanet im Beitrag **Kropki.

Anmerkung

Es gibt offensichtlich mehrere Typen von Kropki. Eines ähnelt sehr dem Sudoku (oben beschrieben), ein anderes eher dem japanischen Go (http://www.nongnu.org/kropki/)

No related posts.

Hier die Ergebnisse einiger Wochen konzentrierter Arbeit in den benannten Fächern.

Dies waren die letzten Noten, welche ich noch vor Beginn meiner Diplomarbeit benötigte :)

Climber

Computeranimation

Aufgabe

Erstellen einer Charakteranimation basierend auf einer Gliederpuppe unter Nutzung inverser Kinematik.

Interpretation

Sie handelt von einem Bergsteiger, welcher sich seinen Weg auf den Gipfel bahnt. Nach kleineren Hindernissen oben angekommen, verliert er schuldhaft sein Leben.

Click here to view the embedded video.

A tick of life

Digitales Compositing

Aufgabe

Unter Verwendung der in der Vorlesung vorgestellten Techniken soll ein kurzer Videoclip (ca. 20 Sekunden) erstellt werden. Das Thema ist frei wählbar

Interpretation (in Zusammenarbeit mit Mario G.):

Der Film handelt von der Vergänglichkeit von Schönheit und der Flüchtigkeit des Augenblicks, was sich in der Erscheinung eines Origami-Kranichs manifestiert, welcher durch einen Vogelschiss zum Leben erweckt wird.

Click here to view the embedded video.

Wer konkrete Fragen zur Umsetzung hat, kann mich gern anschreiben.

Related posts:

1. Kappa Mikey feat. “The Internet is for porn”
2. Robot Chicken – Calvin and Hobbes

I’ve updated the cheat sheet and increased contrast for b/w printers.

See the original post

Ich habe heute das mootools 1.2 cheat sheet in etws abgeänderter Form (erhöhter Kontrast – besonders für Schwarz-Weiß-Drucker geeignet) erneut hochgeladen

Download im Beitrag zum mootools cheat sheet

Related posts:

1. mootools 1.2 cheat sheet
2. mootools 1.1 – cheat sheet
3. mootools – custom Form Elements 1.8beta: Checkboxen und Radiobuttons selbst per CSS gestalten

Hier ein kleiner Life-Saver. Wenn beim Rendern eines Films After Effects CS2 oder CS3 immer wieder aus scheinbar unerfindlichen Gründen abstürzt, dann kann die Ursache in einem Problem der Speicherverwaltung bezüglich des Ebenencaches in After Effects liegen.

AE bricht dann während des Renderns mit einer Fehlermeldung ab, welche in etwa besagt dass nicht genügend Speicher vorhanden wäre.

Abhilfe schafft hier ein kleiner Trick:

Die versteckten Optionen.

Einfach die SHIFT-Taste gedrückt halten und Bearbeiten > Voreinstellungen > Allgemein wählen. Nun erscheint in der Dropdown-Box der Optionen eine neue Auswahl “Versteckt“. Um den Speicherüberlauf (?) zu beheben, wählt man Ebenencache deaktivieren und ca. alle 50 Frames entleeren. Das Rendern dauert nun zwar ein wenig länger, läuft dafür aber durch.

Related posts:

1. Browser hängt sich beim Einbinden von Javascript auf oder stürzt ab

Diese Comics von Kris Wilson muss man gesehen haben!

Sie laufen unter dem Namen Cyanide and Happiness und sind teilweise so genial, dass ich sie einfach mal erwähnt haben muss.

Teils obskur, teils böse, teils einfach blöd beschreibt der 19-Jährige aus Wyoming (nicht-)alltägliche Situationen, welche stets auf den letzten Frame pointiert sind.

Es gibt nichts Schöneres als morgens aufzustehen und ein paar von diesen Comics anzusehen…

Nunja…

Ok: Einer meiner Favoriten: Time

No related posts.

Heute ist es nun soweit – der Firefox 3 soll herauskommen und dabei gleich einen Weltrekord aufstellen. Es wurde zum Firefox 3 Download-Day aufgerufen, welcher heute also am 17. Juni 2008, stattfinden soll – und Firefox soll mit den meisten Downloads einer Software an einem Tag in Guinessbuch der Rekorde.

Da FF sowieso mein bevorzugter Browser ist, unterstütze ich diese Aktion natürlich (wie auch im Footer zu sehen ist). Einziges Problem: Als ich nun heute am besagten Tag den FF 3 downloaden wollte (es ist gerade 7:46 Uhr), ist auf der Spreadfirefox-Seite noch nichts von dem Release zu finden. Stattdessen verweist ein Download-Link noch auf die Version 2.0.0.14.

Ich hoffe bloß, dass die Entwickler gerade alles geben, um den Download bereitzustellen, denn nach einem so großen Aufruf sollte die gesammelte Energie übers Netz und auch außerhalb nicht einfach verpuffen.

Vielleicht liegts ja einfach an der Zeitverschiebung, denn in San Francisco ist es jetzt erst 22:46 :)

Edit: Danke für die Hinweise: Der Download-Day geht also hier in Deutschland erst 19.00 Uhr los ^^

Related posts:

1. Firefox – die 10 nützlichsten Addons / Plugins für Webentwickler
2. Flash: wmode = transparent = evil (Firefox)
3. Wieder online :)

The Javascript Framework mootools recently hit the “advance” button and so mootools 1.2 was published! It comes along with great new features and speed improvements.

For your coding pleasure, i just updated my cheat sheet to the new revision. It includes cheat sheet like documentation for Core, Native, Class, Element, Utilities and Request. I’ll launch another cheatsheet which will cover FX and Plugins soon.

Enjoy!

Download as PDF (increased contrast – printer friendly)

Mootools 1.2 Basic Cheat Sheet (printer friendly) [*.pdf, 80kB]

Download as PDF (Standard)

Mootools 1.2 Basic Cheat Sheet [*.pdf, 82kB]

I’ll update it tonight, so that the headers will be direct links into the mootools docs! Done!

Related posts:

1. mootools 1.1 – cheat sheet
2. mootools 1.2 cheat sheet updated
3. kj_imagelightbox 2 für mootools slimbox

Das solide Newslettersystem Direct Mail bereitet besonders Einsteigern immer wieder Kopfschmerzen: Oftmals werden Newsletter aus unerklärlichen Gründen nicht verschickt und die Nutzerführung war für die Redakteure, welche letztenendes den Newsletter aufbereiten und verschicken sollen bis vor Kurzem recht umständlich.

Dieser Beitrag soll die wichtigsten Probleme behandeln und mit Hilfe der Kommentare ständig erweitert werden.

HTML-Newsletter werden nicht verschickt

Dieses Problem lässt sich zum Glück in den meisten Fällen einfach und schnell regeln. Die häufigste Ursache liegt in der Liste der Abonnements – sind diese händisch eingepflegt oder per direct_mail_subscription nicht komplett in die Datenbank geschrieben, so fehlt der Haken im Feld “Newsletter im HTML-Format empfangen” bei den Abonnementen. Damit dieses automatisch gesetzt wird, sollte man im Template für das Anmeldeformular ein hidden-Feld einfügen:

Somit wird für jeden neuen Abonnementen der Wert gleich auf 1 gesetzt.
Welche Gründe gibt es noch? Schreib nen Kommentar.

Massenversand startet, verarbeitet Abonnenten aber es werden keine Mails verschickt

Für dieses Problem kann es mehrere Ursachen geben, das Resultat ist immer das selbe: Der Versand wird angestoßen, aber in der Versand-Statistik steht keine Anzahl der Versendeten Mails.

• In Vebindung mit htaccess

  In einem meiner Projekte habe ich zur Vermeidung von duplicate Content per htaccess die Anfragen an die Domain domainname.tld auf www.domainname.tld umgeleitet. Nun habe ich mich trotzdem unter domainname.tld/typo3 eingeloggt und wollte einen Newsletter versenden. Es lief soweit alles normal und auch die Vorschau sah gut aus. Leider wurden die E-Mails per Massenversand nicht verschickt (vgl. Bild oben). Eine Testmail ergab außerdem, dass nicht der Inhalt des Newsletters, sondern die gesamte Seite als Newsletter verschickt wurde. Nach eingehender Prüfung musste ich feststellen, dass direct_mail nicht die per baseURL gesetzte URI als Ausgangsbasis zum Rendern/Erstellen des Inhalts des Newsletters verwendet, sondern den Pfad des eingeloggten Nutzers. In meinem Fall habe ich mich noch einmal ausgeloggt und unter www.domainname.tld/typo3 wieder eingeloggt – der Newsletter konnte problemlos verschickt werden.
  Fazit: Ich werde die htaccess-Konfiguration wohl noch einmal überprüfen, so dass alle Parameter beim Umleiten ohne www zu www mitgenommen werden.

Welche Probleme habt ihr erfahren und wie gelöst? Hinterlasst einen Komentar oder einen Trackback. Ich möchte hier gern eine Problemlöse-Sammlung rund um direct_mail enstehen lassen.

Related posts:

1. Direct Mail Newsletter Anmeldung über Mailformplus oder ein anderes Kontaktformular
2. Extension Backend Konfiguration in Typo3 4.2.8 von Typ file
3. Typo3 nach Umzug auf neuen Server: “Anzeigen / Vorschauoption” springt auf alten Server

Ich habe mich vor einiger Zeit mal mit dem Typo3 Plugin kj_imagelightbox 2 befasst und es in einem Projekt eingesetzt. Da ich aber anstatt der Kombination aus Prototype/Scriptaculous/Lightbox lieber eine mootools/slimbox einsetzen wollte, habe ich das Plugin entsprechend umgeschrieben, so dass es möglich wird, mootools zu verwenden.

Meine Anpassungen basieren auf der Version 1.4.2 der kj Imagelightbox.

Die “neue” kj_imagelightbox

Folgende Möglichkeiten bieten sich nun in der Extension-Konfiguration:

• Use mootools slimbox – JS will be mootools/slimbox instead of prototype/scriptaculous/lightbox (more lightweight) [selbserklärend]
• Deactivate inclusion of JSFramework – useful if you are already using this js framework on your site [Option zum Abschalten der Einbindung des Javascript-Frameworks, falls es auf der Seite schon verwendet wird]

Alle anderen Einstellungen für die Lightbox werden auch für die Slimbox übernommen.

Download

t3x_kj_imagelightbox2-1_4_2 [ *.t3x, 738 kB ]

Ist dir diese Arbeit 1 € wert?

gepatchte Files

• class.ux_tslib_content.php
• ext_conf_template.txt
• ext_tables.php
• neuer Ordner “slimbox” mit den Files der Slimbox sortiert in Ordnern css, images, js

Danke an den Programmierer dieses schönen Plugins.

Related posts:

1. kj_imagelightbox 2 – Bugfix für Captions / Bildüberschriften bei mehreren Content Elementen
2. mootools 1.1 – cheat sheet
3. mootools 1.2 cheat sheet

Als ich neulich abends an der Elbe entlang spaziert bin, habe ich ein paar Boule-Spieler gesehen, die bei Dämmerung noch gespielt haben. Eine Laterne war nicht in der Nähe und ich fragte mich, wie lange sie wohl ihre Boule-Kugeln noch voneinander entscheiden können.

Da kam mir die Idee der leuchtenden Boule-Kugeln. Ok – nicht wirklich neu ist der Fakt, dass sie leuchten, denn die gibts schon als Glow-in-the-dark Plastik-Version mit Batterien – finde ich persönlich aber nicht sehr ästhetisch. Metallene Boule-Kugeln mit leuchtenden Ringen wären doch viel ansprechender.

Mein Vorschlag

wäre eine Technik, wobei die kinetische Energie beim Werfen und Aufprall der massiven Kugeln genutzt wird, um 1-4 LEDs zu versorgen. Sie bieten eine lange Haltbarkeit und benötigen relativ wenig Strom. Sie sind dabei in der Kugel integriert und beleuchten die Ringe der Kugeln (welche sich ja von Spieler zu Spieler unterscheiden) von innen. Jeder Spieler hat dabei seine eigene Farbe. Mit diesen Kugeln ausgestattet, könnte man bin tief in die Nacht spielen :)

Und die kleine Zielkugel?

Bleibt nur noch die Frage der Beleuchtung der Zielkugel. Nunja, diese könnte man mit einer weißen LED und einer Knopfzelle beleuchten. Oder auch per kinetischer Energie, indem man die Zielkugel vor dem Werfen etwas schüttelt, worauf diese dann 10 Minuten lang leuchtet – Zeit genug für 1-2 Runden.

Leider habe ich von Elektronik zu wenig Ahnung, um hier nun einen Bauplan aufzustellen und nachzuweisen, dass die kinetische Energie ausreicht, um die Kugeln ausreichend zu beleuchten aber einen Gedanken wars mir wert ;)

Visualisierungsbeispiel

Eine Ahnung von dem Stil der Umsetzung fand ich nachher auf deviantart von dem Mitglied manuamador.

No related posts.

Ich habe meine Webseite gerade mal dem Test mit dem kostenlosen SEO-Tool websitegrader unterzogen und bin reichlich erfreut über die Ergebnisse – keine gravierenden Mängel soweit und einen Score von 85 von 100.

Ergebnisse im Detail

Nachdem sich mit dem Service von seitwert leider keine Verzeichnisse analysieren lassen (das /blog/ an meiner domain – meiner Meinung nach der gravierendste Mangel an seitwert), habe ich eben mal nach einer Alternative gesucht. Ich hatte auch noch eine andere deutsche Seite im Hinterkopf, dessen Name mir leider entfallen ist (so etwas wie amtfürwebdesign oder ähnlich – vielleicht kann mir da nochmal jmd auf die Sprünge helfen)

Ach ja – nebenbei habe ich festgestellt, dass mediavrog.net/blog nun doch schon einen Pagerank von 4 aufweist, was mehr ist als ich mir erwartete – wenn ich noch an der Qualität meiner Posts arbeite und noch spannendere Themen poste, erreiche ich vielleicht auch die 5. Nunja – das ist wohl wirklich noch Utopie!

Jetzt kann ich erstmal gut schlafen ^^

No related posts.

Mein Blog ist nun schon etwas über ein Jahr alt (um genau zu sein1 Jahr und 1 Woche) und das habe ich zum Anlass genommen, den Blog eine kleine Schönheitskur zu verpassen. Das war dringend notwendig!

Ich hoffe das Design findet Zuspruch – bin in einigen Teilen immer noch etwas unzufrieden. Nichtsdestotrotz muss ich mich nun wieder dem Studium und damit verbundenen Aufgaben widmen – irgendwann muss man ja den Schritt wagen und an die Öffentlichkeit gehen :)

Alles neu macht der Mai

Es sind ein paar neue Features hinzugekommen bzw. haben sich verändert:

• RSS-Feed über den RSS-Baum abonnierbar
• links neben dem Post befindet sich nun eine Metanavigation, die auf folgenden Teilen besteht:
  • Kategorie(-kürzel) – Weitere Beiträge aus dieser Kategorie ansehen
  • Datum – per Klick auf einen Teil des Datums kann man im entsprechenden Archiv stöbern
  • Anzahl der Kommentare – per Klick gehts direkt zu den Kommentaren
  • Social Bookmarking – no comment
• wie gehabt befinden sich die Tags unter dem Post
• unter dem Inhalt des Posts werden, falls vorhanden, ähnliche Artikel angezeigt
• Es gibt jetzt 2 Links “Back to Top” unten links und unten rechts – so sollten sowohl Links- als auch Rechtsscroller glücklich werden
• ganz unten befindet sich nun die Sidebar (hm.. oder Bottombar), mit den zuletzt verfassten Artikeln und der Kategorienliste (uvm.). Ich denke dass sie nicht unmittelbar gebraucht wird um auf der Seite die passenden Beiträge zu finden, denn über die Kategorienkürzel und das klickbare Datum kann man wunderschön navigieren und stöbern
• das Stöbern mit Tags funktioniert wieder

Eckdaten (aus Semmelstatz)

• 373 Tage online seit 13.5.2007
• 55 Beiträge
• 97 Kommentare seit 29.5.2007
• 0,15 Beiträge pro Tag
• 0,27 Kommentare pro Tag
• 49 Kommentierer
• 22381 Besucher insgesamt seit 31.5.2007
• 65 Besucher pro Tag

Nunja – viele Besucher sind das nicht, aber ich habe ja auch nicht wirklich viel geschrieben – laut Statz habe ich es immerhin auf über 100 Besucher am Tag geschafft :)

Vielen Dank an die Community deviantart

Danke an all die Künstler für Inspiration und Ressourcen. Im Footer habe ich alle nochmal verlinkt! Ein spezieller Dank geht auch an Julian Klewes dessen Theme Feather ich als Vorlage für die Seitenstruktur verwendet hab – (das Photoshop-File war am nützlichsten)

Nun würde ich gern euer Feedback zum Design hören? Was gefällt euch, was nicht (das ist mir als Kommentar sogar noch lieber ;P )

No related posts.

Wie schon in einem vergangenen Artikel bemerkt, gibt es immer noch Probleme im Einsatz mit sIFR – ein hartnäckiges Problem und ein absoluter Blocker im IE ist das Verhalten von sIFR-Überschriften mit transparentem Hintergrund.

Eine kurze Erklärung: [der Sachverhalt bezieht sich auf sIFR 3 Revisionen bis 405]

Beschreibung des Fehlverhaltens / Voraussetzungen

Nutzt man den transparenten Hintergrund von sIFR-Überschriften (in der replace-Methode wmode: “transparent” übergeben) so kann man im Internet Explorer, sobald sich der Mauszeiger über einer der per sIFR ersetzten Überschriften befindet, die Seite nicht mehr scrollen. Der Flash-Film entzieht dem document irgendwie den Fokus, welcher sich dann im Flash-Film selbst befindet – alle Events kommen somit nicht mehr im document der Seite an.

Dieses Problem tritt nur im Internet Explorer (6/7) auf. In anderen Browsern wie Firefox, Safari, Opera gibt es damit keine Probleme.

Wichtig: Setzt man den wmode-Parameter auf window (oder eben gar nicht), so tritt der Bug nicht auf, aber der Hintergrund der Überschriften wird mit einer Farbe gefüllt. Man sollte sich vorher überlegen, ob die Transparenz unbedingt nötig ist, da auch einige Performanceprobleme mit transparenten Flash-Filmen auftreten können – insbesondere wenn viele Überschriften mit sIFR ersetzt werden.

Dirty Workaround

Sofern sich die Überschriften immer am selben Platz befinden und nicht durch DHTML verschoben werden (z.B. durch ein Akkordeon-Effekt) und die Überschriften nicht klickbar sein müssen, gibt es einen Weg um Scrollen auf der Seite zu ermöglichen.

Die Idee

Lege über jede ersetzte Überschrift einen DIV-Layer, mit statischer Position und Breite/Höhe der sIFR-Überschrift. Somit kann das Flash-Objekt den Fokus nicht mehr stehlen.

Umsetzung

Dazu nutzt man den onReplacement-Callback der als Parameter an die replace-Methode übergeben werden kann (siehe Dokumentation).

onReplacement (Function)
Event handler which fires when an element has been replaced. It's argument is a FlashInteractor object

Anhand dieses Callback kann man pro ersetzter Überschrift JS Code ausführen. In Pseudocode:

onReplacement: function(obj){
if(ie){
     var tmpSize = getSize(obj.ancestor);
     var tmpPos = getPos(obj.ancestor);

     //create Div with size/pos from above with position absolute
     var bogusLayer = new Element("div").setPos(tmpPos).setSize(tmpSize).setPositionMode("static");
     bogusLayer.setOpacity(0.001);

     //insert div into dom, above the sifr-replaced object
     bogusLayer.injectAsFirstElement(obj.ancestor);
}
}

Bis Mark Wubben einen wirklichen Workaround gefunden hat, ist dies eine Möglichkeit den Bug zu umgehen.

Related posts:

1. Probleme mit sIFR 3 und SWFObject auf einer Seite im IE 6 und 7
2. Internet Explorer Voodoo Doll / Puppe
3. Internet Explorer parsing #1 : Listen und nicht-listen-Elemente

Wer des Öfteren mal Suchanfragen bekommt, welche Zeichen wie > < … enthalten merkt schnell, dass semmelstatz damit nicht so leicht klar kommt. Um genau zu sein wird unter “Die neuesten X Suchbegriffe” der Content ab so einem Zeichen (besonders beim “<”) weggeschnitten, da es vom Plugin nicht escaped wird.

Der Browser versucht dann natürlich ein HTML-Tag zu erkennen, was dann nie richtig geschlossen wird.

Abhilfe schafft 1 Zeile Code in der semmelstatz_func.php (in Zeile 270 einfügen):

$keyword = htmlspecialchars($keyword, ENT_QUOTES);

(direkt unter $referer = htmlspecialchars($referer, ENT_QUOTES); )

Somit werden nun auch die Keywords entschärft und die Übersicht immer korrekt dargestellt.

Related posts:

1. Wordpress Statistik Plugin “semmelstatz” im Einsatz
2. Wordpress 2.5 – Bilder größer als 500 Pixel Breite in Beiträge einfügen
3. WordPress Plugin Competition – Teilnehmen aber wie!?

In Wordpress 2.5 gibt es eine intern verankerte Option, welche die maximale Breite eines Bildes auf 500px setzt. Somit können größere Bilder nicht ohne Weiteres in Beiträge eingefügt werden.

Schon im tinyMCE wird das Bild verkleinert dargestellt. Dies dient dazu, dass die Bilder das Layout der Seite nicht sprengen und so nie größer als der Inhaltsbereich angezeigt werden.

Die Ursache

In der Datei wp-includes/media.php wird diese Grenze definiert (Zeilen 30-34)

if ( !empty($GLOBALS['content_width']) ) {
   	$max_width = $GLOBALS['content_width'];
}
else
	$max_width = 500;

Nun was sagt uns das? Angenommen die globale Variable

$GLOBALS['content_width']

wäre definiert, würde Wordpress diese Breite, anstatt der 500 nehmen.

Die Lösung

Gesagt, getan… Wir legen im Ordner unseres Themes (denn wir wollen ja die maximale Bildergröße an unser spezielles Layout anpassen) einfach die Datei functions.php an, falls sie nicht sowieso existiert. In der Datei definieren wir einfach die passende maximale Breite der Bilder für unser Theme, in dem wir die Variable mit einem Wert belegen:

<?php
	$GLOBALS['content_width'] = 1250;
?>

Fertig – schon lassen sich auch größere Bilder bis 1250px Breite und mehr in die Posts einfügen.

Update 13.07.2009 – content_width und Wordpress 2.8.x

In neueren Versionen von Wordpress wurde offensichtlich auf $GLOBALS verzichtet. Um den gewünschten Effekt zu erreichen, kann nun im functions.php einfach folgendes definiert werden:

<?php
	$content_width = 1250;
?>

In der media.php wird auf diese Variable per

global $content_width;

zugegriffen.

Related posts:

1. Wordpress 2.5 > tinyMCE 3.0.6 > Template Plugin zum Laufen bekommen
2. WordPress Plugin Competition – Teilnehmen aber wie!?
3. Wordpress Statistik Plugin “semmelstatz” im Einsatz

Dieser Bugfix wird in neuen sIFR 3 builds nicht mehr benötigt: vgl. UPDATE 11.04.08 weiter unten und die Kommentare.

———-

In einem Projekt bin ich vor Kurzem auf ein seltsames Verhalten von sIFR 3 gestoßen.

Problembeschreibung

Komischerweise zeigte meine Testseite im Internet Explorer 6 und 7 keinen Inhalt an. Der XHTML Quelltext blieb (fast) leer.

Alles was im Quelltext stand war

<script src="wp-content/themes/meinTheme/swf/meineFont.swf" type="sifr/prefetch"></script>

… ansonsten war die Seite weiß und leer.

Nach einer kurzen Recherche bin ich dann auf den Beitrag von EightEightZero gestoßen, welcher auch mit dem Problem zu kämpfen hatte, aber einen Bugfix anbietet. Das Problem taucht bei Verwendung von sIFR 3 und SWFObject 1.5 auf ein und derselben Seite auf. Leider hat das Setzen des im Bugfix beschriebenen Parameters keine Wirkung in meiner Testumgebung gezeigt.

Nach weiterem Stöbern in der Dokumentation von sIFR 3 bezüglich der Javascript Konfiguration und einigen sIFR-Foren-Beiträgen habe ich letzendlich die passende Lösung gefunden. Der Parameter hat in der von mir verwendeten Version von sIFR (version 3, revision 382) einfach einen anderen Namen bekommen:

sIFR.useDomLoaded = !sIFR.ua.ie;

Dies teilt sIFR mit, dass es im IE (sIFR.ua.ie > true, wenn IE) die useDomLoaded-Funktionalität nicht anwenden soll. Nach dem Löschen des Cache sollte die Seite nun ohne Probleme im Internet Explorer 6 und auch in der 7er Version des IE angezeigt werden.

Wichtig: Dieser Parameter muss nach sIFR.prefetch und vor sIFR.activate gesetzt werden

UPDATE 11.04.08:

Ich bin jetzt auf die sIFR Version 3 r395 umgestiegen und der oben beschriebene Bugfix ist nicht mehr nötig.

Dabei ist mir noch eins aufgefallen: Wer Probleme mit sIFR und mootools hat, sollte sicherstellen, dass der sIFR Code (sIFR.replace usw) nicht in einem onDomReady-Event eines Javascript-Frameworks wie z.B. mootools steht, da sonst Fehler im IE entstehen. sIFR nutzt eine eigene domReady-Methode.

Leider taucht in dieser Version ein andere Bug auf: Fehlerhaftes Scollverhalten im Internet Explorer. Wenn die Maus über einem Flash-Element steht, kann man die Seite im Internet Explorer nicht mehr scrollen.

Related posts:

1. sIFR Probleme beim Scrollen im Internet Explorer 6 und 7
2. kj_imagelightbox 2 – Bugfix für Captions / Bildüberschriften bei mehreren Content Elementen
3. IE Bug: Accept-charset UTF-8 in Formularen, welche in ISO Seiten eingebettet sind

Durch eine große Pfütze schauen und sich vorstellen hindurchzuspringen, in eine gespiegelte Welt. Oder etwas aus dieser Pfützenwelt anpacken und in die Realität ziehen.

Die Spiegelung wird auch sehr spannend, wenn man sich vorstellt in dieser gespiegelten Welt umherzulaufen – die gewohnten Orte und Gegenstände würden verkeht herum stehen und vielleicht sogar etwas interessanter.

Pfützen bieten jede Menge Fläche zum Spielen und Herumdenken…

No related posts.

Wordpress 2.5 kommt nach dem großen Versionsprung nun auch endlich mit der Version 3 des tinyMCE Editors daher. Bei der Konfiguration des neuen tinyMCE ist mir aufgefallen, dass das Template-Plugin bei einer bestimmten Einstellung nicht mehr funktioniert. Die Lösung liegt in der Verwendung eines anderen Initialisierungsparameters.

Doch vorerst zur Installation.

tinyMCE im Wordpress Bundle wird nämlich nur mit einer spärlichen Anzahl an Plugins ausgeliefert. Dazu gehören autosave, directionality, fullscreen (Vollbildmodus beim Editieren), inlinepopups, media, paste, safari, spellchecker und wordpress. Doch tinyMCE hat mehr zu bieten und nach Anforderung sollten auch die Templates wieder mit von der Partie sein. Nach Download der aktuellsten Version auf der Seite von moxiecode (welcher dann auch alle Plugins beinhaltet) musste ich erstmal feststellen, dass mit Wordpress offenbar eine noch nirgens (auch nicht im SVN) erschienene Version von tinyMCE ausgeliefert wird (vgl. aktuelle Version 3.0.5 <> Wordpress tinyMCE 3.0.6). Ich nehme an dass in der Wordpress Version einige Kompatibilitäten integriert worden sind.

Aber zurück zum Template-Plugin. Nach Kopieren in den tinyMCE Plugin-Ordner und Anpassen der tiny_mce_config.php (wp-includes\js\tinymce) an folgenden Stellen erschien schonmal der Template Button wieder:

$plugins = array( 'safari', 'inlinepopups', [...], 'template' );
$mce_buttons = apply_filters('mce_buttons', array('bold', [...], 'template' ));

[Hinweis: Die manuelle Anpassung der tiny_mce_config.php empfelhe ich nicht. Diese und folgende Einstellungen können in ein WP Plugin ausgelagert werden was bedingungslos zu empfehlen ist, da sie bei einem Upgrade von Wordpress ansonsten verloren gehen können; Wordpress bietet zur Konfiguration von tinyMCE (insbesondere Hinzufügen eigener Buttons) Filter an!]

Die weitere (gewohnte) Definition der eigenen Templates im $initArray schlug dann aber fehl:

'template_templates' => array(
	array("TemplateName","TemplateURL","TemplateBeschreibung"),
	array("TemplateName2","TemplateURL2","TemplateBeschreibung2")
);

Die Ursache

Nach langer Recherche und Debuggen (danke Firebug!) habe ich die Ursache gefunden:

In der tinymce_plugin_verzeichnis/template/js/template.js wird in der init-Funktion versucht den festgelegten Parameter template_templates per

tsrc = ed.getParam("template_templates", false);

auszulesen. Leider liefert die Funktion ed.getParam aber nur Strings zurück, was bei einem Array in Javascript den String “Array” zurückgibt. Klar dass die weitere Abarbeitung (insbesondere der Versuch diesen String zu durchlaufen und URLs daraus zu ermitteln) fehl schlägt und mit folgendem Fehler abbricht (Stack aus Firebug):

u has no properties

_init(undefined, Object base_uri=Object)tiny_mce_config.p... (line 39)

_init(undefined, undefined)tiny_mce_config.p... (line 39)

init()template.js (line 24)

(no name)(Object scope=Object)tiny_mce_popup.js (line 204)

_init([Object scope=Object], function(), [Object

scope=Object])tiny_mce_config.p... (line 39)

_onDOMLoaded()tiny_mce_popup.js (line 203)

(no name)()

Die Lösung dazu

Zumindest bis der Bug gefixt wurde, ist recht einfach. TinyMCE lässt die Definition der Templates auch in einem externen Javascript-File zu.

Dazu wird einfach im initArray der Parameter template_external_list_url genutzt. Gefüllt mit dem Pfad zu einem Javascript-Datei (vgl. beispielhafter Aufbau), welche dann das Array von Templates enthält funktioniert auch der Template-Button wieder wie gewünscht.

Ein letztes Problem

Mein letztes Problem ist nur noch, dass aus unerfindlichen Gründen die Platzhalter für die Lokalisierung nicht ersetzt werden (vgl. Screenshot)

Wenn dazu noch jmd eine Lösung kennt und sie hier postet wäre ich sehr dankbar :)

Related posts:

1. WordPress Plugin Competition – Teilnehmen aber wie!?
2. Wordpress Statistik Plugin “semmelstatz” im Einsatz
3. Wordpress 2.5 – Bilder größer als 500 Pixel Breite in Beiträge einfügen

Die Anmeldung zum Erhalt eines Newsletters per DirectMail läuft bekannterweise über die Extension Direct Mail Subscription.

Doch leider fehlt es ihr an Flexibilität, da die Funktionalität des Anmeldens (inkl. Versand einer Bestätigungsmail) nicht in einer Methode gekapselt ist, sondern über Typoscript realisiert wird (userFunc). Somit ist es nicht ohne Weiteres möglich, eine Newsletteranmeldung per Checkbox in einem beliebigen (Kontakt-)Formular zu integrieren. Im Folgenden wird eine Lösung gezeigt, welche die beschriebene Funktionalität ermöglicht.

Das TS-Setup findet sich in der ext_typoscript_setup.txt von Direct Mail Subscription (ein Auszug):

plugin.feadmin.dmailsubscription >

plugin.feadmin.dmailsubscription = USER_INT

plugin.feadmin.dmailsubscription {

   userFunc = user_feAdmin->init

   includeLibs = media/scripts/fe_adminLib.inc

   templateFile = {$plugin.feadmin.dmailsubscription.file.templateFile}

[...]

Nach dem Einschreiben über das Frontendplugin von Direct Mail Subscription werden die Daten an die init-Methode der Klasse user_feAdminübergeben, welche sich um das Speichern der Daten in der richtigen Tabelle und den Versand einer Bestätigungsmail (Double Opt-In) kümmert.

Um diese Funktionalität in der eigenen Extension oder einer userFunktion (z.B. bei Mailformplus die saveUserFunc) nutzen zu können muss man wie im TS die richtigen Bibliotheken einbinden und noch ein paar Parameter setzen. Es folgt eine Schritt für Schritt-Anleitung. Es wird vorausgesetzt, dass bereits eine PHP-Datei exisitiert, welche nach dem Abschicken des Mailformulars ausgeführt wird (ähnlich der saveUserFunc von Mailformplus ) und die Extension Direct Mail Subscription passend konfiguriert ist.

die benötigten Klassen und Bibliotheken einbinden

// fe_admin Bibliothek; speichert Daten in DB und verschickt die Bestätigungsmail
require_once("typo3/sysext/cms/tslib/media/scripts/fe_adminLib.inc");

// Extension Direct Mail Subscription; enthält Konfiguration; wird eventuell nicht gebraucht(?)
require_once(t3lib_extMgm::extPath('direct_mail_subscription').'pi/class.dmailsubscribe.php');

Die Konfiguration von Direct Mail Subscription holen

$conf = $GLOBALS['TSFE']->tmpl->setup['plugin.']['feadmin.']['dmailsubscription.'];

In dieser Konfiguration ist unter Anderem der Pfad zum Template der Anmeldung kodiert, welche von feAdmin benötigt wird. Falls das Template nicht gefunden wird, so kann man den Pfad auch korrigieren:

$conf['templateFile'] = "../../../".$conf['templateFile'];

Die richtigen Post-Variablen nutzen

Die init Methode der fe_admin wird sich $_POST['FE'] Daten holen, um mit diesen zu arbeiten. Dabei ist in zweiter Ebene des Arrays die Tabelle codiert, in der die Daten gespeichert werden. Der Schlüssel dritter Ebene repräsentiert nunmehr das DB Feld. Folgende Post-Variablen sollten beim Abschicken des Formulars mitgeschickt werden, ansonsten können sie auch in PHP mit eigenen Werten belegt werden.

// Name des Newsletterempfängers
$_POST['FE']['tt_address']['name'];

// Emailadresse
$_POST['FE']['tt_address']['email'];

// Sollen HTML Mails empfangen werden?
$_POST['FE']['tt_address']['module_sys_dmail_html'];

Objekt von user_feAdmin erzeugen und Konfiguration übergeben

$ua = new user_feAdmin();

$ua->cObj = t3lib_div::makeInstance('tslib_cObj');

$ua->init($content,$conf);

Die Variable $content kann laut Class Reference von feAdmin weggelassen werden (leerer String).

Mit dem Ausführen der init-Methode werden alle nötigen Prozesse angestoßen, welche zur Newsletteranmeldung benötigt werden.

Beispiel

Hier nochmal ein Codeblock mit allen benötigten Schritten: Beispiel

Kommentare?

Falls jemand eine einfachere Implementation kennt oder sonstige Hinweise zu meinem Vorschlag hat, der poste doch bitte einen Kommentar :)

Hinweise

Noch zwei letzte Hinweise, falls keine Bestätigungsmail verschickt wird:

Es kann u.A. daran liegen, dass das Template für Direct Mail Subscription nicht gefunden wird. Der Rückgabewert der init-Methode gibt meistens einen guten Aufschluss über den Status und eventuelle Fehler. Einfach mal in ner Variable ablegen und ausgeben (per echo, var_dump etc).

Per getcwd() kann man außerdem per PHP prüfen, in welchen Verzeichnis das aktuelle Script ausgeführt wird. Hilft beim Testen ob der Pfad zum Template File stimmt.

Related posts:

1. TYPO3 – Direct Mail Newsletter werden nicht verschickt
2. Mailformplus 4.0 – Die flexible Typo3 Mailformular Extension geht mit mir in die vierte Runde
3. Typo3 – Mailformular mit eigenem CSS (per Mailformplus)

Unter 180° werde ich zukünftig kleine Gedankenspielchen veröffentlichen, welche sowohl die geistige Vorstellungskraft und damit die Kreativität “trainieren” oder wenigstens eine langweilige Bahnfahrt überbrücken können.

Einfach mal (um-)denken.

P.S. wer sich damit intensiv befassen möchte, sollte sich die Werke von Mario Pricken ansehen:

No related posts.

Besonders im Firefox sorgt wmode=transparent des Öfteren für kleine oder große Bugs, welche sich hartnäckig halten und oftmals nicht gleich mit wmode transparent in Verbindung gebracht werden – das sorgt für viele (Achtung Ironie:) lustige Debugstunden, was sich beim Halten einer Deadline natürlich besonders gut macht.

Dieser Post soll über bekannte Bugs aufklären und neue Sammeln.

Erklärung des Parameters wmode

wmode kann beim Einfügen von Flash in (X)HTML genutzt werden, um den Hintergrund des Flashfilms (swf) transparent zu schalten und somit dem Browser die Möglichkeit zu geben, andere Elemente unter den Flashfilm zu rendern. Dies ist an sich eine feine Sache, denn eigentlich besitzt Flash, in eine Webseite eingebettet, exklusiven Zugriff auf den Pixelbereich (=> eigenes hWnd) und kann nicht mit HTML-Elementen auf der Seite interagieren. Somit sind keine gegenseitigen Überdeckungen und Transparenzen möglich. Zur Erklärung ein kurzer Ausschnitt aus der Flash-Hilfe, welche zum Standard-Wert window des wmode-Parameters folgendes schreibt:

window: Die Anwendung wird in einem eigenen rechteckigen Fenster auf einer Webseite abgespielt. Diese Option legt fest, dass die Flash-Anwendung keinerlei Interaktion mit den HTML-Ebenen durchführt und immer das oberste Element ist.

Da dieses Verhalten nicht immer gewünscht ist, gibt es weiterhin die Werte opaque und transparent. Sie ermöglichen, dass der Flashfilm als Element der HTML-Seite verstanden werden kann. Es greifen dadurch auch Positionierung, z-Index und so kann der Flashfilm nun auch von anderen (X)HTML-Elementen überdeckt werden.

Eine sehr gute Erläuterung fand ich dazu im Artikel Flash, DHTML Menus and Accessibility von Stephanie Sullivan.

Was ist das Problem mit wmode?

Leider sorgt das Rendern per wmode transparent oder opaque manchmal zu unerwünschten Nebeneffekten. Dieser Post soll alle Eigenheiten des Flashplayers sammeln, welche von wmode provoziert werden. Meistens treten sie (leider) im Firefox auf, was in der Geschichte des Flash-Plugins seinen Ursprung hat (Stichwort NPAPI vs. DirectX).

Sollte ein Bug einen Browser außer Firefox betreffen, so wird er in eckigen Klammern hinter dem Titel vermerkt.

Die Anmerkung “Kein Workaround bekannt” meinst, dass außer wmode auf window zu setzen kein praktikabler Lösungsvorschlag gemacht werden könnte. Mit wmode=window tauchen diese Bugs nicht auf.

• kein @ in Formularfeldern
  Nicht nur das @, sondern alle möglichen nicht-Standard Zeichen werden in den Feldern nicht mehr angezeigt. Dieser Post im 5 1/2 Blog zeigt das Problem – inklusive Diskussion zum Thema in den Kommentaren.
  Kein Workaround bekannt.
• kein blinkender Cursor in den Feldern
  Ebenfalls durch wmode transparent oder opaque hervorgerufen.
  Kein Workaround bekannt.
• hitarea von Schaltflächen bleibt bei gescrolltem Inhalt an der alten Stelle
  Kein Workaround bekannt.
• Performance-Probleme beim Abspielen von flv
  Gerade bei gekeyten Filmen (transparente flv’s) in Verbindung mit wmode=transparent kommt es zu herben Performanceeinbußen und die flv’s beginnen zu stocken oder werden nicht abgespielt, bis man mit der Maus über dem Flashfilm hin- und herfährt.
  Hier sollte man ernsthaft in Betracht ziehen, ob die Tranzparenz des swf unbedingt benötigt wird und diese ggf. abschalten (wmode auf window setzen).
  Der Einbruch der Leistungsfähigkeit ist auch Adobe bekannt und wird oftmals bei der Erklärung zu wmode als Hinweis genannt:
  Note: If windowless mode is used, performance can be affected to some degree. If fastest performance is a top priority, you may consider other design options.
  Kein Workaround bekannt.

Sollten euch andere Bugs auffallen, könnt ihr sie gern hier diskutieren.

Zu einer Liste mit bereits bei bugzilla gemeldeten Bugs betreffend des Flash Plugins gelangt man mit dem Suchbegriff flash in der Bugzilla Suchmaske.

Related posts:

1. sIFR Probleme beim Scrollen im Internet Explorer 6 und 7
2. Firefox – die 10 nützlichsten Addons / Plugins für Webentwickler
3. Droht der Firefox Download-Day zu floppen?

In den vergangenen 4 Tagen war mein Server und damit auch einige Projekte kaum zu erreichen. Nach hin und her mit meinem Dienstleister, der mir auch erfreulicherweise den Weg zur Fehlerlösung ebnete, habe ich mich also heute auf die Suche nach dem Fehler gemacht.

Er sollte wohl etwas mit mysql zu tun haben, erfuhr ich in einer mail. Auch im Virtuozzo lag der CPU-Verbrauch des mysql-Dienstes bei 40% (Tendenz steigend) – die Auslastung der CPU des vServers lag derweil bei ca. 2700%. Nach einem Stopp des mysql war alles ok – nur liefen halt die Projekte und mein Blog nicht ;P

Nach wiederholtem Neustart und überprüfen der Projekte habe ich mal in die mysql.log geschaut (hätte ich viel eher machen sollen) und stellte fest, dass wohl eine Tabelle kaputt ist. Unter “Prozesse” (erreichbar über Interface wie phpmyadmin oder ähnlichem oder eben Konsole) zeichnete sich ein klares Bild ab – eine Tabellenabfrage (keine besonders große mit joins oder sowas) wurde einfach nicht beendet und blieb ewig offen. Die CPU-Last stieg und stieg witer an..

Lange Rede kurzer Sinn: Ich habe die fehlerhaften Tabellen (bei mir waren es wp_comments und wp_postmeta) per REPAIR mal reparieren lassen. In der Auswertung wurden auch fehlerhafte Sektoren erkannt und gefixed. Nun läuft wieder alles einwandfrei und ich weiß nächstes Mal wo ich anfange zu suchen.

Related posts:

1. mod_rewrite aktivieren auf vServer von netclusive (für permalinks und RealURL)

Unter http://mediavrog.net/blog/2007/06/06/mootools/mootools-customformelements-checkboxen-und-radiobuttons-selbst-per-css-gestalten/ findet ihr die Infos und Links zur Demoseite.

Ich habe die Klassen komplett umstrukturiert und erweitert, aber schaut selbst.

Related posts:

1. mootools – custom Form Elements 1.8beta: Checkboxen und Radiobuttons selbst per CSS gestalten
2. mootools 1.2 cheat sheet
3. mootools 1.1 – cheat sheet

Im Rahmen der Lehrveranstaltung Medienpsychologie des Studiengangs
Medieninformatik der Hochschule für Technik und Wirtschaft Dresden (FH),
sollen auf Basis einer selbst anzufertigenden wissenschaftlichen Studie,
Methoden der Forschung im Bereich der Psychologie erfahren bzw. entwickelt werden.

Unser Thema lautet “Internetradio”.
(z.B. Last.fm, pandora, finetune oder Streaming Radio per Audioprogramm…)

Hilf uns

Ihr könnt uns dabei helfen, indem ihr an unserer Online-Umfrage teilnehmt.
Damit nicht nur wir etwas davon haben, verlosen wir fünf mal 10 Euro
Gutscheine der Firma Amazon (Bis zum 11.01.2008).

Zur Online-Umfrage:

http://mediavrog.net/onlineradio

Grüße und Vielen Dank für eure Unterstützung
Maik – Alexander – Ronny – Stefan

Related posts:

1. Erstes größeres Typo3 Projekt online: abc-op.de

Georg Sørtun hat einen sehr guten Weg gefunden, um das Problem des Herausfließens oder background-overflow von fieldsets mit einem legend zu beheben.

Er nutzt dabei eine vererbte line-heigt, negatives margin und Standard IE Hacks. Die Lösung ist recht kurz und hat mir persönlich sehr geholfen, eine alte Barriere zu beheben und nun auch legend-Tags cross-Browser im gleichen Erscheinungsbild einzusetzen. Vielen Dank Georg!

Related posts:

1. kj_imagelightbox 2 – Bugfix für Captions / Bildüberschriften bei mehreren Content Elementen

Viele Probleme beim Einbinden von Javascript Bibliotheken oder Frameworks (z.B. mootools, dojo,..) rühren aus einer starken Komprimierung, welche das Script zugleich “verschleiert” (obfuscate).

Das Script wird dann beim Aufruf in einigen Fällen (z.B. Dean Edwards Packer) mit einer eval() Funktion wieder aufbereitet (quasi entpackt) und für den Browser nutzbar gemacht. Diese starke Form der Komprimierung unter Zuhilfenahme von eval() zum Entpacken führt ab und zu zum Absturz des Browsers (sowohl IE 6 / IE 7 als auch Firefox und weitere) bzw. das Script läuft sich fest. Um das zu verhindern sollte man auf eine andere Kompressionsmethode zurückgreifen.

Meine Empfehlungen:

• eine etwas geringere Komprimierungsstufe (welche kein eval benutzt) wählen, z.B. jsMin
  • + kann on-the-fly komprimiert werden, da relativ schnell
  • + keine Browserabstürze da ohne eval
  • + Implementierung in diversen Programmiersprachen verfügbar
  • - keine Optimale Komprimierung, da nur Leerzeichen, Kommentare und Zeilenumbrüche entfernt werden
  • - das Javascript bleibt danach immer noch lesbar
• der neue YUI-Kompressor aus dem Hause Yahoo
  • + ein Mix aus überflüssigen Zeichen entfernen und Verschleierung (obfuscation) sorgt für sehr hohe Kompressionsraten
  • + die Scripte sind nicht mehr lesbar und somit besser geschützt
  • + keine Browserabstürze da ohne eval
  • + auf jedem System einsetzbar – basiert auf Java Technologie
  • - nicht on-the-fly nutzbar, weil es langsamer ist als z.B. jsmin oder dojo compressor

Letztere Variante ist mir sehr sympathisch und ich werde den Kompressor die Tage mal testen. Die Sourcen hab ich schon gezogen :) Ergebnisse gibts dann in einem neuen Artikel.

Related posts:

1. Javascript mit CDATA korrekt in XHTML einbinden
2. Javascript: Duplikate entfernen / remove duplicates
3. Javascript Framework mootools 1.1 released / draußen

Ganz ohne Javascript und das überall verbreitete onselectstart bzw. onselect lässt sich das Selektieren von Text per CSS (bzw. über das Setzen eines Attributes für den Internet Explorer und Opera) verhindern.

Dazu sei als Allererstes erwähnt, dass ich diese Möglichkeit NIE auf normalen Text einer Webseite anwenden würde, da so die Usability EXTREM eingeschränkt wird und der Besucher verwirrt die Seite verlässt. Außerdem kann sich der findige Besucher auch über den Quelltext der Seite entsprechende Textpassagen kopieren – als Kopierschutz sollte diese Methode also nicht erwägt werden!

Wozu das ganze also überhaupt?

Ich bin vor kurzem bei der Weiterentwicklung der custom Form Elements auf ein Problem gestossen, als ich ein Text-Label einer Schaltfläche (dynamisch generiert) vor versehentlichem Markieren schützen wollte. Schaltflächen lassen wie gewohnt ein Markieren ihres Label eh nicht zu und dieses Verhalten musste ich imitieren. Die Lösung habe ich nach einiger Recherche zusammengetragen und sie funktioniert bei mir für IE 6/7, Opera 9, Netscape, Firefox 2, Safari:

Mootools code (Eigenschaften per JS setzen):

if(window.ie || window.opera){this.lab.setProperty("unselectable","on");}
if(window.gecko){this.lab.setStyle("MozUserSelect","none");}
if(window.webkit){this.lab.setStyle("KhtmlUserSelect","none");}

CSS / Attribut

.myUnselectableText{
/* Gecko-based, Mozilla */
-moz-user-select:none;
/* Safari */
-khtml-user-select: none;
}

Für Opera und IE 6/7 wird die Eigenschaft unselectable gesetzt.

Anmerkung: ein XHTML Dokument validiert nicht mehr, wird diese Eigenschaft in den Quelltext geschrieben, also sollte man dieses Attribut lieber per JS setzen :)

<p class="myUnselectableText" unselectable="on"/>Absatz</p>

No related posts.

In dem Artikel Javascript and XHTML beschreibt Stephen Chapman moderne Möglichkeiten, inline-Javascript korrekt einzubinden. Hier eine kurze Zusammenfassung seines Artikels.

Er fängt beim modernsten und eben auch korrekten Weg an, Javascript in XHTML Dokumenten als CDATA einzubinden:

<script type="text/javascript">
<![CDATA[
  //content of your Javascript goes here
]]>
</script>

Dem Validator wird mitgeteilt, dass es sich im CDATA-Tag um Text (Character Data) handelt welcher nicht als XHTML anzusehen ist. Laut DTD wird ohne diese Angabe nämlich standardmäßig PCData angewandt, was für Parsed Character Data steht. Der Nachteil von PCDATA besteht nun darin, dass XHTML-Tags im Kontext validiert werden und man dadurch genötigt ist jedes Tag zu entwerten (z.B. per Umschreibung als &lt; für < oder per Escapen der Zeichen mit einem Backslash (\). Diese Entwertung entfällt bei der Angabe als CDATA und validiert einwandfrei.

Da nun aber einige ältere Browser dieses Tag nicht verstehen (und Javascript-Fehler werfen) wird es für sie einfach auskommentiert:

<script type="text/javascript">
/* <![CDATA[ */
  // content of your Javascript goes here
/* ]]> */
</script>

Das Dokument validiert wie gehabt, da die Kommentarzeichen für den Validator keine Bedeutung haben, und auch ältere Browser die XHTML nicht verstehen und alles als HTML parsen, interpretieren das Javascript korrekt.

Zur Veranschaulichung der besprochenen Thematik noch ein kleines Beispiel:

Wir wollen einem Element mit der id “myText” html-Code zuweisen.

<script type="text/javascript">
  $("myText").setHTML("<p>Hallo</p>");
</script>

Mit dem oben genannten Codebeispiel ohne die explizite Angabe des script-Inhalts als CDATA wird ein XHTML-Dokument nicht validieren (siehe Bild):

Nach dem Deklarieren als CDATA validiert das Dokument.

<script type="text/javascript">
/* <![CDATA[ */
  $("myText").setHTML("<p>Hallo</p>");
/* ]]> */
</script>

Zuletzt führt Stephen Chapman noch einen oft begangenen Fehler beim Einbinden von Javascript an:

<script type="text/javascript">
<!-- // hide from really old browsers that noone uses anymore
  // also hide from browsers that use the XHTML DTD
  // content of your Javascript goes here
// -->
</script>

Für moderne Browser und den Validator (und eben auch uralt-Browser) wird dadurch das Javascript komplett auskommentiert. Somit wird es wahrscheinlich bei einer neuen Generatoin Browser, welche sich strikt an XHTML Richtlinien hält, nicht mehr ausgeführt und sollte daher vermieden werden.

Related posts:

1. mootools – “SmartTabs” : Tab-Klasse / Tabbing für semantisch korrekt ausgezeichnetes XHTML
2. Browser hängt sich beim Einbinden von Javascript auf oder stürzt ab
3. Markieren von Text abschalten ohne Javascript per CSS

Es geht mal wieder um den Internet Explorer seine immensen Qualen, welche er uns auferlegt.
Durch mangelhafte Konformität bei der Implementierung von CSS hat er bestimmt jedem von uns schon einmal ans Bein gepinkelt.

Doch damit ist nun Schluss:

Mit der IE-Voodoo Puppe – handgefertigt! kann sich der nähbegabte Webentwickler rächen:

Als Anleitung sei ihm dieses Tutorial von chisa ans Herz gelegt, welches in unbekümmerter Nüchternheit die Erstellung einer solchen Puppe näherbringt. Ich habe meine schon gebastelt und mich auch schon an ihr ausgelassen >:)

Meine verwendeten Materialien:

• Bastelfilz (natürlich in blau; für 43×100cm ca. 3,50€)
• 1 scharfe Schere (8 €)
• blaue und weiße Baumwollfäden (je 1,80€)
• Hochbausch Füllwatte (50g für 0,9 € – reicht bestimmt für 100 IE Voodoo Dolls)
• 1 Nadelset (war halt mein erstes Nähprojekt :) )

Das Resultat

(leider nur ein Handybild, aber man erkennt schön dieses jämmerliche Winseln)

JEDER WEBENTWICKLER SOLLTE EINE HABEN!

Related posts:

1. sIFR Probleme beim Scrollen im Internet Explorer 6 und 7
2. Internet Explorer parsing #1 : Listen und nicht-listen-Elemente
3. IE Bug: Accept-charset UTF-8 in Formularen, welche in ISO Seiten eingebettet sind

Eine interessante Möglichkeit, Bilder mit neuartigen Algorithmen zu skalieren und dabei die Semantik des Bildes beizubehalten.

Soweit ich es verstanden habe werden zusammenhängende, energiearme Bereiche des Bildes stark skaliert bzw. weggerechnet womit wichtige Bereiche mit viel Bildinformationen trotz Verringerung der Bildgröße beibehalten werden können.

Nachzulesen (inkl. Video) auf radar.oreilly.com

No related posts.

Ich habe nach einer Möglichkeit gesucht, Bilder verschiedener uids (content elemente) zu einem Imageset hinzuzufügen. Die Bilder dieses Imagesets sollte dann rel=lightbox[seitenid] besitzen. Dieses Feature sollte einfach einstellbar sein. Hier mein Vorschlag (ist auch im Mantis des Projekts gemeldet).

Nach folgenden Änderungen ist es möglich, neben Aktiviere Bilderset auch Aktiviere Seitenbilderset auszuwählen.

ext_tables.sql

(add)tx_kjimagelightbox2_imagesetpage tinyint(3) DEFAULT '0' NOT NULL

ext_tables.php

(add)
'tx_kjimagelightbox2_imagesetpage' => Array (
'exclude' => 1,
'label' => 'LLL:EXT:kj_imagelightbox2/locallang_db.php:tt_content.tx_kjimagelightbox2_imagesetpage',
'config' => Array (
'type' => 'check',
)
),

(update)$GLOBALS['TCA']['tt_content']['palettes']['7']['showitem'] = 'image_link, image_zoom, tx_kjimagelightbox2_imagelightbox2, tx_kjimagelightbox2_imageset,tx_kjimagelightbox2_imagesetpage, tx_kjimagelightbox2_presentationmode';

locallang_db.xml

[...]
<label index="tt_content.tx_kjimagelightbox2_imageset">Activate ImageSet</label>
(add)<label index="tt_content.tx_kjimagelightbox2_imagesetpage">add to Page ImageSet</label>
<label index="tt_content.tx_kjimagelightbox2_presentationmode">Presentation mode</label>
[...]
<label index="tt_content.tx_kjimagelightbox2_imageset">Aktiviere BilderSets</label>
(add)<label index="tt_content.tx_kjimagelightbox2_imagesetpage">zu Seiten-Bilderset hinzufügen</label>
<label index="tt_content.tx_kjimagelightbox2_presentationmode">Praesentations Modus</label>
[..]

class.ux_tslib_content.php

(change)$imgSetNumber = (intval($conf['imageLightbox2.']['imageset'])>0)?intval($conf['imageLightbox2.']['imageset']):$this->data['tx_kjimagelightbox2_imagesetpage']?$this->data['pid']:$this->data['uid'];

Related posts:

1. kj_imagelightbox 2 – Bugfix für Captions / Bildüberschriften bei mehreren Content Elementen
2. kj_imagelightbox 2 für mootools slimbox

In der KJ: Image Lightbox v2 (Version 1.4.2) gibt es einen Bug der dafür sorgt, dass beim Verwenden der Lightbox in mehreren Content-Elementen einer Seite die Bildunterschriften / Captions ab dem zweiten Content Element nicht mehr angezeigt werden.

Ich habe den Bugfix dafür bereits im Mantis des Projekts gemeldet, bis er umgesetzt ist hier meine Änderungen:

Sie betreffen durchgehend die Datei class.ux_tslib_content.php

//Zeile 35:(insert)
// global var for counting items on page
var $itemCount = 0;

//Zeile 65:(insert)
// check if last uid matches current uid;
//if test fails -> set singleCaption to 0 (for this->data[imageCaption] Array)
if($this->uid != $this->data['uid'] && $this->uid){$this->singleCaption = 0;}

// set this->id to current uid
$this->uid = $this->data['uid'];

//Zeile 187:(update)
id="'.$this->singleCaption.'
//ersetzen durch
id="imageLightbox'.$this->itemCount.'

//Zeile 190: (add)
$this->itemCount++;
//(Danke an T0m für den Hinweis :) )

Viel Spaß damit

UPDATE 31.08.07:

Habe eine E-Mail von einem Entwickler der Extension bekommen, dass der Bugfix integriert ist. Er wird dann bestimmt mit dem nächsten Update der Extension im TER kommen.

Datei inklusive Bugfix (aber ohne Garantie)

class.ux_tslib_content.php inklusive Bugfix

(nach dem Download einfach umbenennen in class.ux_tslib_content.php und in das Verzeichnis der Extension legen)

Auszug aus einem Kommentar bezüglich Mootools und KJ: Image Lightbox v2:

Ich habe schonmal die kj_imagelightbox2 so umgeschrieben, dass anstatt der Lightbox/Prototype-Combo die Mootools/Slimbox verwendet wird. Außerdem habe ich den Parameter ’Deactivate inclusion of JSFramework’ hinzugefügt, was die Einbindung des JS-Frameworks verhindert. Somit kann z.B. per t3mootools das Mootools Framework eingebunden werden und von der kj imagelightbox nur das Slimbox Script.

Wenn Interesse besteht, kann ich die Datei zuschicken. In meinem Artikel dazu gibts die Extension als t3x.

Related posts:

1. kj_imagelightbox 2 für mootools slimbox
2. kj_imagelightbox 2 – Seiten Bilderset
3. Probleme mit sIFR 3 und SWFObject auf einer Seite im IE 6 und 7

In einem sehr guten Artikel beschreibt Yuri Filimonov Wege, um “duplicate content” vorzubeugen.

Dabei geht er auf verschiedene Aspekte und Möglichkeiten ein, die robots und auch die Besucher auf der Webseite zu lenken. Dies kann z.B. durch mod_rewrite geschehen und im Falle der Suchmaschinen auch über eine robots.txt.

Einfach mal reinlesen!

Ich werd mich auch für meinen Blog mal eingehender damit beschäftigen, habe aber bereits das SEO_Wordpress Plugin und das All in One SEO Pack installiert, welche bereits gute Arbeit leisten.

Related posts:

1. WordPress Plugin Competition – Teilnehmen aber wie!?

Seit Montag war mein Server von der Außenwelt abgeschnitten und er ist leider erst jetzt nach 3 Tagen wieder ans Netz gegangen. Was war los?

Ich möchte hier einen kleinen Erfahrungsbericht über den Support meines Hosters und sonstige Probleme zum Besten geben.

23. Juli 2007 – 12 Uhr

Ab 12 Uhr mittags bemerke ich, dass mein Server von außer nicht zu erreichen ist (Zeitüberschreitung). Ich denk mir nix bei und schicke erstmal ne Supportanfrage, ob irgendwas im Rechenzentrum nicht stimmt – keine Reaktion. Nunja – wird ja alles halb so schlimm sein :)

23. Juli 2007 – 16 Uhr

Langsam mache ich mir Sorgen, wie lange das nun noch weitergehen soll. Ein kleiner Fehler im RZ ist ja nun schon fast auszuschließen, also bemühe ich doch einmal den Telefonsupport, da auf meine E-Mail am Mittag noch keine Antwort kam. Eine freundliche Stimme erinnert mich daran, dass dieses Telefonat 14 cent die Minute und einmalig 1,99 € Supportgebühren kosten soll – ja, das ist es mir wert!

— Fortsetzung folgt nach dem Essen —

Related posts:

1. mysql lastet vServer aus
2. WordPress Plugin Competition – Teilnehmen aber wie!?
3. Erstes größeres Typo3 Projekt online: abc-op.de

Da ich diese Infos in Zukunft sicher auch wieder brauchen werde, hier eine kleine Anleitung.

Zum System:

PHP 5.1.2
Apache2
vServer mit shell-Zugang (als root)
Ich habe einen vServer v2 mit Suse 10

Anleitung zum Aktivieren von mod_rewrite:

1. Wechseln in das Verzeichnis “etc/sysconfig”
   “cd etc/sysconfig”
   Hier liegen die Konfigurationsdateien, welche bei Neustarts zum Initialisieren der Dienste verwendet werden.
2. Bearbeiten der Datei “apache2″
   “vim apache2″
   
   • In den Einfügemodus wechseln
     Taste “i” (für Insert) drücken
   • Zeile suchen und Module rewrite hinzufügen
     APACHE_MODULES=”actions alias [...]” suchen (bei mir wars Zeile 84) und in die Liste “rewrite” einfügen
     (eine Liste mit allen Modulnamen steht im Kommentar darüber)
   • Speichern und schließen
     Befehl “:wq!” (w – Speichern; q! – Schließen ohne nachfragen)
3. Apache neu starten
   “rcapache2 restart“
4. phpinfo() aufrufen und prüfen ob das Modul geladen ist
5. Spaß mit WordPress permalinks und Typo3 RealURL haben :)

Edit: Auf den meisten anderen Servern muss man glaube ich die Datei etc/apache2/httpd.conf editieren und das Modul hinzufügen.

Related posts:

1. mysql lastet vServer aus

Viele Fragen sich, wie man Leerzeichen ins Wrapping bei Typoscript bekommt.

In folgendem Auszug einer Mailformplus-Konfiguration, wird beim wrappen kein Leerzeichen nach Seite erzeugt.

email_subject = TEXT

email_subject{

 data = leveltitle:-1

 wrap = Kontakt über Seite |

}

Das Problem lässt sich an sich leicht lösen, wenn man noTrimWrap kennt. Es entfernt keine Whitespaces und der Leerzeichen Existenz bleibt gesichert.
Folgendes Beispiel sorgt für das gewünschte Ergebnis (man beachte die Pipes (|) am Anfang und am Ende):

email_subject = TEXT

email_subject{

 data = leveltitle:-1

 noTrimWrap = |Kontakt über Seite ||

}

Related posts:

1. Typo3 – Mailformular mit eigenem CSS (per Mailformplus)
2. Typo3 tt_news – Mehrere Templates für SINGLE, LIST oder LATEST je nach Seite
3. dynamischer Seitentitel in Typo3 wie Klickpfad/Breadcrumb

Und wieder der gleiche Spam in anderer Verpackung. Diesmal etwas an SEO-Dienstleistern aufgehangen, welche des Öfteren zu Rate gezogen werden und denen man ja mal schnell den schwarzen Peter zuschieben kann, da viele nicht verstehen was genau gemacht wird.

Es ändert sich dabei nichts an der Tatsache, dass auch diese Mail Spam ist, da sie wieder über einen kostenfreien gmail-Account (DONOTREPLY@gmail.com) geschickt wurde.

Weiteres (u.A. ein Statement von Google) unter meinem ersten Beitrag zu diesem Thema.

Related posts:

1. Spam: Entfernung Ihrer Webseite aus dem Google Index von DONOTREPLY@gmail.com
2. Spam “Herr Olaf Tank”: Letzte Mahnung, Aktenzeichen: 318345/27 : Thieler@Rechtsanwalt-Thieler.de
3. Google Chrome Comic

In vielen frischen Typo3-Installationen findet sich unter Benutzer > Aufgaben nur ein “Voreinstellungen für Export”-Button, welcher keine Funktion hat.

Um in den Genuss von eines internen Messaging- oder Workflow-Systems zu kommen muss man einfach die entsprechenden Extension installieren.

Eine kurze Übersicht:

(mit einem * versehene Ext habe ich nicht zum Laufen gebracht)

• UserTask Center, Quick note (sys_notepad)
  Fügt dem Taskcenter des Nutzers ein kleines Feld zum Editieren hinzu, wo er wie auf einem Zettel ein paar Notizen verfassen und ablegen kann
   
• UserTask Center, Messaging (sys_messages)
  Erlaubt es den Typo3-Nutzern Nachrichten untereinander schnell auszutauschen. Enthält einen Posteingang/-ausgang, Archiv und startet bei Antworten auf eine Nachricht automatisch einen Thread
   
• UserTask Center, Recent (sys_recent)
  Listet die zuletzt angelegten/bearbeiteten Seiten inklusive Datum auf. Hat ein Nutzer keine Rechte die Seiten zu bearbeiten, so werden sie ihm auch nicht angezeigt.
   
• * UserTask Center, Workflow and Tasks (sys_workflows)
  Diese Extension sollte ein Workflow System und basierend auf sys_todos auch eine Aufgabenverwaltung (ToDo’s) ermöglichen. Leider scheinen diese beiden Extensions in der aktuellen Typo3 Version (4.1.1) nicht zu funktionieren. Nach der Installation erscheint ein Punkt “Aufgaben”, hinter dem sich aber nichts verbirgt. Schade!
  Eventuell kann eine Konfiguration Bestandteil der Installation sein – habe hiervon aber keine Kenntnis.
   
• UserTask Center, Backend News ( vd_backendnews )
  Über diese Extension kann man News im Taskcenter verfassen und in Kategorien ordnen. Sehr feine Extension!.
  Nicht wundern wenn diese Extension nach der Installation nicht funktioniert, sie muss noch konfiguriert werden:
  • Sysfolder anlegen
  • Benutzergruppe mit Taskcenter News-Rechten ausstatten
    • Taskcenter news categories
    • Taskcenter news posts, sowie unter Allowed exlude fields:
    • Taskcenter news categories: Category name
    • Taskcenter news posts: News title
    • Taskcenter news posts: Publication time
    • Taskcenter news posts: Text
    • Taskcenter news posts: Category
  • TSConfig für Nutzergruppe:
    • VD_BACKENDNEWS.edit = 1
    • VD_BACKENDNEWS.pid = pid des Sys-Ordners

   

• * UserTask Center, Plugin list ( taskcenter_modules )
  Sollte alle Seiten auflisten, die mit einem Plugin versehen sind. Leider erscheint kein neuer Punkt im Taskcenter nach der Installation.

Related posts:

1. Typo3 tt_news – Mehrere Templates für SINGLE, LIST oder LATEST je nach Seite
2. Extension Backend Konfiguration in Typo3 4.2.8 von Typ file
3. Typo3 – Mailformular mit eigenem CSS (per Mailformplus)

Seit nunmehr über 1 1/2 Monaten gibt es ihn: den Wordpress Competition Blog.

An sich eine feine Sache – wer will kann neuartige Plugins vorstellen und sogar einen Preis gewinnen.

Auch ich wollte gern daran teilnehmen, nur leider habe ich im Blog nach der Anmeldung nicht die
erforderlichen Rechte um einen Post zu verfassen. Nach 3-maligem Anschreiben über das Kontaktformular
werd ich jetzt noch einmal auf E-Mailadressesuche gehen und hoffentlich bald die Freigabe zum Schreiben haben.

Die WP Plugin Competition läuft übrigens noch bis Ende Juli – aber man sollte sich schon jetzt um nen Zugang kümmern ;)

WP Plugin Competition Blog ansehen

Edit 10. Juli 18.40
Habe gestern direkt noch ne Mail geschrieben aber der Zustand bleibt unverändert. Immer noch keine Antwort und auch die Rechte nen Beitrag zu schreiben sind nicht vergeben.

Edit 11. Juli 23.35
Zwei neue Ankündigungen von Plugins bzw. Teilnehmern und ich habe immer noch keine Rechte nen Post zu schreiben. Werds wohl mal über ICQ versuchen. ARGH!

Edit 14. Juli 16:09
Es gibt für mich anscheinend keinen Weg in die Competition! Nachdem ich über AIM niemanden erreicht habe (niemand online) und auch auf meinen Kommentar im offensichtlich Mark vom WPCB gehörenden Blog unter dem Artikel WordPress Plugin Competition Updates keine Antwort bekommen habe, bin ich kurz davor zusammenzubrechen und meine Teilnahmechancen für aussichtslos zu erklären. I’m really pissed of!

Related posts:

1. Wordpress 2.5 > tinyMCE 3.0.6 > Template Plugin zum Laufen bekommen
2. Wordpress Statistik Plugin “semmelstatz” im Einsatz
3. Wordpress 2.5 – Bilder größer als 500 Pixel Breite in Beiträge einfügen

Ein optischer Leckerbissen, der wachrüttelt. PANOPTI.COM – Die schöne neue Welt der Überwachung ist ein wunderbar gestalteter interaktiver Flash-Film, welcher auf die Methoden zur Überwachung der Bürger eingeht.

Dabei begleitet man “Paul” einen ganz normalen Tag lang und erfährt in 5 Abschnitten (Aufstehen, Weg zur Arbeit, Arbeit, Einkaufen, Abends) wo überall Daten gehascht werden. Dabei gibt neben einem sehr guten Sprecher auch kleine Spielereien zu entdecken. Reinschauen lohnt sich wirklich.

http://www.stereostil.de/jo/panopticom/swf/index.htm

Screenshot der Seite:

No related posts.