Kategorien
Server Shared Hosting Webserver

Ein Wiki ist nützlich – MediaWiki

Jeder kann schreiben, jeder kann lesen!

Das ist die Grundidee eines Wikis. Viele Menschen arbeiten gemeinsam an Texten. Die Software dafür liegt auf dem eigenen Server. Berühmtestes Beispiel für ein Wiki ist Wikipedia. Jeder kennt Wikipedia und jedem hat Wikipedia schon einmal geholfen. Hast du schon mal etwas geschrieben in Wikipedia? Es ist ganz einfach! Du musst nur auf Bearbeiten klicken, einen Text schreiben und eventuell auf einen anderen Text verlinken. Nach und nach ergibt sich so ein Netz von Texten.

So bestechend einfach die Idee in der Theorie ist, so schwer ist sie oft in der konkreten Umsetzung.

Ein Beispiel: Auf dem Gehweg liegt „Müll“, eine Getränkedose, ein Karton oder etwas ähnliches. Du siehst einen Mülleimer in der Nähe. Hebst du den Müll auf und wirfst ihn in den Mülleimer? Es geht mir nicht um eine Antwort. Es geht mir um dein Gefühl dabei. Es ist vergleichbar mit einer Wiki Änderung. Du liest etwas und entdeckst einen Schreibfehler oder inhaltliche Fehler, die sich schnell beheben lassen. Drückst du auf den Edit Button?

Natürlich können alle Unternehmen,  jede Abteilung, jeder Verein und jede Gruppe von Gleichgesinnten ein Wiki gebrauchen. Lassen sich dort doch alle Abläufe und Informationen, die sich in den Köpfen der Mitarbeiter befinden, von ihnen selbst hinterlegen. Das ist praktisch, wenn ein neuer Mitarbeiter oder ein neues Vereinsmitglied kommt. Es ist aber auch praktisch, wenn man selbst das Wiki als Nachschlagewerk benutzen kann.

Eine Wikipedia über die UBS, deren Abteilung Investment Banking, die Stadt Zürich, einen Sportverein – warum nicht?

Bei der UBS würde es sicher eine Zugangskontrolle geben, damit keine Geschäftsgeheimnisse an die Öffentlichkeit kommen, ein Zürich Wiki könnte vielleicht für jeden offen sein. Und der Sportverein? Kann es machen wie er will. So ein Wiki kann lokal im Firmennetz laufen oder auf einem Webhosting, wie bei NOVATREND. Alles ist möglich.

Immer wenn alles möglich ist, wird es schnell unübersichtlich und deshalb möchte ich in diesem Artikel die Installation der Software MediaWiki beschreiben.

MediaWiki ist die Software, die Wikipedia benutzt und die von der Wikimedia Foundation weiterentwickelt wird. MediaWiki ist sicherlich nicht die einfachste Software, aber ein guter Start um sich mit dem Thema zu befassen. Außerdem sieht es meines Erachtens sehr professionell aus.

Installation

Wenn du ein Webhosting bei NOVATREND hast, kannst du MediaWiki über das Installatron in cPanel per Mausklick installieren.

ACHTUNG: Seit November 2017 benutzen wir anstelle des Installatrons das Tool Softaculous. Im Beitrag Automatisierte Installation mit Softaculous beschreibe ich die grundlegenden Vorgehensweisen.

MediaWiki im Installatron
MediaWiki im Installatron

Ohne Installatron lässt sich MediWiki auch über einen Web-Installer installieren. Dazu musst du dir den Quellcode von der Projekt Website laden (mediawiki.org) und entpacken.

Wenn du im Browser die Site aufrufst, erhältst du die Meldung, dass die Datei LocalSettings.php nicht gefunden wurde. Eigentlich heißt das, dass das Wiki erst noch eingerichtet werden muss und deshalb ist auch ein Link Please set up the wiki first zu sehen.

MediWiki - Erster Aufruf
MediWiki – Erster Aufruf

