Willkommen, Gast
Angemeldet bleiben:

THEMA:

Darstellungsproblem auf iDevices (Variable Breite) 09 Jan 2016 22:14 #42082

Hallo zusammen

ich darf eine Homepage überarbeiten und sammle nach einer Drupal-Zeit Erfahrungen mit Joomla. Diese Seite bin ich am aufbauen:
internetgedichte.ch/joomla, die allerdings noch nicht live ist.

Ich konnte soweit alles einrichten. Folgende Eckdaten hat diese Seite und der Webserver:
SITE INFORMATION
OS Linux s
PHP 5.4.45-0+deb7u2
MySQLi 5.5.46-0+deb7u1
Zeit 20:46
Cache Deaktiviert
GZip Deaktiviert
Joomla! 3.4.8 — © 2016
Verwendetes Template: wt_blank_free - Standard
Betroffenes Modul: RIE - Random Image Extended

Da der Schwerpunkt dieser Seite auf dem Lesen mit möglichst wenig Ablenkung sein soll, aber doch mit diversen Bildern ein wenig Abwechslung auf die Seite gebracht werden soll, habe ich mich für das erwähnte Bildermodul entschieden. In diesem Modul habe ich die Breite und Höhe des Moduls auf 200x800 festgelegt, da auch die Bilder dieses Format haben. Im Template habe ich die seitlichen Bereich mit 25% angegeben. Nun das Modul selber funktioniert einwandfrei und wechselt wunschgemäss in längeren Abständen die Bilder. Und wenn ich es im Brower (IE /Edge /Safari/Firefox usw.) anschaue, ist alles soweit iO.

Wenn ich es allerdings auf dem iPad anschaue, dann werden die linken Bilder in den Text geschoben. Wenn ich im Template die Seitenbereiche auf 20% anpasse, dann wird der Abstand zum eigentlichen Content zu gross und 30% sieht auch nicht wirklich cool aus am PC. 25 % wären optimal. Ich habe im Template auch die Möglichkeit Scripts einzubinden, die das Template übersteuern, also sowas wie eine custom.css. Damit habe ich auch schon erfolgreich die FB-Likebox eingebunden.

Hat jemand eine Idee, wie man das mit CSS oder der Möglichkeit der Scripts besser lösen kann?

Ich bin froh, um jeden Tipp!

Danke!
Follower

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Darstellungsproblem auf iDevices (Variable Breite) 10 Jan 2016 09:41 #42088

Hallo Follower
Ich kenne das Modul nicht.
Kannst du dort bei der Thumbnails-Einstellung bei der Breite nichts eingeben? also leer lassen?
Ist dort keine fixe Breite, dann funktioniert es, dass sich die Bilder verkleinern, wenn es nötig ist.
Das "max-width: 100%;" greift.
Ich habe es mit dem Firebug ausprobiert. Ohne die Breitenangabe funktioniert es.

Wenn das nicht geht, muss du in der theme.css angeben, dass es früher auf responsive umstellt.
Hier einen höheren Wert: @media (min-width: 768px)

lg, Pascale
Joomla! Webdesign: www.your-webdesign.ch
Folgende Benutzer bedankten sich: Follower

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Darstellungsproblem auf iDevices (Variable Breite) 10 Jan 2016 09:48 #42089

Am gescheitesten wäre es, Viktor, den Entwickler selbst zu fragen, der betreibt nämlich ein Supportforum. Dort könnte man dasdada entdecken. Vieleicht hilft das weiter?
Joomla! 3: Professionelle Webentwicklung von David Jardin und Elisa Foltyn - das Standardwerk zu Joomla! 3
Wer nicht über den Anstand verfügt, ein kleines "Thänx" auszusprechen, muss sich nicht wundern, künftig ignoriert zu werden!
Kein Support via PM oder Mail. Entsprechende Anfragen werden ignoriert.

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Darstellungsproblem auf iDevices (Variable Breite) 10 Jan 2016 15:39 #42091

Danke für eure vorläufigen Antworten.

@Pascale:
Die gewünschten Thumbnails-Einstellungen habe ich im Modul nicht gefunden. Dort hat es nur Einstellungen wie im Anhang ersichtlich. Dort habe ich dann noch den Punkt "Seitenverhältnisse beibehalten" von JA auf NEIN gewechselt, hat aber auch keine Besserung gebracht.

Das "max-width: 100%;" greift.
Ich habe es mit dem Firebug ausprobiert. Ohne die Breitenangabe funktioniert es.

max-widht habe ich leider nicht gefunden in der theme.css, um dies anzupassen. Oder könnte ich dies auch im custom.css eintragen?

