forum.ahadesign.eu

[Markus]

Hallo,

ich habe jetzt verschiedene "Farbvarianten" vom obigen Template für die 1.5 auf "FIX" gestellt, und mir ist beim testen folgendes aufgefallen.

Klickt man sich bei "Menuleft" mal ein wenig durch, so stellt man fest, das verschiedene Buttons (z.B. von "Joomla-Links" wieder zurück zu "Startseite") des seitlichen Menüs nicht fest ist, sondern auch variert.

Weiterhin gibt es beim Firefox ein weiteres (wahrscheinlich ungewolltes Resultat): Bei obiger Beschreibung scheint es so, als wenn die Seite unterschiedliche horizontel Positionen hat bei klicken der Buttons. Dies habe ich getestet bei einer Browserauflösung von >1024*768 , so daß das Browserfenster um einiges größer ist, als das eigentliche Joomla.

Ich hoffe ich habe die einigermaßen verständlich / nachvollziehbar beschrieben. Zu zwecken des nachvollzien könnens, kann ich es temporär mal online stellen, so daß man sehen kann was ich meine. Alternativ kann ich auch mal ein kurzes Screenrecord machen mit entsprechender beschreibung, was gemeint ist.

Gibt es dahingehend eine möglichkeit der Anpassung, so daß sowohl die Menübreite immer identisch ist, und auch das verschieben (beim FF) nicht mehr resultiert ?


Zudem habe ich folgende Herausforderung:

In der template.css kann man ab 516 die "paddings" einstellen. So weit so gut. Nun kann ich auch die Paddings einstellen, aber...
hierbei zeigt sich besonders bei dem rechten Rand, das man für den FF ganz andere Werte nehmen müsste, als man für den IE eintragen kann, da die Werte vom IE kaum das gleiche Ergebnis bewirken beim FF. Hierzu kann ich gerne mal Screenshots zur Verfügung stellen.

Besten dank schonmal für Eure Hilfe, bzw. die Lösungsansätze.
Markus

[Gerhard]

Hallo Markus,

also das Problem beim vertikalen Menü kann ich leider nicht nachvollziehen. Verschieben kann sich da nichts. Unterschiedliche horizontale Positionen gibt es auch nicht. Eventuell werden die horizontalen Module nur für bestimmte Seiten angezeigt. Das kann man dann aber selbst einstellen und hat nichts mit einem Fehler des Templates zu tun. Wenn man also im Backend unter Erweiterungen - Module ein Modul editiert, kann man dort unten links die Menüzuweisung vornehmen. Wenn hier nicht alle ausgewählt wurden, ist das Modul auch nicht bei allen Menüpunkten sichtbar. Ist dann keines der sechs möglichen Module aktiviert, geht natürlich der Contentbereich nach oben. Also anders kann ich mir das hier geschilderte Problem nicht vorstellen. Aber ein Link zur Seite würde hier sehr hilfreich sein. Dann lässt sich das Template doch genauer untersuchen. Ansonsten kann auch ein Screenshot hier hochgeladen werden. Also die Menübreite verändert sich bei fixer Darstellung auf keinen Fall. Da liegt dann ein anderer Fehler vor. Wurde zb. selbst im Code etwas geändert? Das kann dann schnell zu solchen Fehlern führen.

Bei der Änderung der Paddingwerte gibt es keine abweichende Darstellung, so wie es im Original-Template eingestellt ist. Ich kann dieses Problem wirklich nicht sehen. Allerdings ist es schon so, daß gerade die alten Internet Explorer vieles falsch oder auch schon mal gar nicht anzeigen. Das wurde aber bei allen Ahadesign-Templates berücksichtigt. Die Templates laufen mit gleicher Darstellung auf Firefox, Opera, Safari, Chrome, alle Internet Explorer ab Version 6. Damit sind eigentlich alle Engines abgedeckt und es dürfte nirgendwo Darstellungsprobleme geben.

