(to the english part of the post)
Dir wird in diesem Artikel der neue jQuery Interfaces Fisheye position: fixed; Patch zum herunterladen angeboten. Mit diesem Bugfix funktioniert das Fisheye auch nach dem Scrollen bei fixer Positionierung. Die Vorgehensweise ist denkbar einfach. Es muss nur der Bugfix nach der jQuery interfaces Datei eingebunden werden. Ein Beispiel folgt.

<script type="text/javascript" src="jquery.js"></script> <!--- jQuery Framework einbinden --->
<script type="text/javascript" src="interface.js"></script> <!--- jQuery interfaces Plugin einbinden --->
<script type="text/javascript" src="fisheye_patched.js"></script> <!--- hier den Bugfix einbinden --->

Fisheye position: fixed; Bugfix herunterladen

Zip Datei enthält Javascript Datei.

Weitere Verweise zum Thema:

• jQuery Interface Fisheye Fix Demo
• jQuery Interface herunterladen
• jQuery Interface Fisheye Anleitung

In this post you will be offered to download the jQuery Interfaces Fisheye position: fixed; patch. With this patch the Fisheye works after scrolling while it’s fixed positioned. The procedure is simple. You only need to include the bugfix after including the jQuery inferfaces file. An example follows.

<script type="text/javascript" src="jquery.js"></script> <!--- include jQuery Framework --->
<script type="text/javascript" src="interface.js"></script> <!--- include jQuery interfaces plugin --->
<script type="text/javascript" src="fisheye_patched.js"></script> <!---include the bugfix --->

Fisheye position: fixed; bugfix download

Zip file includes javascript file.

More links to this subject:

• jQuery Interface Fisheye fix demo
• jQuery Interface download
• jQuery Interface Fisheye tutorial

Als ich heute versuchte mein WordPress Plugin Tags 2 Meta Keywords via Subversion auf http://svn.wp-plugins.org/ hochzuladen bekam ich folgende Fehlermeldung um die Ohren geworfen: “403 Forbidden (http://svn.wp-plugins.org)”. Da ich mit der Fehlersuche sehr viel Zeit verschwendet habe möchte ich anderen Plugin Entwicklern die Lösung nicht vorenthalten. Subversion schlägt den Login-Name von wordpress.org kleingeschrieben vor. Der Login-Name ist jedoch “case sensitive”. Also achtet auf Groß- und Kleinschreibung beim Login mit Subversion auf http://svn.wp-plugins.org.

(To the english part of the post)
Ich hatte vor meine Schlagworte direkt in Meta Keywords umzuwandeln. Zunächst fand ich ein Plugin für WordPress. Leider konnte dies meinen Ansprüchen nicht gerecht werden. Die Wahl der Keywords auf der Hauptseite, der Kategorien / Schlagwort Ansicht und den Archiven entsprach nicht meinen Vorstellungen. Die Meta Description wurde von diesem Plugin ebenfalls manipuliert. Das gefiel mir garnicht. Also entwickelte ich ein eigenes Plugin.

Beschreibung:
Generiert die Meta Keywords automatisch aus deinen Artikel Schlagworten.

• Ein einzelner Artikel oder eine Seite hat bis zu 10 Schlagworte als Meta Keywords.
• In der Kategorie und Archiv Ansicht sowie der Hauptseite werden bis zu 10 der meistengenutzten Schlagworte in der Kategorie, dem Archiv oder Hauptseite von der aktuellen Seite als Meta Keywords eingesetzt.

Dieses Plugin benötigt keinerlei Konfiguration. Es funktioniert einfach.

Voraussetzungen:

• WordPress 2.3 oder höher

Installation:

1. Kopiere den Tags 2 Meta Keywords Plugin Ordner in das WordPress Plugin Verzeichnis (/wp-content/plugins/) oder benutze die WordPress Plugin Verwaltung zur Installation.
2. Aktiviere das Plugin im WordPress Backend.
3. Das wars. Es funktioniert!

Tags 2 Meta Keywords herunterladen

Bei Kritik oder Ideen zur Verbesserung des Plugins hinterlasst mir ein Kommentar.

Änderungen

• 1.1:
  • Es werden nun die 10 meist genutzten Keywords der aktuellen Seite der Hauptseite verwendet.

