Archiv der Kategorie: Einfache Seiten

Dropdown-Menüs: nur mit dem richtigen Theme

Als Drupal-Neuling stolpert man ganz schnell darüber, dass es erstmal nicht möglich ist, ein Dropdown-Menü einzurichten. Das ist im Standard-Theme Bartik und im ebenfalls mitgelieferten Theme Garland auch gar nicht vorgesehen! Man braucht ein Theme das diese Option von Haus aus mitliefert, eines wäre zum Beispiel Marinelli. Dann aber ist die Sache ganz einfach. Also, installieren sie sich Marinelli und Nice Menus und dann kanns losgehen.

Mega-Menu einschalten

Design->Marinelli->Einstellungen->Primary Menu settings Which kind of primary links do you want to use? auf Mega Drop Down stellen.

Dann ein paar Basic Pages mit Menüeinträgen erstellen, Reihenfolge und Anordnung können über Struktur->Menüs->Main Menu noch eingestellt werden.

untermenues
untermenues

Block positionieren

Den Block Nice Menu 1 auf die Position Utility Menu Top setzen.

nicemenu
nicemenu

Und so sieht das dann aus:

kochbuchmenu
kochbuchmenu

Drupal und die Bilder – ich geb ihm noch ’ne Chance

Die Bildverwaltung in Drupal ist etwas versteckt und gewöhnungsbedürftig, man kann aber letztendlich doch viel damit machen, deswegen schauen wir uns die Sache noch einmal genauer an.

Wenn man in Drupal ein Bild hochlädt, wird dieses skaliert und im Dateisystem mehrfach abgelegt. Standardmässig sind folgende Skalierungsoptionen aktiv:

Konfiguration->Medien->Bildstile

bildstile
bildstile

Man kann hier auch einen oder mehrere eigene Bildstile anlegen, ich hab mir hier mal einen mit der Breite 50 px und dem Effekt „Skalierung“ genommen und ihn Briefmarke genannt.

Bildanzeige: Steuerung über Inhaltstyp

Wann welcher der angelegten Bildstile verwendet wird, wird über die Inhaltstypen (!) gesteuert.  Suchen sie sich einen Inhaltstyp heraus, dem bereits ein Image-Field zugeordnet ist,oder legen sie es neu an. Ich nehm mal den „article“. Über Struktur->Inhaltstypen->Artikel->Anzeige verwalten gelangt man in ein Auswahlmenü, in dem man die Bildstile für die Anzeigemodi Standard und Anriss festlegen kann.  Ich ändere das mal im Anrisstext auf meinen selbstdefinierten Bildstil Briefmarke. Ergebnis in der gekürzten Ansicht:

vorschau_briefmarke
vorschau_briefmarke

In der Seitenansicht bleibt es beim „grossen“ Bild mit dem voreingestellten Format „Large (480×480)“.

vorschau_large
vorschau_large

Weitere Einstellungsmöglichkeiten

Über Struktur » Inhaltstypen » Article » Felder verwalten kann man bei EINSTELLUNGEN FÜR DAS IMAGE-FELD beim Punkt Anzahl von Werten einstellen, wie viele Bilder maximal zu einem Artikel hochgeladen werden können, Default ist hier 1. Wie die Bilder dann im Artikel angezeigt werden kommt auf den voreingestellten Bildstil an. Mehrere eingefügte Bilder werden untereinander angezeigt, auch wenn sie theoretisch nebeneinander Platz hätten, das finde ich weniger schön. ( Anmerkung: Man kann sicher ins CSS eingreifen, aber ich glaube, das lässt sich auch über Views lösen)

Man kann hier auch die Option „Bildtitel“ mit aktivieren, das ergibt dann später einen Hovertext bei der Bildanzeige auf der Webseite. Ebenso kann man ein Default-Bild einstellen, eine maximale und minimale Bildauflösung einstellen und eine maximale Upload-Grösse definieren.

Es hat auch Vorteile

Man ist es ja von WordPress her gewohnt, Bilder überall und in jeder gewünschten Grösse in einen Beitrag oder auf einer Seite einfügen zu können. Die restriktivere Steuerung über Bildstile in Drupal hat vielleicht den Vorteil, dass für einen bestimmten Inhaltstyp immer ein einheitliches Layout verwendet wird.  Ausserdem hat man hier im Gegensatz zu WordPress noch eine Chance, den Alt-Text und den Titel für jedes Bild im Nachhinein nochmal zu bearbeiten:

3_bilder
3_bilder

Wem das immer noch nicht genügt an Bild-Einstellmöglichkeiten, der braucht ein oder mehrere Zusatzmodule. Eines der am meisten empfohlenen ist Insert https://www.drupal.org/project/insert, ich habs aber auf meiner Testinstallation noch nicht zum Laufen gekriegt.

