Header Homepages für Zikula Header Homepages für Zikula Dein Blog rund um Zikula
Werbung

Startseite»Blog»Php Webseite erstellen Tutorial
Werbung

Php Webseite erstellen Tutorial

Bild

Website mit PHP

Eine Webseite mit PHP zu betreiben hat den Vorteil, dass Du jederzeit neue Inhalte auf Deiner Homepage erstellen kannst.

Grundsätzlich gibt es 2 Möglichkeiten, eine PHP Homepage umzusetzen. Du kannst alles selbst programmieren oder Du nutzt Zikula.

Zikula ist beides. Ein Content Management System und ein Toolkit zur Programmierung mit Php.

In dieser Artikelserie möchte ich grundlegende Möglichkeiten von Zikula vorstellen, mit Php eine Homepage umzusetzen.

Grundlage ist natürlich die Installation von Zikula. Du kannst Dir hier im Downloadbereich aktuelle Versionen von Zikula herunterladen. Eine Installation zeige ich exemplarisch mit Zikula 1.4.4. Eine Installation mit den Versionsreihen 1.5.x und 2.0.x ist identisch zu bewerkstelligen.


Ist die Installation von Zikula für Dich erfolgreich verlaufen, geht es an die Installation von notwendigen Modulen auf der einen Seite und um die Anpassung des Layouts auf der anderen Seite.

Layout Deiner Seite

Sidebar Adminbereich

Im folgenden möchte ich Dir etwas zu den sogenannten Themes vermitteln.

Themes steuern das Aussehen Deiner Homepage im Backend- und im Frontend-Bereich.

Es ist grundsätzlich möglich, dasselbe oder verschiedene Themes für das Backend und das Frontend zu nutzen.

 

Administration des Layouts

Wenn Du in Deine Seite eingeloggt bist, bekommst Du den Icon(Bild 1, Pfeil) zu sehen. Wenn Du diesen anklickst, bekommst Du Zugang zum Administrationsbereich (Backend). Es öffnet sich eine Sidebar (Bild 2), wenn Du Javascript in deinem Browser aktiviert hast.

Link zum Theme Module

In der Sidebar werden sämtliche Administrationsbereiche angezeigt. Wenn Du in diesem Bereich nach unten scrollst (Bild 3), findest Du einen Link 'Theme Module'.

Durch Anklicken des Links gelangst Du in den Admin-Bereich für das Layout. Es wird Dir eine Liste sämtlicher Themes angezeigt, die Zikula von sich aus mitbringt (Bild 4).

Neben einem Atom-Theme (für Anzeige eines Atom-Feeds), einem RSS-Theme (RSS-Feed) und einem Printer-Theme ( Zur Druckanzeige) findest Du 3 voll nutzbare Themes.

 

Theme Liste im Backend

Zikula nutzt Bootstrap für das Layout

Der rote Stern neben dem Namen des Bootstrap-Themes zeigt Dir, dass dieses Theme aktiv ist und zur Anzeige im Backend und Frontend genutzt wird.

Damit nutzt Zikula Bootstrap zur optischen Gestaltung und Du kannst auf sämtliche Möglichkeiten von Bootstrap zugreifen.

 

Anderes Theme aktivieren

Anderes Theme (SeaBreeze) aktivieren

Du kannst über den grünen Haken (Bild 5, Pfeil) auf ein anderes Theme umstellen.

 

Sciherheitsabfrage vor Theme UmstellungWenn Du diesen anklickst, bekommst Du eine Sicherheitsabfrage (Bild 6), ob Du das Theme wirklich umstellen möchtest.

Bei der Bestätigung kannst Du noch entscheiden, ob Einstellungen von anderen Usern überschrieben werden sollen.

Anderes Theme aktiviert

Wenn Du auf akzeptieren klickst, wird das neue Theme geladen und Dein Backend sieht ein wenig anders aus (Bild 7). Du hast nun sowohl für das Backend als auch das Frontend das Theme 'SeaBreeze' aktiviert.

 

Backend und Frontend mit verschiedenem Layout

Link zum Admin PanelMöchtest Du das anders haben, also verschiedene Layouts, dann wechselst Du ins Admin-Panel.

Dazu klickst Du den Link System an und findest einen Link 'Admin-Panel' (Bild 8).

 

Das Admin Panel

Hast Du diesen angeklickt, kommst Du nach kurzer Zeit (hoffentlich) in den Admin-Panel (Bild 9).

 

Nach Klick auf Konfiguration Option Theme für Administration Dort klickst Du auf Konfiguration und kannst dort etwas weiter unten das Theme für den Adminbereich auswählen.

 

Änderungen weiter unten speichernKleiner Tipp. Ich setze hier grundsätzlich auf Bootstrap zurück oder stelle das schon vorher ein.

 

Bootstrap im Backend

Wenn Du diese Einstellung weiter unten bestätigst, wird Dein Backend wieder mit dem Bootstrap-Theme angezeigt.

 

SeaBreeze im Frontend

SeaBreeze im Frontend

Im Frontend findet sich weiterhin das SeaBreeze-Theme aktiviert.

 

Du solltest nun in der Lage sein, ein Layout für Dein Backend und Dein Frontend einzustellen.

In der Regel wird man ein vorhandenes Theme nutzen, um daran sein eigenes Layout zu entwickeln. Wie Du das Standard Bootstrap Layout kopierst und als Grundlage für Dein eigenes Layout vorbereitest, zeige ich nächsten Tutotrial; vielleicht auch in einem Video.

Wenn Dir dieses Tutorial gefällt, schreibe gerne in die Kommentare.

 | 


Werbung

Noch keine Kommentare vorhanden.

Neuen Kommentar hinzufügen