Nach einem Klick auf diesen Link wird der Installer aufgerufen. Der erste von zahlreichen Schritten ist die Auswahl der Sprache.

MediaWiki Installation - Sprachauswahl
MediaWiki Installation – Sprachauswahl

Im nächsten Schritt wird die Installationsumgebung überprüft ob alle Voraussetzungen für die Installation erfüllt sind.

MediaWiki Installation - Systemvoraussetzungen
MediaWiki Installation – Systemvoraussetzungen

Im unteren Bereich befinden sich die Weiter Buttons. Da die Seiten sehr gut dokumentiert und dadurch recht umfangreich sind, zeige ich hier nur Ausschnitte als Screenshots. MediaWiki benötigt eine Datenbank. Die Zugangsdaten dazu trägst du in diesem Schritt ein.

MediaWiki Installation - Datenbank einrichten
MediaWiki Installation – Datenbank einrichten

Die Standardeinstellungen sehen als Speicher-Engine InnoDB vor und als Zeichensatz binär. Beides kann bei einer Standardinstallation übernommen werden.

Datenbankeinstellungen
Datenbankeinstellungen

Nach der Einrichtung der Datenbank werden der Name des Wikis und der des Projektnamenraumes abgefragt. Ein Namensraum dient der Strukturierung. Wenn beispielsweise Benutzer ein Namensraum ist, dann meint Benutzer: Hagen den Benutzer Hagen. Der Wikieintrag Hagen dagegen kann etwas anderes bedeuten, beispielsweise die Stadt Hagen (Stadt Hagen, Benutzer Hagen). Auch das Administratorkonto wird in diesem Schritt abgefragt

Name des Wikis
Name des Wikis

Im nächsten Schritt kann man die Installation abschließen oder die erweiterten Installationsoptionen aufrufen. Hier ein Beispiel Screenshot mit einem Teil der erweiterten Optionen. Standardmäßig ist das Wiki für jeden zugänglich, hier kann diese Einstellung verändert werden.

Erweiterte Einstellungen
Erweiterte Einstellungen

Aus einer Liste von Erweiterungen kann man die gewünschten ankreuzen. Ich habe mich für den WikiEditor entschieden. Ob das Hochladen von Dateien ermöglicht werden soll, wird ebenfalls an dieser Stelle entschieden.

Erweiterte Einstellungen
Erweiterte Einstellungen

Die eigentliche Installation und das Anlegen der Tabellen in der Datenbank erfolgen dann im nächsten Schritt.

Installation erfolgreich
Installation erfolgreich

Als letzte Tat muss die Datei LocalSettings.php heruntergeladen und in das Document Root Verzeichnis (da wo die Datei index.php liegt) kopiert werden.

Datei kopieren
Datei kopieren

Nach all diesen Schritten ist MediaWiki einsatzbereit. Jetzt hast du deine „eigene Wikipedia“ und kannst durch einen Klick auf Bearbeiten anfangen dein Wissen und das deiner Gruppe zu sammeln und zu organisieren.

MediaWiki Startseite
MediaWiki Startseite

Neue Seite anlegen

Eine Neue Seite wird angelegt, in dem du eine bestehende Seite editierst und mit einem Link versiehst. Klicke dafür einfach im Editor auf das Link Icon und schreibe den Titel zwischen die eckigen Klammen.

Links zu neuen Seiten setzen
Links zu neuen Seiten setzen

Nach dem Abspeichern erscheinen Projekte und Teams als Links. Durch einen Klick auf den Link wird die neue Neue Seite angelegt und in der Bearbeitungsansicht geöffnet.

Das ist eigentlich das ganze Geheimnis 🙂 Alles andere ergibt sich aus Kollaboration und Erfahrung.

Erweiterungen

MediaWiki bietet hunderte von Erweiterungsmodulen zum Download an (mediawiki.org/wiki/Category:Extensions). Die deutsche Wikipedia benutzt beispielsweise diese Erweiterungen – https://de.wikipedia.org/wiki/Spezial:Version.