I wanted to generate the meta keywords directly from my tags. At first I found a plugin for WordPress. Unfortunalety it can’t deserved my claims. The selection of keywords on the mainpage, the categorie / tag view and the archive doesn’t accord my agenda. The meta description was also manipulated by this plugin. I didn’t like that. So I developed a own plugin.

Description:
Generates meta keywords automatically from your post tags.

• A single post or page get up to 10 tags as meta keywords.
• In categorie, archive view and main site you get the 10 most used tags in categorie, archive or the main site from the current page as meta keywords.
  .

This plugin doesn’t need any configuration. It just works.

Requirements:

• WordPress 2.3 or higher

Installation:

1. Copy the Tags 2 Meta Keywords plugin folder into the WordPress plugin directory (/wp-content/plugins/) or use the plugin manager to install it.
2. Activate the plugin in the WordPress backend.
3. That’s it. It works!

Tags 2 Meta Keywords download

For critique or ideas to make the plugin better leave me a comment.

Changelog

• 1.1:
  • You get the 10 most used tags on the current page of main site as keywords.

Im Blog sind nun 2 neue Plugins im Einsatz. Sicher hast du schon gemerkt das die älteren Beiträge mit Quellcodeinhalten nun auch mit Syntax Highlighting verfügbar sind. Dazu nutze ich das Visual Code Editor Plugin von Jules Gravinese und das WP-Syntax Plugin von Ryan McGeary.

Während der Arbeit für Werbeagenturen ist mir aufgefallen, dass die meisten Designs als CSS Layout mit 100% Höhe am schönsten zur Geltung kommen. Eine prozentuale Breite für ein Web-Layout, das ursprünglich eine feste Breite hatte, lässt sich selten umsetzen. Eine prozentuale Höhe jedoch schon. Von prozentualen Maßen wollen Werbeagenturen in der Regel auch nichts wissen. Denn im Print Bereich, in welchem die Wurzeln der Agenturen liegen gibt es so etwas nicht. Was dabei nicht beachtet wird ist das der Designer bei einem Printmedium weiß wie groß die zu bedruckende Fläche ist. Im Web ist das anders. Die Größe und Auflösung des Bildschirm der Betrachter stehen nicht fest.

Das folgende HTML Grundgerüst wird hierfür benötigt:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        <title>Horizontal zentriertes 100% Höhe CSS Layout</title>
</head>
<body>
	<div id="wrapper">
		Inhalt
		<div id="footer">
			Fußzeile
		</div>
	</div>
</body>
</html>

Dieser CSS Quellcode muss noch in den Style Tag des Dokuments eingefügt oder aus einer seperaten CSS Datei eingebunden werden:

/* Mit dem Universalselektor standardmäßige Innen- und Außenabstände entfernen */
* {
	margin: 0;
	padding: 0;
}
 
/* Scrollbar einblenden, damit die Seite bei langem Inhalt nicht springt */
html {
	overflow: -moz-scrollbars-vertical; /* Firefox */
	overflow-y: scroll;
}
 
/* Ohne diese Angaben kann der Wrapper keine 100% Höhe haben */
html, body {
	height: 100%;
}
 
/* Keine Rahmen um Bilder anzeigen */
img {
	border: 0;
}
 
/* Gestrichelte Rahmen beim Klicken von Links entfernen */
:focus {
	outline: none;
}
 
div#wrapper {
	position: relative; /* Wird für den Footer benötigt */
	margin: 0 auto; /* Horizontales zentrieren des Wrappers */
	width: 995px; /* Ohne Breitenangabe kann der Wrapper nicht zentriert werden */
	background: #f0f0f0; 
	height: auto !important;
	height: 100%; /* Verhält sich wie min-height im IE6 */
	min-height: 100%;
}
 
div#footer {
	position: absolute;
	width: 100%;
	bottom: 0; /* Footer am Ende des Browsers festsetzen */
	background: #dddddd;
	border-top: 6px double gray;
}