Vielleicht wurde das Template auch nicht richtig installiert? Wenn vorher eine alte Version installiert war, muss diese sauber über das Backend deinstalliert werden. Erst dann muss das aktuelle Template auch wieder sauber über das Backend installiert werden. Also nicht einfach per FTP-Programm auf den Server schieben. Das kann zu Fehlern führen. Wie gesagt, ein Link zur Problem-Seite würde wohl am besten sein, um helfen zu können. Aber vielleicht helfen diese Informationen ja auch schon weiter.

Ansonsten erstmal Willkommen im Forum.

[Markus]

Hallo Gerd,

also nachdem ich mir mal Deine Antwort durchgelesen habe, hab ich Joomla nochmal komplett neu aufgesetzt, und Dein Template auch mal sauber als paket installieren und als standard auswählen lassen. Die Breite habe ich wieder auf Fix gestellt. Weitere Änderungen habe ich erstmal nicht an Joomla vorgenommen. Ist also sozusagen jungfräulich...

Zu folgendem Ergebnis bin ich gekommen:

1. Ich habe die gleichen Ergebnisse wie vorher.
2. Die Resultate treten bei dem aktuellen Firefox auf, also Version 3.6 unter Windows
3. das sich die Seite nach rechts verschiebt, liegt wohl daran (habe ich vorhin zufällig festgestellt), daß Firefox mit der Scroll-leiste anders umgeht als der IE. Hat man auf eine "Unterseite" geklickt ohne Scrollbar, dann ist die Seite halt weiter rechts, als bei dem klick auf einer Unterseite, wo der Scrollbar an der rechten Seite ist, und somit die Seite halt weiter Links ist. Das war mir vorher ehrlich gesagt noch nie aufgefallen. Die Screenshots dazu packe ich mal anbei.

Aber:

Das hat nichts mit der unterschiedlichen Breite der Navigationsleiste zu tun. Hierzu habe ich auch mal Screenshots mit Messungen gemacht.
Hierbei ist mir übrigens folgendes aufgefallen:

Die Navileiste ist breiter in dem Moment, wenn neben dem Content rechts noch Menus (o.ä.) sind.
Ist neben der linken Navileiste nurnoch der Content und nichts mehr rechts daneben, dann ist die Navileiste schmaler (!)

Wie gesagt, Screenshots packe ich bei. Entsprechender Link zur Testseite: http://joomla-test.go-4x.de


Bzgl. der Angelegenheit mit den "Paddings" werde ich auch mal entsprechende Screenshots mit Angabe der jeweiligen Padding Werte machen, damit Du sehen kannst, was ich meine, dafür habe ich jetzt aufgrund der fortgeschrittenen Zeit jedoch keine Lust mehr Hole ich aber noch nach. (Nochmal kurz zusammengefasst: Ist halt so, das man bei Benutzung vom Firefox andere Paddingwerte einstellen muß, um einen ähnlichen Randabstand zu bekommen, als wenn man mit dem IE browsen würde.)

schöne Grüsse,
Markus

[Gerhard]

Hallo Markus,

also ich denke ich verstehe jetzt, was gemeint ist. Also diese Sache ist bis jetzt noch niemanden aufgefallen. Nicht mal mir. Aber es stimmt, die Breite der linken Sidebar verändert sich, wenn rechts nichts aktiviert ist. Das wurde nicht optimal von mir programmiert, muß ich leider zugeben. Aber es lässt sich leicht anpassen. Öffne dazu bitte die Datei right.css im CSS-Ordner des Templates. Ändere dort die Werte wie folgt:

Code: Alles auswählen

#mainarea{width:100%;}
#contentarea{width:80%;}
#rightmodules{display:none;}
#leftmodules{width:20%}

Jetzt bleibt die linke Sidebar immer gleich, im Firefox 3.6 und auch in allen Internet Explorern.
Ich habe diese Anpassungen bereits für alle betroffenen Templates durchgeführt und aktuell zum Download bereitgestellt. Ich bin immer froh, wenn ich auf Fehler hingewiesen werde. So werden die Templates letztlich perfekt, auch wenn selten ein Fehler vorkommt.

