• SydneyAustralien

Der lange Weg zur eigenen Webseite: WordPress

WebDesign3Irgendwann kommt man zu der Einsicht, dass eine reine Fotogalerie nur mit Bildern nicht ausreicht. Bei mir war dieser Zeitpunkt Ende 2008 erreicht.

Ich war einfach nicht mehr mit den statischen Web Seiten, die ich bis dahin erstellt hatte, zufrieden. Es sollte die Möglichkeit geschaffen werden, Beiträge zu schreiben, diese zu verwalten, zu modifizieren und zu löschen. Kommentierungsfunktionen und Rückmeldungen sollten auch mit eingebaut werden genau so wie verschiedene Benutzer mit unterschiedlichen Rollen (Administrator, Autor usw). Kleine Gimmicks wie „Das Wetter“ und eine Diashow in der Seitenleiste werten eine Webseite auf ohne zu sehr abzulenken und standen auch mit auf der Wunschliste. All das kann man selbst in HTML programmieren – mit beträchtlichem Aufwand und schwer zu pflegen und auf Stand zu halten. Ein kommerzielles Webdesign Progamm wie Adobe-Dreamweaver kann man benutzen. Die Kosten sind allerdings nicht unerheblich. Sollen mehrere Autoren am gleichen Projekt arbeiten ist dies nur sinnvoll machbar beim Einsatz von Adobe-Contribute. Das war dann eher nicht was ich wollte. Im Jahre 2007 hatte ich mich schon einmal mit Joomla beschäftigt. Es ist ein freies Content Management System (CMS) also ein kostenloser Webdesign Baukasten wie einige andere auch, z.Bsp. Typo3, Drupal oder WordPress. Ich habe mich dann letztendlich für WordPress entschieden. Es ist ursprünglich ein dynamisches WebLog (= Blog) oder elektronisches Tagebuch gewesen. Das ist auch heute noch der Schwerpunkt dieser Anwendung. Durch eine Reihe von kleinen, sehr einfach zu installierenden Bausteinen, Plugins genannt, kann man WordPress aber in Richtung eines fast vollwertigen CMS Systems wie etwa Joomla erweitern. Mir erschien dabei die Handhabung von WordPress leichter als das was ich bei Joomla oder Typo3 gesehen habe. Also habe ich mich für WordPress entschieden.

Als nächstes benötigt man eine Testumgebung. Dynamische CMS verwenden meistens die Software Sprache PHP zur Programmierung und speichern Einträge, Optionen und Attribute in einer Datenbank, in der Regel MySQL. Als Testumgebung reicht der normale Browser, der nur HTML versteht, nicht mehr aus. Man muß sich seinen eigenen Webserver auf seinem lokalen Rechner aufbauen. Das geht ganz einfach mit xampp von Apache Friends. Diese Software ist kostenlos und erzeugt bei der Installation keinerlei Registry Einträge im lokalen PC. Man kann alles auf einem USB Stick installieren und seinen Server sowie die dann dort aufgesetzte Webseite auf jedem Rechner starten und laufen lassen.

Nachdem der lokale Webserver als Testsystem installiert ist wird die WordPress Software eingepielt. Einfach herunterladen von der deutschen WordPress Internetseite und den Installationsanweisungen folgen. Ruft man dann die Webseite durch Eingabe von z.Bsp.: http://localhost/wordpress in der Adressleiste des Browsers auf, kommt man zur Willkommenseite von WordPress, die man am Anfang dieses Beitrages sehen kann.

Wenn alles soweit läuft, kann man einige Artikel in WordPress einstellen und mit Lorem ipsum Blindtext auffüllen. Dann geht es an die Individualisierung der Webpräsenz durch Auswahl eines sg. Themes. Viele kostenlose Themes gibt es auf der WordPress Seite im Verzeichnis Themes. Ich habe mich damals für das (heute nicht mehr erhältliche) Tarski Theme entschieden. Ganz flexibel kann man Themes mit dem Generator von Artisteer erzeugen. Zwei Beispiele sind hier zu sehen. Zweispaltiges Artisteer Theme. Tryout Version. Einmal links Dreispaltiges Artisteer Theme. Tryout Version. steht ein zweispaltiges Layout, das mit der Trialversion der Artisteer Software durch ein paar wenige Klicks erstellt wurde. Das rechte Theme besitzt z.Bsp. drei Spalten und vermittelt einen ganz anderen Eindruck. Das Umschalten von einem Theme in ein anderes erfordert in WordPress übrigens nur ein paar Mausklicks im sg. Backend, der Verwaltungsseite. Man kann und soll viel probieren um zu erfahren, was so alles machbar ist. Der Artisteer Theme Generator läßt auf äußerst flexible Art alle möglichen Themes mit wenigen Mausklicks erzeugen. Die Software kostet in der Home&Education Version 49,95$ und ist diesen Preis nach meiner Einschätzung Wert.