Die Installation einer Erweiterung ist einfach. Die Erweiterung muss herunterladen und entpackt werden. Das sich ergebende Verzeichnis muss dann per FTP, SSH oder Kopieren im /extension Ordner abgelegt werden.

Fazit

Die Installation vom MediaWiki ist ein wenig altmodisch aber letztlich nicht schwer. An jeder Stelle wird umfangreiche Hilfe angeboten und man findet schnell Spaß am Strukturieren, Texten und Verlinken.

Links


tl;dr: Mit ein paar Installationsschritten kannst du deine eigene Wikipedia starten.

Save

Save

Kategorien
Content Management Systeme Webdesign Wunschthema

Strukturierte Artikel mit dem Paragraphs Modul für Drupal 8

Heute mal wieder ein Wunschthema!

Ein immer wiederkehrendes Problem bei Content Management Systemen ist die Strukturierung der Inhalte. Wenn sich derjenige, der den Inhalt eingibt und pflegt, an die Erstellung eines Artikels macht, dann „muss“ alles möglich sein und mindestens so komfortabel, wie in Microsoft Word. In WordPress, Joomla und Drupal gibt es für den Artikeltext als Standard ein! Textfeld zur Eingabe des Inhalts und ein separates Feld für den Titel. Damit die Textbearbeitung komfortabel für den Bearbeiter ist, wird ein WYSIWYG Editor eingebunden, der alle gewünschten Funktionen wie  Bild-Upload, Formatierungen und vieles andere mehr beinhaltet. Der Editor erzeugt wiederum das benötigte Markup automatisch und schreibt es in das Textfeld. In diesem Textfeld befindet sich bei längeren Artikeln ein großer „HTML Klumpen“, der heutzutage natürlich auch responsive sein sollte. Spätestens bei Videos und Bildern wird das, sagen wir mal, anspruchsvoll. Eine weitere Herausforderung ist die seitenweite Anpassung oder Änderung vorhandener Artikel. Bei mehr als 500 Artikeln kann man so etwas nicht mehr manuell anpassen. Je mehr Autoren an einer Seite arbeiten, desto wichtiger wird eine Strukturierung der Texte.

An dieser Stelle setzt das Paragraphs Modul für Drupal an. Wenn ein Autor einen neuen Artikel schreibt, so kann er die entsprechenden Paragraph Typen auswählen und beliebig oft verwenden. In diesem Artikel beschreibe ich die Einrichtung und Konfiguration des Paragraphs Moduls in Drupal 8.

Installation

Die Installation von Modulen erfolgt in Drupal 8, je nach Art der Drupal Instanz, über die Kommandozeilen Tools Composer und Drush oder über die Drupal Benutzeroberfläche, also

composer require paragraphs

oder

drush dl paragraphs
drush en paragraphs

oder

Drupal 8 - Modul installieren
Drupal 8 – Modul installieren

Konfiguration

Damit man Paragraph Typen benutzen kann, müssen sie zunächst erstellt werden. Im einfachsten Fall nehmen wir mal ein Bild und einen Text. In Admin -> Struktur -> Paragraphs Type (/admin/structure/paragraphs_type) können die Typen angelegt werden.

Paragraphs Typen erstellen
Paragraphs Typen erstellen

Text Typ erstellen

Nach einem Klick auf den Add paragraph type Button wird zunächst der Name des gewünschten Typs abgefragt. Ich möchte einen Text Typ erstellen. Dies ist auch der Name, der später dem Autor des Artikels angezeigt werden wird.

Paragraphs Typ Text erstellen
Paragraphs Typ Text erstellen

Nachdem der Typ erstellt ist, muss ein Feld hinzugefügt werden. In meinem Fall natürlich ein Textfeld.

Paragraphs Typ Textfeld hinzufügen
Paragraphs Typ Textfeld hinzufügen