Wegen den Paddings, das habe ich auch nochmal geprüft. Und wie gesagt, das verhält sich bei diesem Template in allen Browsern gleich. Also ich meine die Innenabstände für den Contentbereich. Möglicherweise meinen wir ja nicht beide das gleiche. Aber vielleicht hilft hier ja auch wieder ein Screenshot. Auch das werden wir lösen.

[Markus]

Hallo Gerd,

Du solltest wissen, das ich in Fachkreisen auch "all-seeing Eye" genannt werde (Aber das gehört als Programmierer eigentlich auch, das man alles berücksichtigt, also auch nen "Worst-Case" durchspielt, aber mit Design und CSS hab ich´s halt nicht, sonst hätt ich das "mal eben" selber gefixt)

Hier nun zu dem Padding, welches sich ja lt. Deiner Aussage gleich darstellt. Ich denke, wenn Du meine Screenshots wieder siehst, wirst Du mir recht geben, das dem nicht so ist. Hierbei habe ich den 2ten Wert in der CSS geändert, und das Fenster vom Notepad++ extra drüber gelegt, zum sehen. Das die Bereiche und besonders die Abstände zum Rand nicht identisch sind, habe ich mal wieder gelb angemarkert.

Aber schonmal super, das es mit der Menuleiste jetzt hinhaut. Den rest kriegen wir auch noch hin.

Das non plus Ultra wäre natürlich auch, wenn sich ne Lösung bzgl. der unterschiedlichen Handhabung der Scroll-leiste zwischen IE und FF finden lassen würde, das man als User nicht denken würde, beim FF verschiebt sich die ganze Seite.

BTW, gibt es eigentlich irgend eine möglichkeit ein Logo im Top mittig zu machen, welches nicht eine Fixe größe hat ? Sondern, das es z.B. beim Fluid Modus eine Breite X hat (z.B. 1400px), bzw, kleiner bei kleinerer Fluid Auflösung des User, größer bei höher Aufläsung des User, und bei Fix dann angepasst eine breite von (z.B. 700px) ? Das wäre auch noch eine Herausforderung. Ich meine, das es, außer in Flash, keine mir bekannte Möglichkeit gibt das Logo "Dynamisch" mit zusammen-/auseinanderziehen der Seite sich verändern zu lassen. Oder gibt es eine andere möglichkeit zur Lösung ? Auf Flash möchte ich nicht gerne zurückgreifen, soll ja schließlich auch ohne Flash gehen.

best Grüsse,
Markus

[Gerhard]

Hallo Markus,

