JP QBar auf Helix Ultimate

  • Hallo Leute!


    Es geht wieder einmal um diese und diese Seite. Wobei die 2. Seite eine Kopie der 1. Seite ist und das Template von JP Qbar auf Helix Ultimate zu Testzwecken getauscht wurde.


    Es stören vor allem 2 Probleme;

    1. In den Beiträgen in der Mitte ist unmittelbar nach dem Piktogramm ein Zeilenumbruch

    Das Original sieht so aus

    und die Kopie so



    2. Die Beiträge werden aus für mich unerklärlichen Gründen eingezogen.


    Gibt es irgendwo Einstellungen die dieses Verhalten verursachen?


    Wolfgang

  • Gibt es irgendwo Einstellungen die dieses Verhalten verursachen?

    Hat einfach was mit Schriftgrößen, Zeilenhöhen, Margins usw. der beiden Blöcke (Bild und Text zu tun). Bei deinem Original hast halt "Glück", dass du eine Bildschirmgröße verwendest, wo der Text rechts gerade noch eben so am linken Block festhakelt.


    Hier z.B. Smartphone-Ansicht der Originalansicht:



    Deshalb bevorzuge ich (wenn ich darf) Bilder rechts (EDIT: oder drüber/drunter) statt links, um den Text-Lesefluss nicht zu stören..


    EDIT: Immer mal wieder im Firefox Extras > Web-Entwickler > Bildschirmgrößen testen verwenden, um Überraschungen und sinnloses Detailgefrickel zu vermeiden.

  • Ah OK, das mit dem Piktogram hab ich überlesen. Ist meins natürlich hinfällig ;-)

    Ist mir schon klar - unklar ist mir aber woher diese willkürlichen Einzüge kommen.

    Die verursachst du selber durch deine Inline-Stile, die du individuell in jedem dieser Blöcke setzt.


    Siehe mein Bild: Du hast ein Bild mit reichlich Inline-Stilen bestückt. Darunter z.B. ein margin-bottom (gelber Rand im Bild) Zusätzlich floatet das Bild links. Heißt für folgende Elemente, sie "hakeln am gelben Rand fest".


    Dein altes Template hat sich darum gekümmert, dass die Blöcke genügend Abstand haben und das float auflösen.


    Beim neuen wundere ich mich gerade, dass das zwar einige CSS-Klassen im HTML gestreut sind, aber im CSS-Datei und Inspektor gar nichts davon zu finden ist, was formatieren würde. Bist sicher, dass alle nötigen CSS-Dateien geladen werden? Schaut für mich jedenfalls komisch aus.


  • Re:Later

    Eigentlich sollten alle CSS Klassen vorhanden sein. Ich habe einen Download vom HelixUltimate gemacht und dieses auf der Kopie der Seite installiert.

    Die Anpassungen in der custom.css sind absolut überschaubar und betreffen hauptsächlich den Hintergrund.

    Werde aber jetzt noch schauen woher dieser margin-bottom kommt.

    Besten Dank vorerst

  • Der margin-bottom wurde von dir im Editor für das Bild eingesetzt. Das nennt sich dann "Inline-Stil".

    Code
    1. <img style="margin-right: 20px; margin-bottom: 20px; vertical-align: top; float: left;" src="/images/union/Radsport/2019_Beiträge/Flachau_01.jpg" alt="News Rad" width="150" height="101">


    Das Template lädt Bootstrap-4-CSS, aber im HTML sehe ich fast nichts, was das dann auch nutzt.

  • Diese Einzüge kommen meiner Meinung nach davon, dass der Weiterleselink innerhalb eines DIVs gesetzt wurde. Das hat zur Folge, dass der DIV bei der Blogansicht nicht sauber geschlossen wird.


    Allerdings irritiert mich der generierte HTML-Code der Seite ein bisschen. Der sieht überhaupt nicht nach Helixultimate aus. Verwendest du etwa eigene Overrides?

  • anka   Re:Later

    - Der "inline-Stil" wurde von mir für die Endanwender (Frontend) bewusst so vorgegeben - funktioniert auch im Original mit dem Template QBAR von Joomla Plates einwandfrei - nur nach dem Austausch auf Helix Ultimate nicht mehr.

    - Ich verwende keine eigenen Overrides - damit hab ich mich noch nie beschäftigt.


    Ich werde jetzt das Experiment "JP QBAR auf Helix Ultimate" beenden und eventuell - wenn Joomla 4.0 da ist - noch einmal von vorne anfangen.


    Danke für Eure Hilfe

    Wolfgang