Kategorien
Content Management Systeme seafolly.ch

Drupal 8 bringt frischen Wind …

Das stabile Release von Drupal 8 wurde am 19. November 2015 veröffentlicht. Die beiden gravierendsten Veränderungen zu Drupal 7 sind folgende:

  1. Drupal soll nicht mehr nur als Content Management System wahrgenommen werden, sondern als Basis für jede Art von Inhalt. Kernidee dabei sind Schnittstellen, die es externen Clients ermöglichen, auf die Inhalte in Drupal zuzugreifen.
  2. Der Drupal 8 Code wurde seit fünf Jahren praktisch neu geschrieben und ist nun weitgehend objekt-orientiert auf der Basis des PHP-Frameworks Symfony. Ein Migrationspfad bei neuen Drupal Versionen ist nun erstmals möglich.

Der erste Punkt stellt sicher, dass Drupal zukunftssicher ist und als Datenbasis für mobile Apps, Desktop Apps und andere Websites dienen kann. Der zweite Punkt führt dazu, dass Drupal Entwicklung nun wie „normale“ Software-Entwicklung funktioniert und damit erheblich einfacher in ein Unternehmensumfeld zu integrieren ist.

Neue Features

Ausser diesen beiden Kernpunkten gibt es die folgenden Neuigkeiten:

Für Endbenutzer und Kunden

Inline editing. Die Inhalte können nun direkt im Frontend geändert werden.

Der WYSIWYG Editor CKEditor ist nun bereits im Drupal Core enthalten.

WYSIWYG Editor
WYSIWYG Editor

Die „mobile first“ Strategie kommt mit responsiven Themes und Bildern, sowie einem auf Mobilgeräten bedienbarem Adminbereich.

Drupal - Standard Theme mit Adminbereich unter Android
Drupal – Standard Theme mit Adminbereich unter Android

Für Site Builder

Der Blockbereich ist erweitert worden, beispielsweise besteht nun die Möglichkeit, den Inhaltsbereich besser zu ordnen.

Drupal - Inhaltsblöcke
Drupal – Inhaltsblöcke
  • Es gibt neue Feldtypen im Core: Referenzen auf Entitäten, Datumsfelder, Links, Telefonnummer, E-Mail und Kommentar
  • Teile des Views Moduls sind nun bereits im Core enthalten (individualierte Listen, Blöcke, Galerien, Slideshows, REST Ausgabe)
  • Eine Lokalisierung der Site ist bereits bei der Installation möglich
  • Die Übersetzung von fast allen Entitäten ist nun ebenfalls im Core verfügbar.

Für Designer

Für Entwickler

Auf den ersten Blick denkt man sich nun – hm, und das hat 5 Jahre gedauert?

Auf den zweiten Blick dagegen merkt man, dass die Änderungen umfangreich sind und dem Projekt gut tun werden. Drupal 4 und 5 waren eher Content Management Frameworks, Drupal 6 und 7 dann wieder eher Content Management Systeme. Der Schwerpunkt aller Drupal Versionen lag aber immer in der strukturierten Darstellung von Inhalten (Content Construction Kits). Drupal 8 versucht nun den Spagat zwischen beiden Welten und kommt sehr aufgeräumt und durchdacht daher.

Build something amazing.

Um ein konkretes Beispiel zu zeigen, will ich mir seafolly.ch vornehmen.

Das Kunstprojekt dient oft als Beispiel hier im Blog und die Website habe ich bisher mit dem einfachen CMS Yellow erstellt.
Nun werde ich es mit Drupal 8 versuchen.

Installation

Wenn Sie bei Novatrend ein Webhosting Paket haben, können Sie Drupal mittels cPanel Installatron sehr einfach installieren.

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

cPanel - Installation Drupal 8
cPanel – Installation Drupal 8

Die Installatron-Installation hat den Vorteil, dass Sie sich um nichts kümmern müssen. Dieser Vorteil ist im Falle Drupal aber auch ein Nachteil, denn Drupal 8 ist bewusst so angelegt, dass es von der Kommandozeile aus gesteuert werden kann. Zu diesem Zweck gibt es das Programm Drush.

Installation per Kommandozeile