Das padding-bottom des Inhalt DIV’s, das nicht im Quellcode vorhanden ist, muss mindestens so groß sein wie die Höhe Footers. Beachtet man dies nicht verschwindet ein Teil des Inhalts hinter dem Footer. Zusätzlich sollten noch Schriftart und Schriftgrößen im CSS definiert werden. Da hierbei sonst Abweichungen in den verschiedenen Browsern entstehen. Eine Demo findest du hier.

Mit dieser Layout Vorlage sollte es dir ein leichtes sein eine Webseite mit zentriertem Inhalt und 100% Höhe zu erstellen. Ich hoffe das ist ein schönes nachträgliches Weihnachtsgeschenk für dich. Frohe Weihnachten noch.

Ich stand vor kurzem vor dem Problem in Javascript zu prüfen ob ein DIV Element in einem HTML Dokument existiert. Mir stand aus vorangehender Entwicklung das jQuery Framework zur Verfügung. Dabei produzierte ich folgenden Code:

if ($('div#divname')) {
// Code ausführen, wenn DIV Element vorhanden. Funktioniert leider nicht
}

Das klappte leider nicht, da der Einsatz der jQuery Selektor Funktion immer ein Objekt zurückliefert. Mir war klar das es sich hierbei um ein leeres Objekt handelt und ich nur auf die Länge prüfen müsste. Sollte die Länge 0 sein ist der DIV im aktuellen Dokument nicht vorhanden. Hier nun der Code mit dem es entgültig klappte:

if ($('div#divname').length > 0) {
// Code ausführen, wenn DIV Element vorhanden. Funktioniert!
}

Ich verwende > anstatt ==, da diese Methode auch bei CSS Klassen funktioniert und keine Nachteile in der Performance bietet. Klassen können mehrfach im Dokument vorkommen. Deswegen kann die Länge größer als 1 sein.

Mehr zum Thema jQuery Selektoren

Endlich habe ich Zeit gefunden den ersten Eintrag meines Blogs zu verfassen. Natürlich trägt er den Titel “Hallo Welt” wie jeder erste Beitrag eines WordPress Blogs. Wer ich bin und worüber ich in diesem Blog schreibe findest du auf der Author Seite meines Blogs.

Das Theme des Blogs mag einigen Bloggern unter euch sicher bekannt vorkommen. Hierbei habe ich mich von der Simpla Theme inspirieren lassen. Beim CSS Layout handelt es sich um ein Layout mit 100% Breite sowie 100% Höhe, wenn der Inhalt das Browserfenster nicht sprengt. WordPress alleine reicht für die Funktionalität die ich von meinem Blog erwarte leider nicht aus. Deswegen habe ich folgende Plugins im Einsatz:

• Fast and Secure Contact Form von Mike Challis
• SI CAPTCHA Anti-Spam ebenfalls von Mike Challis
• Get Recent Comments von Krischan Jodies
• Google XML Sitemaps von Arne Brachhold
• Pretty Comments von Andrea Belvedere
• Sociable von Blogplay
• Subscribe To “Double-Opt-In” Comments von Tobias Koelligan
• W3 Total Cache von Frederick Townes
• WP to Twitter von Joseph Dolson

und Tags 2 Meta Keywords von mir. Die Namen der Plugins lassen auf ihren Zweck schließen. Falls nicht, besucht die verlinkte Plugin Seite. Ich möchte mich bei den Programmierern der Plugins bedanken. Ebenfalls möchte ich Phu Ly danken dessen, oben bereits genannte Theme, meine Inspiration darstellte. Zuletzt bedanke ich mich natürlich noch bei den Entwicklern von WordPress. Ohne diese hätte ich keinen WordPress Blog.

Als PHP Programmierer bin ich dem Chaos gegenüber nicht feindlich eingestellt. Sonst würde ich kein PHP oder WordPress nutzen. Auch die Gliederung des Inhalts im Blog wird dir etwas chaotisch vorkommen. Ja richtig, es gibt keine Kategorien. Sämtliche Inhalte sind über Tags verknüpft. Sind dir diese keine Hilfe empfehle ich dir die Blog Suche.

Woher der Blog seinen Namen hat findest du ebenfalls auf der Author Seite. Private Nachrichten kannst du mir hier schreiben. Das wars fürs Erste von mir. Ich hoffe ich finde Zeit meinen Blog ein- oder zweimal wöchentlich mit Beiträgen zu füttern.