Eine WordPress Installation lebt von seiner Vielzahl an Plugins. Dieses sind kleine Helferchen, die man an verschiedenen Stellen in seine Webpräsenz einbauen kann ohne selbst HTML, PHP oder ähnliches zu programmieren. Man muß verschiedene Plugins im Testsystem probieren und sich so ein eigenes Bild der Auswirkung auf die Webseite machen um abschließend zu entscheiden welche man in seiner Webpräsentation haben will und welche nicht. Alle 4300 registrierten Plugins findet man hier. Meine aktiven Plugins findet man in der Tabelle weiter unten. Ich habe auf alle Plugins zum Managen von Beiträgen, Kommentaren, Formularen und allen Verkaufserweiterungen (meistens Formulare mit Registrierungen und Bankeinzug etc.) verzichtet, da ich sowas nicht benötige. Auch das Einbinden von Werbebanner ist für meine Webseite nicht erforderlich.

Meine aktiven Plugins

1Sidebar LoginLogin Registrierung auf der rechten Seitenleisteempfehlenswert
2AkismetFiltert SPAM aus Kommentarenmuß
3Broken Link CheckerPrüft alle Links in Artikel ob sie noch existierenempfehlenswert
4Contact Form Kontaktformular mit CAPTCHA Kennwortempfehlenswert
5Delete-RevisionKeine alten Beitragsversionenempfehlenswert
6Enhanced CategoriesBessere Darstellung von hierarchischen Kategoriennicht so wichtig
7Enhanced LinksBessere Darstellung von hierarchischen Linksnicht so wichtig
8Google Maps QuicktagQuicktag Einsatz für Google Maps im Editorempfehlenswert
9Google XML SitemapsVerbessert die Suchmaschinensuchemuß
10Kimili Flash EmbedEinbetten von SWF Objekten in die Webseite (z.Bsp. SlideshowPro)nicht so wichtig
11Lightbox 2Bilddarstellung mit interessantem Effektempfehlenswert
12Link IndicationVerschönern von Linksnicht so wichtig
13NextGEN GalleryDIE Bildergalerie in WordPressmuß
15Time ZoneVerwaltung von Zeitzonen und Sommer/Winterzeitempfehlenswert
16TinyMCE AdvancedTinyMCE HTML Editor Erweiterungempfehlenswert
17WP-Downloadma−
nager
zip und pdf etc. Download Managerempfehlenswert
18WP-FileManagerFileManager zum Upload von Filesnicht so wichtig
19wp-forecastWetter Vorhersageempfehlenswert
20wp-serverinfoErzeugt im Backend Serverinfo über PHP und MySQLnicht so wichtig
21Flexible MapEinfügen von Google Maps in Berichtemuß
22WP-PageNaviVerbesserte Seitenzählleiste unten im Footerempfehlenswert
23TubePressPlugin um YouTube Videos in einem Artikel von WordPress abzuspielenempfehlenswert
24Social BookmarksPlugin von Apostolos Dountsis um Lesezeichen in Sozialen Netzwerken wie Facebook zu erzeugenempfehlenswert
25Shadow JavaScriptKann Bilder, Videos, Flash etc. im schicken Shadow Look mit abgedunkeltem Hintergrund darstellen. Ich verwende es in der Seitenleiste unter der Überschrift: ‚Meine Haupt-Fotogalerie‘. Hilfreiche Beispiele gibt es hierempfehlenswert
27WP Security ScanPrüft die Installation auf Sicherheitslücken. Die Prüfung bezieht sich auf ausreichenden Passwortschutz, die SQL Database und sehr wichtig die Zugriffsrechte der WP Installation.empfehlenswert
28WP Memory UsageÜberschreitet man durch umfangreiche WP Erweiterungen das PHP Memory Limit so geht nichts mehr: Kein Seitenaufruf und kein Aufruf der Administratorseite. Dieses kleine Plugin zeigt an, was man gerade an PHP Memory verbraucht und was einem der Webhoster genehmigt hat.empfehlenswert
29All in One SEO PackSEO steht für Search Engine Organization. Will man von Suchmaschinen wie etwa Google gefunden werden, so ist dies Plugin ein muß. Die Suchmaschinenoptimierung ist ein weites Feld. Einfach mal googlen. Dieses Plugin hier gehört in Verbindung mit dem Google XML Sitemaps Plugin in jede WP Installation.empfehlenswert
30WartungsmodusUm freundlich zu seinen Webseitenbesuchern zu sein, kann bei Wartungsarbeiten eine Info ausgegeben werden.nett zu haben
31WordPress Super CacheGutes Caching von Webseiten. Entlastet den SQL Server und beschleunigt den Seitenaufbau der Webseite sehr.Für größere WordPress Seiten ein Muß
32Seemore: Besseres More TagDrückt man auf weiter lesen so startet der Blog Beitrag am Anfang der Seite. Sieht einfach besser aus.Kein Muß aber nett zu haben