Im Laufe der Installation werden die Datenbankparameter abgefragt. Legen Sie sich im cPanel eine MySQL Datenbank und einen MySQL Datenbank Benutzer für Ihre Drupal 8 Installation an.

Im NOVATREND Webhosting Paket können Sie per SSH auf Ihre Daten zugreifen.

ssh seafoll1@seafolly.ch

Composer installieren

Um Drupal installieren, warten und konfigurieren zu können, benötigen Sie das Programm Drush. Drush wiederum können Sie mit dem Programm Composer installieren. Composer können Sie mit dem Curl Befehl installieren. Zunächst also die Installation von Composer mittels Curl.

seafoll1@srv11 [~]# curl -sS https://getcomposer.org/installer | php

Das Verzeichnis in dem Composer erstellt wurde, muss in den Suchpfad aufgenommen werden.

seafoll1@srv11 [~]# export PATH="$HOME/.composer/vendor/bin:$PATH"

Nun können Sie Ihr Terminalfenster neu starten oder ihr Profil neu laden.

seafoll1@srv11 [~]# source ~/.bash_profile

Drush installieren

Sie können nun Composer nutzen um Drush zu installieren.

seafoll1@srv11 [~]# php composer.phar global require drush/drush:dev-master

Update 

seafoll1@srv11 [~]# php composer.phar global require drush/drush:8.*

Mit dem Befehl

seafoll1@srv11 [~]# drush version
 Drush Version   :  8.0.0

können Sie überprüfen, ob die Installation erfolgreich war. In unserem Fall ja, Version 8.0.0 ist genau das, was wir brauchen.

Globale Updates

Ein globales Update von Composer erreichen Sie mit dem folgenden Befehl:

seafoll1@srv11 [~]# php composer.phar global update

Drupal 8 mit Drush herunterladen

Wenn Sie sichergestellt haben, dass Drush läuft, wechseln Sie in das Verzeichnis, in dem Sie Drupal installieren wollen und führen den folgenden Befehl aus:

seafoll1@srv11 [~/public_html]# drush dl drupal-8 --select
Choose one of the available releases for drupal:
 [0]  :  Cancel
 [1]  :  8.1.x-dev    -  2015-Nov-25  -  Development
 [2]  :  8.0.0        -  2015-Nov-19  -  Supported, Recommended
 [3]  :  8.0.0-beta2  -  2014-Oct-15  -  Security

Wählen Sie Alternative 2 aus. Die stabile Version von Drupal wird nun im Verzeichnis /public_html/drupal-8.0.0 entpackt.

Innerhalb des Verzeichnisses müssen Sie nun die Datei und Verzeichnisrechte verändern: alle Verzeichniss auf 755 und alle Dateien auf 644.

seafoll1@srv11 [~/public_html/drupal-8.0.0]# find  -type d -exec chmod 755 {} \;
seafoll1@srv11 [~/public_html/drupal-8.0.0]# find  -type f -exec chmod 644 {} \;

Hinweis:

Bei dieser Art der Installation entsteht innerhalb des public_html Verzeichnisses ein neues Verzeichnis in dem Drupal 8 liegt (drupal-8.0.0). Abhängig von der Konfiguration Ihres Webhostings und der dazu gehörenden Domain müssten Sie entweder das Dokumentenverzeichnis des Webservers auf den Drupal Pfad anpassen oder die Dateien in das Hauptverzeichnis public_html kopieren.

Wenn Sie nun im Browser den entsprechenden URL aufrufen, startet der Webinstaller zunächst in englischer Sprache. Wenn Sie eine lokalisierte Version von Drupal haben wollen, so wählen Sie an dieser Stelle die gewünschte Sprache aus.

Drupal - Installation - Sprachauswahl
Drupal – Installation – Sprachauswahl

Der Installer wechselt nun die Sprache. Ich wähle im nächsten Schritt das Standardprofil aus und Drupal überprüft die Serverkonfiguration.
Wenn alles passt, werden die Datenbankparameter abgefragt und die eigentliche Installation startet.

Drupal - Installation - Fortschritt
Drupal – Installation – Fortschritt

Nach der Installation aller Module werden noch Parameter wie Name und E-Mail Adresse für die Website und Name und Passwort des Administrators abgefragt.