Wenn das nicht geht, muss du in der theme.css angeben, dass es früher auf responsive umstellt.
Hier einen höheren Wert: @media (min-width: 768px)

Ich habe das mit @media ausprobiert. Im theme.css habe ich den Wert @media wie von dir beschrieben angepasst, hat aber nichts gebracht. Als ich dann nach anderen Einträgen dieser Sorte gesucht habe wurde ich fündig:

/* Large screen and bigger */
@media (min-width: 1220px) {
/* Horizontal */

/* Tablet and bigger */
@media (min-width: 768px) {
.uk-grid-divider > [class*='uk-width-medium-']:not(.uk-width-medium-1-1):nth-child(n+2) {
border-left: 1px solid #dddddd;

/* Desktop and bigger */
@media (min-width: 960px) {
.uk-grid-divider > [class*='uk-width-large-']:not(.uk-width-large-1-1):nth-child(n+2) {
border-left: 1px solid #dddddd;
}

}
/* Large screen and bigger */
@media (min-width: 1220px) {
/*
* Large gutter

/* Phone landscape and bigger */
@media (min-width: 480px) {
.uk-grid-width-small-1-2 > * {
width: 50%;
}

}
/* Tablet and bigger */
@media (min-width: 768px) {
.uk-grid-width-medium-1-2 > * {
width: 50%;

}
/* Desktop and bigger */
@media (min-width: 960px) {
.uk-grid-width-large-1-2 > * {
width: 50%;
}

}
/* Large screen and bigger */
@media (min-width: 1220px) {
.uk-grid-width-xlarge-1-2 > * {
width: 50%;
}

}
/* Phone landscape and bigger */
@media (min-width: 480px) {
/* Whole */
.uk-width-small-1-1 {
width: 100%;
}

/* Tablet and bigger */
@media (min-width: 768px) {
/* Whole */
.uk-width-medium-1-1 {
width: 100%;
}

}
/* Desktop and bigger */
@media (min-width: 960px) {
/* Whole */
.uk-width-large-1-1 {
width: 100%;
}

/* Tablet and bigger */
@media (min-width: 768px) {
[class*='uk-push-'],
[class*='uk-pull-'] {
position: relative;
}

}
/* Large screen and bigger */
@media (min-width: 1220px) {
.uk-panel + .uk-panel-divider {
margin-top: 70px !important;
}

usw. es hat noch etliche andere. Eine Bezeichnung zum Modul finde ich nicht. Es hat auch mehrere andere. Habe das CSS deshalb mal beigefügt.

@Chris: Danke für den Tipp: Allerdings hat das Einfügen ins CSS von...

.random_image_extended img {
height: 100%;
width: 100%;
}

...auch nichts gebracht.

Sorry, dass ich euch soviel Mühe bereite, aber ich hätte mir es auch anders gewünscht.

Bin froh um alle weiteren Tipps.

Danke und Gruss
Follower
Anhänge:

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Darstellungsproblem auf iDevices (Variable Breite) 10 Jan 2016 15:56 #42092

Hallo Follower,
du hast doch das Bild "RIE.jpg" angefügt. Dort ist bei Breite (px) = 200 eingefügt.
Probier mal, dieses Feld leer zu lassen.

max-width=100% ist für Bilder schon eingetragen. Aber weil das Modul eine fixe Breite von 200px hat, darum greift dies nicht.

Sorry: @media (min-width: 768px)
ist falsch. es müsste max-width sein. in bootstrap.css hat es auch solche Statements. es wird schwierig, das richtige zu finden.
lg, Pascale
Joomla! Webdesign: www.your-webdesign.ch
Folgende Benutzer bedankten sich: Follower

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Darstellungsproblem auf iDevices (Variable Breite) 10 Jan 2016 17:00 #42095

Hallo Pascale
habe deine Ratschläge befolgt: Mit alles löschen hat es nicht funktioniert, es wurde wieder der letzte Wert angezeigt (200px). Mit 0 geht es auch nicht, dann wird kein Bild angezeigt. Schliesslich habe ich es noch mit eine Leerschlag (Blank / Space) probiert......... und siehe da. Jetzt ist das Feld leer, und die Bilder werden auch auf dem Pad korrekt angezeigt! Super! Danke für deine Hinweise!
Lieber Gruss
Follower

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

Darstellungsproblem auf iDevices (Variable Breite) 10 Jan 2016 17:17 #42096

super! das mit dem Leerschlag muss ich mir merken.
Joomla! Webdesign: www.your-webdesign.ch

Bitte Anmelden oder Registrieren um der Konversation beizutreten.

  • Seite:
  • 1