Hat man sich für ein tolles WordPress-Theme entschieden und sich die schönsten Plugins ausgesucht und nach Installationsanweisung aktiviert, bleiben noch die Seitenleiste, bei mir rechts, und ggf. Statische Seiten zu erzeugen. Die Seitenleiste kann man mit sg. Widgets belegen. Im Backend unter Darstellung, Widgets diese einschalten und an die richtige Stelle schieben. Auch das perönliche Profil, bei mir ganz oben, ist ein kleines Widget, das man mit Text füllt. Dann bleiben noch die Statischen Seiten. Schon Blog-Beiträge kann man mit Attributen versehen, wie: Passwortschutz und auf Startseite fixieren. Statische Webseiten sind bei einer Vereinsseite für einen Sportverein z.Bsp. die Seiten für Vorstand, Mannschaftslisten, Anfahrweg, Impressum usw. Blogs sind dann die Spielberichte. Statische Seiten werden innerhalb von WordPress als HTML Files abgelegt. Blogs auf der anderen Seite wären die Spielberichte, die in der Mitte der Seite stehen, der neueste Blog ganz oben, die älteren unten. In meiner Webseite verwende ich statische Seiten fürs Wetter und das Kontaktformular.

Wordpress Einbauen Das Einbauen des WordPress Auftritts in eine bestehende Webseite. wie sie hier links zu sehen ist, erfordert viel Probieren und zwar in allen verfügberen Web-Browsern. Besonders der Internet Explorer 6 zeigt häufig nicht das erwartete Ergebnis. Am einfachsten ist es, WordPress in einer eigenen Subdomain (kann man unter seinem Account beim Webhoster einrichten. Erreichbar unter z.Bsp. http://wordpress.Friedrich-Glasenapp.de) zu installieren und dann mit einem iframe-tag diese Webseite in den vorgesehenen weißen Bereich der übergeordneten Webseite einzubauen. Der entscheidende Nachteil bei dieser Methode ist, dass Suchmaschinen immer die Adresse: http://wordpress.Friedrich-Glasenapp.de/etc anbieten und man daher als Einsprung und Design nicht sein eigentliches Layout mit dem Header Bild und der Navigation beim Anklicken über die Suchmaschine (z.Bsp. Google) erhält. Die bessere Wahl ist mit CSS zu arbeiten und den weißen Bereich als div-Container für WordPress zu reservieren und dort einzubinden. Header und linke Navigationsleiste baut man in wp-content/Themes/tarski/header.php ein (Theme hier ist Tarski), footer Informationen entsprechend in wp-content/Themes/tarski/footer.php. Viel Probieren und Geduld – wie schon erwähnt – ist nötig.

Zum Abschluß dieses Blog Eintrages eine Anmerkung zum Webhoster also dem Dienstleister, der einem den Webauftritt erst durch Überlassen von IT Resourcen ermöglicht. Man muß bei etwas umfangreicheren WordPress Anwendungen sicher stellen, dass die Variable PHP-Memory-Limit möglichst auf 64MB eingestellt ist. Ansonsten bekommt man beim Aufruf der Webseite eine Fehlermeldung. Ich mußte bei meinem Provider das Paket Performance AddOn hinzukaufen.

  1. Teil: Der lange Weg zur eigenen Webseite: Einführung
  2. Teil: Der lange Weg zur eigenen Webseite: Fotogalerie
  3. Teil: Der lange Weg zur eigenen Webseite: WordPress
  4. Teil: Der lange Weg zur eigenen Webseite: Navigation

Schlagworte: ,

  1. Bastian’s Avatar

    Ich hatte auch einen langen Weg zur eigenen Seite, aber ich habe das geschafft und freue mich darüber. Anhand von WordPress und Themen http://www.templatemonster.com/de/type/wordpress-themen/ konnte ich eine schöne Seite gestalten.

    Antworten

  2. Marine’s Avatar

    Danke für die Infos!

    Antworten

  3. Ego’s Avatar

    Super Post, macht immer Spass hier mitzulesen 🙂

    Antworten

Antworten

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Fotos und Inhalt ©2009-2017. Impressum WebGalerie jAlbum Musik Harpish, Highland Webhost velogrid Weblog Wordpress