Drupal - Installation - Website
Drupal – Installation – Website

Drupal 8 ist nun vollständig installiert und Deutsch lokalisiert. Der Administrator ist automatisch eingeloggt und kann die Website nun gestalten und mit Inhalt füllen.

Drupal - Installation - Erfolg
Drupal – Installation – Erfolg

Die Bedienung entspricht weitgehend der Vorgehensweise aus Drupal 7 und so kann ich in kurzer Zeit ein paar statische Seiten und ein Kontaktformular für seafolly.ch erstellen.

seafolly.ch jetzt auf Drupal 8
seafolly.ch jetzt auf Drupal 8

Links


tl;dr: Drupal 8 ist erscheinen und bringt frischen Wind ins Content Management Lager.

Kategorien
Allgemein Shared Hosting

Laravel Framework im Webhosting Paket nutzen

Laravel ist ein PHP-basiertes Free and Open Source Framework mit dem man Web-Applikationen entwickeln kann.
Der Slogan von Laravel ist

The PHP Framework for web artisans

Laravel gilt momentan als eines der populärsten PHP-Frameworks. Es versucht, Ideen aus Ruby on Rails und .NET in die PHP Welt zu bringen und macht damit den PHP Code sauberer und strukturierter. Interessante Features von Laravel in diesem Zusammenhang:

  • Laravel nutzt das Model, View, Controller Modell
  • Es nutzt die PHP Paketverwaltung Composer
  • Eloquent ORM ist eine PHP Implementierung des Active Record Entwurfsmusters. Es repräsentiert Datenbanktabellen als Klassen und erlaubt dadurch beispielweise Datenbankabfragen „einfach“ zu programmieren. Wenn am entsprechenden Objekt etwas geändert wird, wird es auch in der Datenbanktabelle geändert.
  • Blade ist eine sehr übersichtliche und leistungsfähige Template Engine.
  • Migrations ist ein Versionskontrollsystem für Datenbankstrukturen und erleichtert das Deployment.
  • Das Artisan Kommandozeilentool bietet viele Befehle, die den Umgang mit Laravel erleichtern, um beispielsweise Update und Migrationsprozesse zu managen. Unit Tests sind ein fester Bestandteil des Frameworks und können über Artisan ausgeführt werden.

Es gibt zahlreiche weitere Features, die Sie so nach und nach entdecken und nutzen können.
Und das Beste: Laravel lässt sich in einem „normalen“ Webhosting Paket von Novatrend per Installatron installieren.

Installation Laravel

Rufen Sie in der cPanel Verwaltung das Installatron auf und wählen Laravel aus.

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

cPanel - Installatron - Laravel Framework
cPanel – Installatron – Laravel Framework

Installieren Sie Laravel in einem eigenen Verzeichnis. Dieses Verzeichnis wird unterhalb des public_html Verzeichnisses angelegt und je nach Verwendungszweck können Sie Ihre Domain auf dieses Verzeichnis zeigen lassen.

cPanel - Installatron - Laravel Framework - Konfiguration
cPanel – Installatron – Laravel Framework – Konfiguration

Wenn Sie nun im Browser http://ihre-domain/ihr-verzeichnis aufrufen, so sehen Sie die Default Seite des Laravel Frameworks.

Laravel 5 - Startscreen
Laravel 5 – Startscreen

Loggen Sie sich nun mittels SSL auf der Konsole ein (siehe dazu auch Root-Server – ich bin drin) und wechseln Sie in das Unterverzeichnis /public_html/laravel. Lassen Sie sich die installierten Dateien mit dem Befehl ls -l anzeigen, um einen Überblick zu erhalten. Das Ansehen der Dateien können Sie auch per FTP machen. Mit einer SSL Verbindung können Sie allerdings auch Kommandos ausführen.

