Helix Ultimate -3-

Ziel mit dem Einsatz von Helix

Du brauchst kein komplexes Portal.
Du brauchst eine klare, ruhige Struktur.

Deine Stärke sollte sein:

  • Saubere Umsetzung
  • Strukturierte Navigation
  • Verständliche Inhalte

Nicht:
Design-Show.

Fertige Startseiten-Struktur (seriös & professionell)

Ziel: klar, ruhig, kein Spielzeug-Design.

Layout im Helix Layout Builder

Header

  • Logo links
  • Hauptmenü rechts
  • Optional: Suchmodul

Hero-Bereich

  • Überschrift
  • Kurzer Einführungstext
  • Button („Mehr erfahren“)

Hauptbereich

  • Component (für Beiträge)
  • 3 Spalten mit Themen
  • Aktuelle Beiträge Modul

Service-Bereich

  • 4 Icons mit Kurztext
  • Kontakt-Teaser

Footer

  • 3–4 Spalten:
    • Impressum
    • Datenschutz
    • Kontakt
    • Social Links

So baust du das konkret

Backend: https://joomla6.rneuhoff.de/administrator
 Gehe zu: System → Templates → Helix Ultimate → Layout Builder

 
  1. Neue Row anlegen Zeile
  2. Column-Struktur wählen (z. B. 3x 4er-Spalten)
  3. Modulposition einfügen
  4. Module erstellen und zuweisen

Wichtig:
Der Bereich „component“ muss aktiv bleiben – sonst wird kein Inhalt angezeigt.


Saubere Sidebar-Konfiguration (kein Zurückspringen)

Das Problem entsteht fast immer durch falsche Menüzuweisung.

Inhalte → Module → Neu

  1. Position wählen (z. B. sidebar)
  2. Menüzuweisung → „Nur auf ausgewählten Seiten“
  3. Die gewünschten Menüeinträge anhaken
  4. Speichern

Fertig.


 Typischer Fehler

❌ Modul steht auf „Auf allen Seiten“
→ erscheint überall

❌ Menüeintrag ist falsch als Startseite markiert
→ Weiterleitungen wirken komisch

Template-Pfad für eigene Anpassungen

Update-sicheres CSS: /media/templates/site/shaper_helixultimate/css/custom.css
Nicht hier ändern: /templates/shaper_helixultimate/ (Das wird bei Updates überschrieben.)


Typische Anfängerfehler mit Helix

Fehler 1 – Zu viele Effekte

Animationen, Slider, Parallax.
Sieht modern aus, wirkt aber unruhig.

Fehler 2 – Struktur ohne Planung

Einfach Rows anlegen ohne Konzept.
Ergebnis: Chaos.

Vorher Skizze machen.

Fehler 3 – Farben ohne Kontrast

Hellgrau auf Weiß ist unlesbar.
Institutionelle Seiten brauchen klare Kontraste.

Fehler 4 – Cache vergessen

Nach Änderungen nichts sichtbar?
System → Wartung → Cache leeren.

Fehler 5 – Direkt im Template ändern

Alles gehört in: /media/templates/site/shaper_helixultimate/css/custom.css 
Sonst ist es nach dem Update weg.


Besonderheiten von Helix

  • Layout Builder ersetzt klassische Positionslogik
  • Eigene Custom Code Felder (HTML, JS)
  • Mega-Menü integriert
  • Responsive automatisch

Aber:

Helix ist nur ein Werkzeug.
Struktur kommt von dir.


Komplette Installations-Übersicht (kurz & sauber)

  1. ZIP herunterladen von https://www.joomshaper.com/helix
  2. Backend öffnen https://joomla6.rneuhoff.de/administrator 
  3. System → Erweiterungen → Installieren
  4. ZIP hochladen
  5. System → Templates → Als Standard festlegen
  6. Layout Builder konfigurieren

Fertig.


🎯 Ziel deiner Website

Eine seriöse, ruhige Präsentationsseite, die zeigt:

  • Wer du bist
  • Was du machst
  • Welche Projekte du umgesetzt hast
  • Wie man dich erreicht

Kein überladenes Design. Keine Spielereien. Klare Struktur.


1️⃣ Seitenstruktur (einfach & professionell)

Hauptmenü

  1. Start
  2. Über mich
  3. Projekte
  4. KI & Experimente
  5. Kontakt

Mehr brauchst du nicht.


2️⃣ Startseite – konkrete Helix-Struktur

Im Layout Builder:

Header

  • Logo oder dein Name
  • Hauptmenü rechts
  • Optional: kleines Suchfeld

Hero-Bereich

Große Überschrift:
Kurzer Text darunter:
Button:


Bereich 1 – Deine Kompetenz

3 Spalten:

  • Joomla 6 Einrichtung
  • Template-Anpassungen
  • KI-Integration

Jeweils:
Icon + kurze Beschreibung

Bereich 2 – Aktuelle Projekte

Modul „Beiträge – Kategorie Projekte“
Max. 3 Einträge.

Bereich 3 – Kontakt-Teaser

Kurzer Text:
Button:

Footer

3 Spalten:

  • Kurzprofil
  • Navigation
  • Impressum / Datenschutz

3️⃣ Design-Richtlinien (wichtig)

Halte dich an:

  • Weißer Hintergrund
  • Dunkelgraue Schrift
  • Eine Akzentfarbe (z. B. Blau)
  • Keine Animationen
  • Keine Slider
  • Keine 5 Schriftarten

Helix → Typography: Nur eine Hauptschrift.
Helix → Colors: Eine Primärfarbe.

Fertig.


4️⃣ Technische Struktur (sauber arbeiten)

Update-sicheres CSS:  /media/templates/site/shaper_helixultimate/css/custom.css
Backend-Zugang: https://deinedomain.de/administrator
Template-Ordner: /templates/shaper_helixultimate/

Dort nichts direkt ändern.

5️⃣ Module richtig einsetzen

Beispiel: „Projekte Sidebar“ nur auf Projektseiten anzeigen:
Modul → Menüzuweisung → Nur ausgewählte Seiten → Projekte anhaken.

Sonst erscheint es überall.


Realistische Besonderheiten

Mit Helix kannst du:

✔ Layout schnell umbauen
✔ eigene CSS-Regeln einfügen
✔ Mega-Menü nutzen
✔ mobil optimieren

Aber:

  • Ohne klare Struktur wird es unruhig
  • Zu viele Module machen es chaotisch
  • Zu viele Farben wirken unseriös

Minimaler Installations-Ablauf

  1. Helix ZIP herunterladen https://www.joomshaper.com/helix
  2. Backend → System → Erweiterungen → Installieren
  3. ZIP hochladen
  4. Als Standard setzen
  5. Layout Builder strukturieren
  6. Menü anlegen
  7. Module zuweisen

Fertig.