Drupal bietet die Möglichkeit die Anzahl der Felder festzulegen. In meinem einfachen Fall möchte ich nur ein Textfeld. Ich könnte aber auch beispielsweise drei Textfelder erlauben, die dann entsprechend gestylt werden, so dass sie in einem Slider oder in drei Spalten nebeneinander dargestellt werden könnten.

Anzahl der Textfelder im Paragraphs Typ
Anzahl der Textfelder im Paragraphs Typ

Bild Typ erstellen

Der Bild Typ wird genauso erstellt, wie der Text Typ. Als Feldinhalt muss natürlich  Bild (Image) ausgewählt werden. Die Schritte sind

  • neuen Paragraph Typ anlegen
  • in dem Typ ein Feld Bild anlegen
  • Anzahl der Bilder begrenzen auf eins
  • alt und title Text konfigurieren (nach Bedarf)
Paragraphs Typ Bild - alt und title Text
Paragraphs Typ Bild – alt und title Text

Formatierung

Im Ergebnis haben wir jetzt zwei Paragraph Typen, die jedoch noch für die Ausgabe und Eingabe formatiert werden müssen.

Paragraphs Typen
Paragraphs Typen

Als Beispiel blende ich beim Bild das Label aus und ändere die Anzeige von Originalbild auf einen vordefinierten Style (hier 480 x 480 px).

Feld Anzeige - Bild
Feld Anzeige – Bild

Strukturierten Inhaltstyp konfigurieren

Nach der Erstellung der Paragraph Typen kann ich einen neuen Inhaltstyp erstellen, in dem der spätere Autor die unterschiedlichen Paragraphen auswählen kann (/admin/structure/types). Ich nenne den Inhaltstyp Struktur, lösche das standardmäßig erzeugte Body Feld heraus und füge ein Referenzfeld auf Paragraphs hinzu. Hier ist es nun wichtig, die Anzahl der möglichen Werte auf unbegrenzt zu setzen, da der strukturierte Artikel ja beliebig viel Paragraphen enthalten soll.

Referenzfeld
Referenzfeld

Inhalt eingeben

Jetzt kann der Autor Inhalte eingeben (Content -> Inhalt hinzufügen -> Struktur oder /node/add/struktur). Das Interessante dabei ist nun, dass er einen Titel festlegt und dann den entsprechenden Paragrafen wählt. In meinem einfachen Fall ist das entweder ein Text oder ein Bild. Man könnte aber natürlich auch Videos, Slideshows und vieles andere mehr hier anbieten. Die Möglichkeit Fehler zu machen, ist für den Autor viel geringer als wenn er das Bild selbst positionieren müsste.

Inhalt eingeben
Inhalt eingeben

Anzeige für den Besucher der Website

Hier ein Beispiel Inhalt. Ich habe den Titel (strukturierter Artikel), drei Text Paragraphen und zwei Bild Paragraphen angelegt und so sieht das Ergebnis auf der Website für den Besucher aus:

Strukturierter Artikel
Strukturierter Artikel

Die Ausgabe kann durch individuelle Templates natürlich verändert werden.

Fazit

Je nach Anwendungsfall ist es notwendig, Inhalte zu strukturieren und dabei gleichzeitig den Autoren die Arbeit zu erleichtern. Das Paragraphs Modul bietet dafür eine elegante Vorgehensweise an.

Links

Save

Save

Kategorien
Shared Hosting

Alle Fotos an einem Ort – Piwigo

Bei der Vielzahl der Fotos, die du heute mit deinem Smartphone aufnimmst, stellt sich irgendwann die Frage: Wohin damit?

Zuerst nutzt du vermutlich Services wie Google Photos, Apple iCloud Fotomediathek, Flickr oder andere. An irgendeiner Stelle dieser Angebote ist immer ein Geschäftsmodell eingebaut. Beispielsweise ist das die Menge des Speicherplatzes, die Möglichkeit RAW Fotos zu speichern, Videos oder keine Videos und viele andere „Kleinigkeiten“ mehr.