seafoll1@srv11 [~/public_html/laravel]# ls -l
total 204
drwxr-xr-x 11 seafoll1 seafoll1   4096 Oct 26 15:13 ./
drwxr-x--- 10 seafoll1 nobody     4096 Oct 26 16:55 ../
-rw-r--r--  1 seafoll1 seafoll1    351 Oct 26 15:13 .env
-rw-r--r--  1 seafoll1 seafoll1    307 Aug 30 13:31 .env.example
-rw-r--r--  1 seafoll1 seafoll1     61 Aug 30 13:31 .gitattributes
-rw-r--r--  1 seafoll1 seafoll1     57 Aug 30 13:31 .gitignore
-rw-r--r--  1 seafoll1 seafoll1     76 Oct 26 15:13 .htaccess
drwxr-xr-x 10 seafoll1 seafoll1   4096 Aug 30 13:31 app/
-rw-r--r--  1 seafoll1 seafoll1   1646 Aug 30 13:31 artisan
drwxr-xr-x  3 seafoll1 seafoll1   4096 Aug 30 13:31 bootstrap/
-rw-r--r--  1 seafoll1 seafoll1   1201 Aug 30 13:31 composer.json
-rw-r--r--  1 seafoll1 seafoll1 105047 Sep  2 10:08 composer.lock
drwxr-xr-x  2 seafoll1 seafoll1   4096 Aug 30 13:31 config/
drwxr-xr-x  5 seafoll1 seafoll1   4096 Aug 30 13:31 database/
-rw-r--r--  1 seafoll1 seafoll1    503 Aug 30 13:31 gulpfile.js
-rw-r--r--  1 seafoll1 seafoll1   1780 Oct 26 15:13 index.php
-rw-r--r--  1 seafoll1 seafoll1    159 Aug 30 13:31 package.json
-rw-r--r--  1 seafoll1 seafoll1     87 Aug 30 13:31 phpspec.yml
-rw-r--r--  1 seafoll1 seafoll1    899 Aug 30 13:31 phpunit.xml
drwxr-xr-x  2 seafoll1 seafoll1   4096 Aug 30 13:31 public/
-rw-r--r--  1 seafoll1 seafoll1   1928 Aug 30 13:31 readme.md
drwxr-xr-x  5 seafoll1 seafoll1   4096 Aug 30 13:31 resources/
-rw-r--r--  1 seafoll1 seafoll1    567 Aug 30 13:31 server.php
drwxr-xr-x  5 seafoll1 seafoll1   4096 Aug 30 13:31 storage/
drwxr-xr-x  2 seafoll1 seafoll1   4096 Aug 30 13:31 tests/
drwxr-xr-x 28 seafoll1 seafoll1   4096 Sep  2 10:08 vendor/

Laravel hat ein Command-line Interface namens Artisan. Es beschleunigt viele Arbeiten enorm. Rufen Sie es auf und schauen Sie die Befehle durch.

seafoll1@srv11 [~/public_html/laravel]# php artisan
Laravel Framework version 5.1.12 (LTS)
...
...
...

Erste Schritte

Ich zeige ein kleines Beispiel, um Ihnen den Einstieg in Laravel zu erleichtern.

Ich möchte gern aus dem Bootstrap CSS Framework ein Layout nutzen und Laravel soll den Inhalt dafür erzeugen. Das ist das Prinzip eines jeden Content Management Systems und kann beliebig um Formulare, Benutzerregistrierungen und viele andere Dinge erweitert werden. Das Beispiel ist ein kleiner Teil des Laravel Anfänger Tutorials von Dirk Helbert. In seinem Blog finden Sie weitere Beispiele.

Worum geht es?

In diesem Beispiel arbeiten wir mit der Blade Template Engine.

Aus dem Verzeichnis /public wird Ihre Webapplikation gestartet. Nach der Laravel Installation finden Sie dort unter anderem die index.php Datei, die als Einstieg für Ihre Webapplikation fungiert. In diesem Verzeichnis befinden sich auch alle öffentlichen Resourcen, wie Grafiken und CSS Dateien.

Die Datei, die die Informationen (HTML Code) für die Laravel Startseite enthält, liegt im Ordner /resources/views und heisst welcome.blade.php.

Wir wollen diese Datei verändern (mit den Daten aus dem Bootstrap Beispiel) und dann eine neue Datei namens app.blade.php erzeugen, die das Layout enthält. Nach den Änderungen sieht die Startseite dann etwa so aus:

Beispielseite basierend auf Bootstrap
Beispielseite basierend auf Bootstrap

Bootstrap Code

Laden Sie zunächst das Bootstrap Source Code Paket von der Downloadseite (http://getbootstrap.com/getting-started/#download)

Bootstrap - Download
Bootstrap – Download

Legen Sie im Laravel Verzeichnis public ein Unterverzeichnis bootstrap an und kopieren Sie dort den Inhalt aus dem Bootstrap Verzeichnis dist hinein. Die Verzeichnisstruktur sieht dann so aus:

public/bootstrap/css   //mehrere Dateien
public/bootstrap/fonts //mehrere Dateien
public/bootstrap/js    //mehrere Dateien

Legen Sie im Laravel Verzeichnis public ein weiteres Verzeichnis mit dem Namen css an. Kopieren Sie die Datei sticky-footer-navbar.css aus dem Bootstrap Verzeichnis docs/examples/sticky-footer-navbar in das Laravel Verzeichnis public/css und benennen Sie sie um in style.css.

public/css/style.css   //die umbenannte sticky-footer-navbar.css

Wechseln Sie nun in das Laravel Verzeichnis resources/views. Kopieren Sie die Datei index.html aus dem Bootstrap Verzeichnis docs/examples/sticky-footer-navbar in das Laravel Verzeichnis resources/views und benennen Sie sie um in app.blade.php.

resources/views/app.blade.php //die umbenannte index.html

Passen Sie die ../.. Pfade zu den Bootstrap-Dateien im HTML Code der app.blade.php auf Ihr Dateisystem an, fügen Sie den Verweis auf die Stylesheet Datei ein (und vergessen Sie auch die JavaScript Dateipfade am Ende der Datei nicht 🙂 )

<!-- Bootstrap core CSS -->
<link href="public/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="public/css/style.css" rel="stylesheet">
...
...
<script src="public/bootstrap/js/bootstrap.min.js"></script>

Nach dem Kommentar <!– Begin page content –> befindet sich ein div Tag mit der Klasse Container. Enfernen Sie den Inhalt zwischen dem öffnenden und schliessendem div Tag und fügen stattdessen den Befehl @yield(‚content‘) ein. Der Befehl fügt später den gewünschten Inhalt ein. Die Datei enthält nun das Layout, der eigentliche Inhalt kommt aus einer anderen Quelle hinzu.

...
<!-- Begin page content -->
<div class="container">
   @yield('content')
</div>
...

Die Quelle des Inhalts befindet sich in der Datei welcome.blade.php. Löschen Sie den bestehenden Inhalt und fügen Sie folgenden Code ein:

@extends('app')
@section('content')
<div class="page-header">
  <h1>Inhalt aus der <code>welcome.blade.php</code> Datei</h1>
</div>
<p class="lead">Beispieltext ...</p>
@endsection

Datei: welcome.blade.php

Der Code ist recht selbsterklärend und lässt ein wenig die Faszination von Laravel erahnen. Der Befehl @extends(‚app‘) erweitert die app.blade.php um den Text zwischen @section(‚content‘) und @endsection. Hier nochmal der genaue Verezichnispfad für diese Datei:

resources/views/welcome.blade.php

Wenn Sie nun die Startseite von Laravel im Browser aufrufen, sieht sie folgendmassen aus:

Beispielseite basierend auf Bootstrap
Beispielseite basierend auf Bootstrap

Genauso elegant wie in der Template Engine lassen sich nun andere Teile Ihrer Site aufbauen (Navigation, Benutzeranmeldung, Datenbankverbindungen, etc). Falls Sie bereits Erfahrungen mit PHP haben, sollten Sie sich Laravel unbedingt ansehen.

Links:


tl;dr: Wenn Sie bereits ein wenig Erfahrung mit PHP haben, werden Sie an Laravel viel Freude haben!

Kategorien
seafolly.ch Shared Hosting

cPanel Installatron – News aus der Kunst auf Planet Seafolly mit Selfoss

Heute wollen wir mehrere Dinge kombinieren.
Innerhalb unseres Kunstprojekts seafolly.ch wollen wir externe Inhalte zum Thema Kunst kuratieren, einlesen und als Planet Seafolly unter seafolly.ch/news bereitstellen. Planet Seafolly soll auch selbst als Feed wieder einbindbar sein. Die Installation soll über das cPanel Installatron erfolgen und wir werden dazu den Feed Reader Selfoss benutzen.

Installation

Als Novatrend Hosting Kunde kennen Sie cPanel. Rufen Sie die Oberfläche auf und klicken Sie im Bereich Software auf den Link Installatron Applications Installer.

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

cPanel - Installatron
cPanel – Installatron

Sie landen im Installatron Anwendungsbrowser, der Ihnen zahlreiche Webapplikationen (Content Management Systeme, Blogs, Wikis, Foren, Bilder Galerien, Shop Systeme) zur Auswahl anbietet. Sie können diese Webapplikationen „per Klick“ installieren.

In unserem konkreten Fall haben wir auf seafolly.ch bereits das CMS Yellow im Hauptverzeichnis /public_html installiert und wollen zusätzlich in einem separaten Unterverzeichnis die Webapplikation Selfoss installieren.

cPanel - Webapplikationen
cPanel – Webapplikationen

Selfoss ist ein komfortabler RSS-Reader, der auch über eine Mobile App konfigurierbar ist (siehe auch Feed reloaded – der Selfoss Feed Reader hier im Blog). Selfoss kann auch so konfiguriert werden, dass neue Feeds nur von autorisierten Nutzern hinzugefüget werden können, jeder Besucher aber die Inhalte sehen kann. Genau dieses Verhalten benötigen wir für unseren Planet Seafolly.

cPanel - Selfoss
cPanel – Selfoss

Klicken Sie auf den Diese Applikation installieren Button und füllen Sie das Formular aus.

cPanel - Installation Selfoss
cPanel – Installation Selfoss

Klicken Sie anschliessend auf den Installieren Button. Das Installatron installiert nun Selfoss und listet es in den installierten Anwendungen auf.

cPanel - Installatron - installierte Anwendungen
cPanel – Installatron – installierte Anwendungen

Unter seafolly.ch/planet befindet sich nun die Selfoss Installation, an der wir noch etwas Feintuning vornehmen müssen. Die Änderungen müssen in der Datei config.ini vorgenommen werden. Sie können die Änderungen ebenfalls über cPanel abwickeln, indem Sie in die Dateiverwaltung wechseln.

cPanel - Dateiverwaltung
cPanel – Dateiverwaltung

Rufen Sie die Datei config.ini im Code-Editor auf und passen die markierten Zeilen an.

cPanel - Code Editor
cPanel – Code Editor
  • Zeile 18|public=1 – Besucher können die Inhalte lesen ohne eingeloggt zu sein
  • Zeile 19|html_title – Planet seafolly – Der Titel, der im Browsertab angezeigt wird
  • Zeile 20|rss_title – Planet seafolly – Der Titel, der im Feed angezeigt wird (seafolly.ch/planet/feed) im Browsertab angezeigt wird
  • Zeile 25|language=de – Deutsche Sprachversion
  • Zeile 30|allow_public_update_access=1 – Da wir einen Passwortschutz gesetzt haben, müssen wir den Feed-Aktualisierungsvorgang öffentlich zugänglich machen, ansonsten funktioniert der Cron-Job nicht

Speichern Sie die Datei ab.

Als letzten Schritt müssen wir einen Cron-Job einrichten, der die Feeds regelmässig aktualisiert (Mit Cron-Jobs via cPanel immer aktuell sein).

Planet seafolly
Planet seafolly

Fazit

Mit der Hilfe des Installatrons können Sie auf einfache Weise Webapplikationen installieren.
Als Ergebnis haben wir in diesem Fall die Inhalte unterschiedlicher Feeds jetzt öffentlich zugänglich unter der URL https://seafolly.ch/planet/ und ein Feed dieser Inhalte unter https://seafolly.ch/planet/feed/.
Benutzer, die die Zugangsdaten kennen, können weitere Feeds hinzufügen.

Wenn Sie über Kunst schreiben, melden Sie sich doch bei uns, wir fügen Ihr Feed hinzu.


tl;dr: Kuratieren Sie doch mal einen „Inhaltsplaneten“