also das mit den Paddings kann ich nicht nachvollziehen. Ich hab es ein weiteres Mal mit allen IE´s getestet und das verhält sich absolut gleich. Die auf den Screenshots gezeigten Abweichungen treten auf meinem Testserver nicht auf und ich habe hierzu auch noch nie eine Rückmeldung bekommen. Das mit dem Padding kann ich also gar nicht bestätigen. Aber dass sich alle Browser etwas anders verhalten ist altbekannt. Jeder Hersteller kocht da sein eigenes Süppchen, auch wenn es jetzt nicht mehr so schlimm ist, wie früher. Also mit dem Millimeterband nachmessen bringt da nix. Selbst die Schriftenarten und Größen werden je nach Browser etwas anders dargestellt. Man kann schon alles Pixelgenau machen. Dann muss man entsprechend mit Hacks vor allem für die IE´s arbeiten, was auch hier ja teilweise gemacht wird. Das lohnt aber den Aufwand auch nicht immer, weil ein Besucher wohl eher selten jede Seite mit verschiedenen Browsern ansieht. Ich meine jetzt natürlich nicht gravierende Unterschiede. Das sollte schon überall gleich aussehen und das ist auch der Fall bei diesen und allen anderen Ahadesign-Templates. Aber eine 1zu1 Darstellung ist im Web kaum zu machen. Da spielt dann auch noch der Monitor mit, der ja bei jedem anders sein kann und man hat darauf überhaupt keinen Einfluss. Da gibt es aber noch viel mehr Aspekte, worüber man leicht einen Roman schreiben könnte. Zu diesem Thema könnte auch folgender Artikel interessant sein:
http://www.ahadesign.eu/webdesign/webseite-fur-alle-browser-optimieren.html
Dort ist vor allem die Sache mit dem Box-Model interessant. Also das unterschiedliche Verhalten zb. für Padding.
Das mit der Scrollleiste kann ich auch nicht so recht verstehen. Wieso verschiebt sich die ganze Seite? Verstehe ich beim besten Willen nicht. Wenn sich da was verschieben würde, hätte ich sowas niemals veröffentlicht. Außerdem hätten sich dann sicher schon unzählige Anwender beschwert. Scrollleisten zu verändern ist außerdem keine gute Idee. Damit irritiert man eher den User, weil sich die Seite dann nicht mehr verhält wie alle anderen Seiten. Und der Mensch ist ein Gewohnheitstier.
Vieles lässt sich mit Javascript beeinflussen. Auch Grafiken natürlich. Für eine automatische Verbreiterung der Grafik zb. im Header, nutzt man normalerweise wiederholbare Grafiken. Es sollte also ein Teilbereich vorhanden sein, der sich wiederholen lässt zb. mit repeat-x für die horizontale Wiederholung. Dann kann das Bild dynamisch mit dem Browserfenster mitwachsen. Dazu braucht es also nur CSS. Für ein Logo mit fester Breite in der Fix-Darstellung könnte man den Logo-Bereich in der fix.css definieren. Für ein wiederholtes Logo entsprechend in der fluid.css und aus der template.css nimmt man es ganz raus. Das wäre also auch eine gute Möglichkeit. Im Edition White J15 kann das Logo in den Abmessungen verändert werden mit width und height und die Position mit margin verändert werden. Außerdem ist es mit float nach links ausgerichtet. Flexibler könnte man es steuern, wenn man das Logo absolut positioniert. Damit würde es aus dem Fluss herausgenommen und beeinflusst andere Elemente nicht. Dazu findet sich auch einiges hier im Forum. Das einzig sinnvolle für ein dynamisches Logo ist also eine wiederholbare Grafik. Mit Javascript oder Flash würde ich das auf keinen Fall machen.

Was den Worst-Case betrifft, das mache ich schon auch so. Auf dem Testserver sind extra viele Fehler in Joomla zum Testen eingebaut. Trotzdem können mal Fehler passieren. Aber das ist Dir als Programmierer ja sicher nicht unbekannt.

Das artet schon wieder in einem Roman aus. Und es gäbe zu diesen Themen auch noch eine Menge zu sagen. Aber ich belasse es mal dabei, sonst komme ich zu nichts anderem mehr. Ich hoffe auf jeden Fall, das hier hilft weiter.

Gruß
Gerhard

[Markus]

Hallo Gerhard,

der langen Worte mal ein ende zu bereiten, habe ich mal ein Screenrecord gemacht von knapp 3 minuten: http://test.go-4x.de
Ich denke, damit dürfte dann in bezug auf die Verschiebung alles gut (genug) erklärt sein. Übrigens verhält sich z.B. der Safari genauso wie der Firefox dabei.

Was Deine sehr ausführliche Erklärung anbelangt, muß ich es mir wirklichlich mit dem repeat-x nochmal genauer durchlesen, weil wie gesagt, von CSS hab ich nicht so die Ahnung bisher.

Davon abgesehen, habe ich gerade mal kurz Dein Tutorial überflogen, worauf Du gerade hier verwiesen hast. Sehr interessant. Auch das werde ich mir asap genauer durchlesen.

Und was den worst-case anbelangt, so gehe ich eigentlich davon aus, das nicht nur Du und ich diesen berücksichtigen, sondern dies normalerweise auch definitiv dazugehört. Ich hoffe es hat sich nicht wie ein Vorwurf angehört, denn das war es definitiv nicht. Im Gegenteil, die Sachen von Dir sind schon ganz gut durchdacht. Besonders die neueren Varianten der Sachen, wo Du z.B. die CSS aufteilst in verschiedene Bereiche wie Menu.css etc. Das war ja z.B. vorher ja auch nicht gegeben.