Vor längerer Zeit hatte ich im Blog bereits das Open Source Projekt MediaGoblin als Alternative vorgestellt. Heute möchte ich Piwigo vorstellen. Piwigo ist aus dem Projekt PhpWebGallery hervorgegangen, ist freie Software unter GPL Lizenz und bietet viele Funktionen. Piwigo lässt sich in jedem NOVATREND Webhosting Paket mit wenigen Klicks installieren

Domain festlegen

Bevor du Piwigo installierst, solltest du dir überlegen, ob du es in einer Subdomain (Unterdomäne – fotos.seafolly.ch) oder in einem Verzeichnis unterhalb deiner Website (seafolly.ch/fotos) installieren willst.
Im Verwaltungsbereich cPanel, Menüpunkt Unterdomänen kannst du einen eigenen Domainnamen für deine Fotosammlung festlegen.

cPanel - Unterdomänen
cPanel – Unterdomänen
Subdomain fotos anlegen
Subdomain fotos anlegen

Installation

Die vermutlich einfachste Installationsmöglichkeit für NOVATREND Kunden erfolgt über unseren Verwaltungsbereich cPanel im Installatron Applications Installer.

ACHTUNG: Seit November 2017 benutzen wir anstelle des Installatrons das Tool Softaculous. Im Beitrag Automatisierte Installation mit Softaculous beschreibe ich die grundlegenden Vorgehensweisen.

Installatron Application Installer
Installatron Application Installer

Dort findest du das Paket Piwigo und kannst die Installation mit einem Klick auf den Button Diese Applikation installieren starten.

Piwigo im Installatron
Piwigo im Installatron

Es erscheint ein Formular, in dem du den Installationsort, also entweder das Verzeichnis oder die Unterdomäne, angeben musst.

Installationsort wählen
Installationsort wählen

Im weiteren Verlauf des Formulars musst du einen Benutzernamen für das Administrator Konto und ein Passwort eingeben oder dir die bereits vorgegebenen Standardwerte merken, damit du dich nach der Installation einloggen kannst! Die Standardwerte sehen auch eine automatische Aktualisierung der Software bei einem Update vor und können übernommen werden.

Nach der Installation siehst du die wichtigsten Informationen über Piwigo in der Installatron Verwaltung.

Installatron Piwigo Paket
Installatron Piwigo Paket

Piwigo

Piwigo bietet eine Verwaltungsoberfläche um Alben und Benutzer zu erstellen. Alben können ineinander geschachtelt werden. Fotos können mit Schlagwörtern versehen, bewertet und kommentiert werden. Uploads können per Webformular, FTP-Synchronisation oder per iOS und Android App erfolgen.

Piwigo Administration
Piwigo Administration

Piwigo ist über Plugins erweiterbar und kann beispielsweise auch Fotos, die bereits auf anderen Plattformen liegen, importieren. Hier ein Beispiel für einen Import von Fotos, die auf Flickr liegen mit dem Flickr2Piwigo Plugin.

Foto Import aus Flickr
Foto Import aus Flickr

Themes

Im Konfigurationsmenü lassen sich verschiedenen Themes zuordnen. Als Standard ist ein Theme für Desktop Computer und ein Mobile Theme zugeordnet. Auf einem iPhone sieht die Standardansicht des Mobile Themes so aus:

Piwigo Mobile Theme
Piwigo Mobile Theme

Plugins

Es gibt knapp 600 Plugins, mit denen die Funktionen deiner Fotosammlung erweitert werden können. Darunter ist beispielsweise auch ein Google Maps Plugin, mit denen die Fotos auf einer Karte dargestellt werden können.

Fazit

Ich bin sehr positiv von Piwigo überrascht worden und würde am Liebsten die nächsten Tage damit verbinden, Fotos zu ordnen 🙂

Links


tl;dr: Mit Piwigo kannst du deine Bilder selbst hosten und verwalten.

Save

Kategorien
Shared Hosting Webdesign

CKEditor in Drupal 8 benutzerfreundlich gestalten – Teil 2