Bilder mit Views nebeneinander ausgeben

Neue View erstellen, z.B. „Bilder nebeneinander“. Anzeigen Inhalt of type Article, Create a page. Edit&Continue. Format Anzeigen Inhalt Fields, Felder Hinzufügen Inhalt (Bild), Bezeichnung leer machen, Bilddarstellung „Thumbnail“ auswählen. Wahlweise noch Fields hinzufügen Inhalt (Body), Bezeichnung entfernen. Das sollte dann in etwa so aussehen (der erste Artikel hat nur 1 Bild):

drei_bilder_nebeneinander
drei_bilder_nebeneinander

Ich sags ja, mit Views geht fast alles!

Inhaltsverzeichnis A-Z mit Links

Ich hatte im ersten Ansatz die Funktion drupal_get_path_alias($node) verwendet, noch g’wandter aber gehts mit url($node). Da die gesamte Inhaltsverzeichnis-Funktion nicht besonders kompliziert ist, hier mal der komplette Code:

function ivz_kompakt(){
    
    $alfa = array(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z);
    foreach ($alfa as $akt_buchstabe){
    
            $buchstabe = $akt_buchstabe;
            
            $anzahl = db_query("SELECT nid, title, type, status from node where title like '".$buchstabe."%' order by title");
            $records = $anzahl->fetchAll();
            $gefunden = count($records);
            
            if ($gefunden == 1) {
            echo "<h2>".strtoupper($buchstabe)." ".$gefunden." Rezept</h2><br>";
            }
            
            if ($gefunden > 1) {
            echo "<h2>".strtoupper($buchstabe)." ".$gefunden." Rezepte</h2><br>";    
            }
            
            if ($gefunden > 0){
                        
                foreach ($records as $record) {
            
                      $akt_id = $record->nid;
                      //echo $record->title."<br>";
                      $url = url('node/' . $akt_id);
                      //echo $url."<br>";
                      echo "<a href = '".$url."'>".$record->title."</a><br>";
                                        
                } //end foreach
            } // end gefunden > 0
    }    // end alfa
    
} //end function ivz_kompakt

Was hab ich gemacht? Ich bastel mir zuerst mal ein Array mit allen Buchstaben des Alfabets. Durch dieses Array steppe ich mit einem foreach durch, und der aktuelle Buchstabe kommt jeweils in unsere Query, und mit count() wird die Anzahl der gefundenen Datnsätze abgefragt:

 $anzahl = db_query("SELECT nid, title, type, status from node where title like '".$buchstabe."%' order by title");
$records = $anzahl->fetchAll();
            $gefunden = count($records);

Dann frage ich mit if ab, ob einer oder mehr als ein Artikel gefunden wurde und gebe dementsprechend aus „1 Rezept“ oder „X Rezepte“.
Wenn ich mehr als 0 Beiträge mit meiner Query gefunden habe, steppe ich durch diese wieder mit einem foreach durch. Ich hole mir mit der nid aus der Query die URL des aktuellen Beitrags:

$akt_id = $record->nid;
$url = url('node/' . $akt_id);

Und bastle mir daraus den Link zum Rezept.

echo "<a href = '".$url."'>".$record->title."</a><br>";

Das wars! Ich hab jetzt mal in der Query noch nicht die Einschränkung auf Where status=1 und type = blog gemacht, weil ich ein bisschen Material zum Ausgeben haben wollte und so einfach alle Nodes alfabetisch ausgebe, die Where-Klausel kann sich jeder selber anpassen. Mein Output sieht ganz sauber so aus:

ivz_kompakt
ivz_kompakt

Schicke Sache, nicht wahr? Das ist 1:1 mein Inhaltsverzeichnis wie im Original-Inselfisch-Kochbuch. Jetzt lege ich mir noch einen neuen Menüpunkt vom Typ einfache Seite an, stelle den Textfilter auf PHP-Code und platziere dort meinen Funktionsaufruf:

<?php ivz_kompakt();?>

Fertig! Also, ich muss sagen, das mit dem Einbinden eigener Funktionen über das simple Modul nach diesem Muster macht einem die Arbeit echt einfach, das gefällt mir sehr gut.

Jetzt wärs natürlich schick, wenn wir mehr Rezepte zum Ausgeben hätten, aber ich hack die nicht per Copy&Paste rein. Ich geh mal suchen, wie es mit den Import-Fähigkeiten von Drupal aussieht, und melde mich dann wieder mit einem neuen Beitrag.

 

Die ersten Inhalte, und das erste Modul: CKEditor