Was ich übrigens auch mittlerweile sehr schätze, das hat sich wirklich erheblich in den letzten knapp 20 Jahren verändert, ist die Einstellung der Entwickler. Früher war es teilweise in der tat so, dass alle ein großes Geheimnis um die eigenen Sachen gemacht haben, und geschweige denn offen für Anregungen oder Kritik gewesen sind, bzw. jeder von sich gedacht hat "ICH BIN ES..."

Das muß ich wirklich nochmal positiv hervorheben, das ist erheblich besser geworden. Ich vermute mal, das dies im Rahmen von GPL und wie diese ganzen freien Sachen da noch so alle heißen mit zusammen hängen.


Anderes Thema: Ich hab gesehen, das hier im Forum teilweise auch andere Sachen in Bezug auf Joomla diskutiert werden. Ich wollte nur mal kurz anmerken, das ich für den ccNewsletter (dazu gabs auch mal einen Thread hier) mal einige modifizierungen vorgenommen habe, und ChillCreations zukommen lassen habe, zwecks überprüfung auf Fehlerfreiheit, bzw. berücksichtigung von Sicherheitsaspekten. CC Soll ja in einer älteren Version eine Sicherheitslücke aufgewiesen haben. Und da ich in Bezug auf PHP / Joomla programmierung (noch) nicht so der Experte bin, bin ich der Meinung, das muß jemand drüber schauen, der da Ahnung von hat. Ansonsten wären meine bisherigen modifizierunge zu der Extension schon sehr nett.


schöne grüsse, und vor allem, ein schönes Wochenende.
Markus

[Gerhard]

Hallo Markus,

also das Video ist wirklich eine super Idee. Ich war da bisher wohl auf der falschen Fährte. Aber jetzt verstehe ich es. Also das ist eine Browser-Eigenart, die man dem IE aber auch austreiben kann. Dazu schreibt man einfach zusätzlich folgendes in das Body-Tag in der index.php:

Code: Alles auswählen

<body scroll="Auto">

Damit ist die Leiste dann nur verschwunden, wenn sie wirklich nicht gebraucht wird. Und sie ist damit ganz verschwunden. Anstelle von "Auto" kann man auch "no" bzw. "yes" schreiben. Dann ist die Leiste aber immer weg bzw. immer da. Das hat also gar nichts mit CSS zu tun und funktioniert meines Wissens auch nur in den Internet Explorern. Nur das Padding-Problem kann ich gar nicht reproduzieren. Ich glaube ja, dass es bei Dir so aussieht. Aber das muss dann einen anderen Grund haben. Aber vielleicht helfen Dir ja Browserhacks hier weiter. Eingeleitet wird das für den IE6 zb. mit * html und für den IE7 mit * + html. Damit sich der IE8 wie der IE7 verhält, kann man ganz oben in der index.php über den Meta-Tags folgendes eintragen:

Code: Alles auswählen

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

Also das steht da auch schon drin im Edition White J15. Normalerweise kann das auch entfernt werden. Ich wollte damals nur sicher gehen, dass keine Probleme auftreten, vor allem auch mit Erweiterungen. Zu den Browserhacks ist außerdem noch einiges in den Tutorials auf der Hauptseite zu finden. Aber auch sonst gibt es dazu sehr viele Infos im Web.

Das mit dem Worst-Case, klar, sollte jeder machen. Aber gerade bei vielen Free-Templates wird das anscheinend nicht immer gemacht. Gerade weil man sowas immer machen sollte, nehme ich das auch keinesfalls als Vorwurf auf. Die neuen hinzugekommenen Dateien bedeuten ürigens auch immer neue Features. Die menu.css zb. kam dazu, weil ein umfangreiches horizontales Dropdown-Menü ermöglicht wurde. Dazu muss der Menüstil Liste eingestellt werden. Aber dazu findet sich hier im Forum auch schon eine Menge.
Zu der Einstellung der Entwickler, naja das hat schon sehr viel mit OpenSource zu tun, denke ich. Alles ist für jeden einsehbar und daraus entwickeln sich naturgemäß viele Diskussionen und viel Information bleibt dabei für jeden Interessierten hängen. Das merkt man ja zb. auch, wenn man für Linux Programme entwickelt.