Der CKEditor, der in Drupal 8 Verwendung findet, kommt ein wenig spartanisch daher. Im ersten Artikel zum Thema habe ich gezeigt, wie Links komfortabler eingegeben werden können. Im zweiten Teil möchte ich mich mit dem Bild-Upload beschäftigen und eine Alternative aufzeigen.

Ausgangslage

Nach der Installation kommt Drupal mit zwei vordefinierten Inhaltstypen. Im Full HTML Format erscheint der CKEditor und enthält ein Icon zum Hochladen von Bildern.

Drupal 8 - CKEditor - Bild-Dialog
Drupal 8 – CKEditor – Bild-Dialog

Der Upload und die Übernahme in den Text funktionieren auch hervorragend. Ein Problem ergibt sich allerdings, wenn man auf bereits hochgeladene Bilder zurückgreifen möchte. Es gibt im Drupal Core leider keine Medienbibliothek wie in WordPress. Es gab zu diesem Themenbereich für Drupal 7 ein Modul namens Media, das in Drupal 8 allerdings komplett umgebaut wird und Stand heute nicht produktiv einsetzbar ist.

IMCE File Manager

Seit 10 Jahren gibt es aber den IMCE File Manager für Drupal. Und siehe da, es gibt eine stabile Version für Drupal 8. Installiert wird je nach persönlicher Konfiguration:

via Composer

composer require imce

via Drush

drush dl imce
drush en imce

via Benutzeroberfläche (UI)
Datei-Upload in der Benutzeroberfläche (/admin/modules/install)

Je nach Art der Installation muss das Modul eventuell in der Benutzeroberfläche aktiviert werden (/admin/modules).

Drupal - Modul aktivieren
Drupal – Modul aktivieren

Nach dem Download und der Installation des Moduls müssen die Zugriffsrechte und Pfade definiert werden und das IMCE Icon zum CKEditor hinzugefügt werden.

Zugriffsrechte und Pfade

In der Benutzeroberfläche unter Konfiguration -> Medien -> IMCE File Manager (/admin/config/media/imce) lassen sich unterschiedliche Konfigurationsprofile unterschiedlichen Benutzerrollen zuweisen. Zwei Profile sind mit sinnvollen Parametern vordefiniert.

IMCE Konfiguration
IMCE Konfiguration

Das Admin Profil darf alle Ordner lesen und verändern, das User Profil ist eingeschränkt und legt die hochgeladenen Dateien nach einem Muster ab (users/user[user:uid]), so dass jeder Benutzer der Site einen eigenen Ordner erhält und nicht die Inhalte der Ordner der anderen Benutzer lesen oder verändern kann.

IMCE User Profil
IMCE User Profil

Das Adminprofil gilt für alle Benutzer, die Mitglied der Rolle Administrator sind und für den Root User (user/1).

Einbindung in den CKEditor

Standardmässig definiert Drupal 8 vier Textformate von denen zwei den CKEditor nutzen.

Drupal 8 Textformate
Drupal 8 Textformate

Ich möchte dem Full HTML Format die Möglichkeit geben, den IMCE File Manager zu nutzen. Nach einem Klick auf Konfigurieren kann ich in der Icon Leiste eine neue Gruppe erstellen und das IMCE Icon dort hineinziehen.

IMCE Icon hinzufügen
IMCE Icon hinzufügen

IMCE nutzen

Nach dieser Vorarbeit taucht im Editor das neue Icon auf und nach einem Klick darauf ein vollwertiger Dateimanager.

IMCE im Artikel
IMCE im Artikel

Die User können neue Ordner anlegen und die Bildgröße verändern. Veränderte Bilder können als Kopie gespeichert werden.

IMCE Grösse ändern
IMCE Grösse ändern

Fazit

IMCE bietet keine fancy Features aber eine pragmatische und solide Lösung zur Bildverwaltung auf einem Desktop Computer.

Links


tl;dr: Der IMCE File Manager ermöglicht eine Bilderverwaltung für jeden Benutzer einer Drupal Installation

 

Save