Um einen WYSIWYG-Editor ähnlich wie in Joomla oder WordPress zu erhalten, kann man sich das Modul CKEditor installieren, sie finden es hier: https://www.drupal.org/project/ckeditor

Unter Module->Installieren die ZIP-Datei anwählen, nach der Installation die Aktivierung nicht vergessen, der Editor findet sich ganz am Ende der Liste unter „Benutzeroberfläche“.

ckeditor_aktivieren
ckeditor_aktivieren

(Anmerkung: auf meiner Testinstallation läuft der CKEditor nur mit Google Chrome, unter Firefox gibts Probleme…)

Inhaltstypen

Standardmässig bringt Drupal zwei Inhaltstypen mit:  Artikel und einfache Seite. Artikel sollen lt. Doku überall da verwendet werden, wo vom Benutzer eine Interaktion erwartet wird (Kommentar). Die einfachen Seiten verwendet man für quasi-statische Seiten wie z.B. die Willkommen-Seite oder auch das Impressum.  Drupal hat auch noch andere Inhaltstypen an Bord, die nach Aktivierung der entsprechenden Module angeboten werden, und man kann auch eigene Inhaltstypen anlegen, aber dazu später mehr. Wir passen uns jetzt erstmal den Inhaltstyp „Einfache Seite“ an, denn wir wollen:

Bilder einbinden, die Erste

Das geht nämlich so ohne weiteres erstmal nicht. Wir müssen erstmal das Feld für die Bilder zur einfachen Seite hinzufügen. Das geht unter Struktur->Inhaltstypen->einfache Seite->Felder verwalten. Dort das vorhandene Feld „Bild: field_image“ auswählen und diese Option speichern.

feld_image
feld_image

Wenn wir jetzt über Inhalte hinzufügen eine neue einfache Seite erstellen, gibt es unterhalb des Editorfensters einen zusätzlichen Punkt Images, über den eine Bilddatei hochgeladen werden kann. Das Feld für den Alt-Text kann man leicht übersehen, es gibt auch keine Fehlermeldung wenn es nicht ausgefüllt wird, das Bild wird halt dann mit leerem Alt-Attribut in der Seite angezeigt. Auch Einstellmöglichkeiten für einen Titel oder eine Beschriftung oder dergleichen sucht man vergeblich, aber zur Bilderverwaltung in Drupal wird später noch mehr zu sagen sein.

Machen wir weiter mit unserer einfachen Seite.

Teaser und Bodytext

Wir bleiben erstmal im Beitragseditor. Das Feld Title ist selbsterklärend, darunter wird angezeigt:

Body (Zusammenfassung bearbeiten )

Man kann hier ähnlich wie in Joomla mit dem Weiterlesen-Tag einen Beitrag in eine Einleitung bzw. Zusammenfassung, auch Teaser genannt, und den eigentlichen Body Text aufteilen.  Es wird dann auf der Seite nur der Teaser und ein Weiterlesen-Button angezeigt, wie das im Einzelnen gesteuert wird, hängt letztlich vom Theme ab.

Menüeinstellungen

Wir können unserer einfachen Seite jetzt einen eigenen Menüpunkt zuordnen:

menueinstellungen
menueinstellungen

Dabei bestimmt die Gewichtung, in welcher Reihenfolge die Menüpunkte angezeigt werden. Wenn alles geklappt hat, müsste jetzt als zweiter Menüreiter der Eintrag „Rezeptbilder“ erscheinen.

rezeptbilder
rezeptbilder

NiceURLs muss man per Hand anlegen

In anderen CMS kriegt man sprechende URLs vorgeschlagen, in Drupal muss man sie manuell eintragen, das geht unter URL-Alias-Einstellungen.

niceurls
niceurls

Die kleine Mühe, hier eine URL-safe Vorgabe einzustellen hätten sich die Drupal-Entwickler schon machen können! Wenn man das nämlich nicht macht, bekommt man URLs nach dem Muster  http://ihresite/drupal/node/7, und das ist weder schön noch SEO-gerecht.

Auf die Art und Weise lege ich mir jetzt meine statischen Seiten der Reihe nach an. Wenn man übrigens für die Startseite einen eigenen Karteireiter haben möchte, muss man dies unter Struktur->Menüs->Link hinzufügen einrichten, hier einen Titel (z.B. Startseite) vergeben und als Link <front> eintragen.

Und was ist mit den Rezepten?

Das muss ich mir erstmal gut überlegen. Ob die in einem Blog besser aufgehoben sind, oder als eigener Inhaltstyp verwaltet werden sollen. Aber dazu gibt es einen neuen Beitrag.