Zum ccNewsletter kann ich jetzt leider nichts weiter sagen. Leider hab ich auch nicht die Zeit, mir den Code durchzusehen und mich da reinzudenken. Das ist bei den Templates natürlich anders, weil ich die Dinger auswendig kenne. Vielleicht kann ja ein anderer User hier weiterhelfen. Ansonsten hilft vielleicht auch der Entwickler? Naja, ich hoffe Du kommst mit dem Template erst mal weiter.

Wegen dem Logo zentrieren, such mal nach genau diesem Begriff hier im Forum. Also über die Suche oben rechts hier auf der Seite. Falls Du nichts passendes findest, mache bitte einen neuen passenden Thread auf und ich versuche es ganz genau im Detail zu erklären.

Beste Grüße
Gerhard

[Markus]

Guten morgen Gerhard,

Das ist ja der Vorteil des gesprochenen Wortes, bzw. des gezeigten Bildes. Daher hatte ich mir auch gedacht "sch.. drauf, ich mach das jetzt mal eben"...

Immerhin sind wir damit schonmal auf den gleichen Nenner gekommen. Ich werde das mal schauen anzupassen. Besser wäre natürlich, wenn man die Scrolleiste anlässt, und wenn alle Browser darauf gleich reagieren würden.

--EDIT ANFANG--
Habe Dies gerade mal getestet.Du hast Dich übrigens vertan, es müsste eigentlich "scrolling" und nicht "scroll" heißen, damit es als Befehl erkannt wird soweit ich weiß, leider bringt dies in keinster weise eine Veränderung der Seite mit sich. Weder im IE, noch Firefox, noch sonst irgendwo. Hatte mal auf "yes" gestellt, aber ohne Ergebnis. Woanders habe ich gelesen, das es evtl. per css eingestellt werden müsse (durch CSS passiert doch genau genommen ein override, oder ?), damit es wirksam würde.
--EDIT ENDE--



Tja, das Du es mit den Paddings nicht nachvollziehen kannst ist natürlich nicht so schön, aber:

Auch das werde ich mal antesten mit dem anpassen der Kompatibilität, meine Testumgebungen waren / sind jedoch unterschiedlicher Herkunft. Ein Webserver läuft auf Ubuntu mit entsprechenden Applikationen (SQL, PHP etc.), eine lokale Serverebene läuft auf Windows mit XAMPP, von daher kann es Serverseitig nicht verursacht sein.

Was die Clientseite anbelangt, so habe ich auch hier verschiedene Systeme zum testen bereit, so dass ich z.B. einmal auf Windows XP SP3 zurückgreife, und auch Windows 7 64-Bit, was (eigentlich) den Client auch ausschließt. Auflösungen habe ich natürlich auch verschiedene laufen. Regulär 1600x1200, und zu diversen zwecken dann halt auch mal 1024x768...

Ich halt Dich da jedenfalls mal auf dem laufenden, wenn sich da in irgend ner weise was ändert, bzw. ich mal konkret was weiß.

Mit dem Logo werde ich mal nach bereits behandelten Posts schauen, aber gibt ja noch viel wichtigere Sachen zu regeln, da ist das dann nur noch "Beiwerk"..

schöne Grüße,
Markus

[Markus]

Hi,

mir ist gerade was in der template.css aufgefallen:

#mainout {
margin:0 auto;
text-align:left;
height:100% !Important;
height:1%;
position:relative;
}

Ist das so gewollt, das die Höhe zweimal nacheinander definiert ist ?

Habe woanders bzgl. der Scrollleiste mal was gefunden: http://www.help-guide.de/hh_nonscroll.htm

Aber ich denke, Dir wird das eher was sagen als mir, bzw. wirst Du bestimmt wissen, was wo wie ...