Hallo aus Tirol,
Gibt es einen Trick für folgendes Problem: Ich arbeite im WYSIWYG-Modus in einem Dokument oder Objekt und platziere ein Bild. Das Bild hat exemplarisch 2500px Breite, weil wir responsive arbeiten. Nun nimmt mir das Bild den kompletten Platz ein.
Wie kann ichs einstellen, dass das dargestellte Bild z.B.: nur 250 px Breite mit automatischer Höhe einnimmt und ich weiter gut editieren kann?
Außerhalb des WYSIWYG-Modus kann ich mir bei einem Bild mit <we:ifEditmode... behelfen.
Bitte um Tipps!
Danke Christoph
Bilder im WYSIWYG-Feld
- christobal
- Senior Member
- Beiträge: 313
- Registriert: Do 4. Nov 2010, 13:03
- Wohnort: Reith bei Seefeld, Tirol - Österreich
- Kontaktdaten:
Bilder im WYSIWYG-Feld
BIG Detail, Kaspar & Sigl OG
Riedgasse 8b
A-6020 Innsbruck
Tel. +43 512 346070-40
Fax +43 512 346070-20
Mobil: +43 676 3438011
christoph.kaspar@bigdetail.com
http://www.bigdetail.com
Riedgasse 8b
A-6020 Innsbruck
Tel. +43 512 346070-40
Fax +43 512 346070-20
Mobil: +43 676 3438011
christoph.kaspar@bigdetail.com
http://www.bigdetail.com
-
- webEdition Partner
- Beiträge: 1825
- Registriert: Di 7. Mär 2006, 16:50
- Wohnort: Wien
- Kontaktdaten:
Re: Bilder im WYSIWYG-Feld
Hallo Christoph,
Im Richtext würde ich grundsätzlich keine so großen Bilder einbetten. Hier empfiehlt es sich geeignete Miniaturansichten zu definieren und diese bei der Einbettung des Bildes auszuwählen. Damit werden die Bilder automagisch auf die passende Größe runter gerechnet.
Liebe Grüße,
Sascha
Im Richtext würde ich grundsätzlich keine so großen Bilder einbetten. Hier empfiehlt es sich geeignete Miniaturansichten zu definieren und diese bei der Einbettung des Bildes auszuwählen. Damit werden die Bilder automagisch auf die passende Größe runter gerechnet.
Liebe Grüße,
Sascha
-
- Senior Member
- Beiträge: 238
- Registriert: Do 16. Feb 2012, 12:51
Re: Bilder im WYSIWYG-Feld
Hallo Christoph,
es gäbe noch einen anderen Lösungsansatz.
Wir haben das mit geteilter CSS umgesetzt. Eine CSS natürlich für das Frontend, eine CSS für die Klasse bzw. das Objekt:
Für die Klasse haben wir eine "tiny-mce.css" hinterlegt. In dieser steht z. B. folgendes drin:
.p_image { float: left; width: 48% !important; height: auto !important; margin: 0 3% 1% 0; display: block; }
.p_image_full { width: 100% !important; height: auto !important; margin: 0 0 1.0rem 0; display: block; }
Wenn Du dann also ein Bild in den WYSIWYG-Editor einfügst, wählst Du dann die entpsrechende CSS-Klasse aus und löscht die Pixelwerte, die ja beim Reinladen mit übernommen werden.
In der Frontend-CSS benötigst Du dann natürlich das passende Gegenstück.
Aber es ist schon von Sascha korrekt angemerkt. Solch grosse Bilddateien machen für das Web nicht viel Sinn. Man arbeitet besser mit weitaus kleineren Bild-Dateien von vornherein, oder man verwendet tatsächlich die Option mit den Miniaturansichten und definiert hier eigens dafür zu verwendende Werte.
es gäbe noch einen anderen Lösungsansatz.
Wir haben das mit geteilter CSS umgesetzt. Eine CSS natürlich für das Frontend, eine CSS für die Klasse bzw. das Objekt:
Für die Klasse haben wir eine "tiny-mce.css" hinterlegt. In dieser steht z. B. folgendes drin:
.p_image { float: left; width: 48% !important; height: auto !important; margin: 0 3% 1% 0; display: block; }
.p_image_full { width: 100% !important; height: auto !important; margin: 0 0 1.0rem 0; display: block; }
Wenn Du dann also ein Bild in den WYSIWYG-Editor einfügst, wählst Du dann die entpsrechende CSS-Klasse aus und löscht die Pixelwerte, die ja beim Reinladen mit übernommen werden.
In der Frontend-CSS benötigst Du dann natürlich das passende Gegenstück.
Aber es ist schon von Sascha korrekt angemerkt. Solch grosse Bilddateien machen für das Web nicht viel Sinn. Man arbeitet besser mit weitaus kleineren Bild-Dateien von vornherein, oder man verwendet tatsächlich die Option mit den Miniaturansichten und definiert hier eigens dafür zu verwendende Werte.
- Dateianhänge
-
- tiny_bild_einfuegen.jpg (160.11 KiB) 4530 mal betrachtet
- christobal
- Senior Member
- Beiträge: 313
- Registriert: Do 4. Nov 2010, 13:03
- Wohnort: Reith bei Seefeld, Tirol - Österreich
- Kontaktdaten:
Re: Bilder im WYSIWYG-Feld
Vielen Dank für Eure Überlegungen und Tipps.
Werd ich ab sofort so umsetzen!!
Danke!
Werd ich ab sofort so umsetzen!!
Danke!
BIG Detail, Kaspar & Sigl OG
Riedgasse 8b
A-6020 Innsbruck
Tel. +43 512 346070-40
Fax +43 512 346070-20
Mobil: +43 676 3438011
christoph.kaspar@bigdetail.com
http://www.bigdetail.com
Riedgasse 8b
A-6020 Innsbruck
Tel. +43 512 346070-40
Fax +43 512 346070-20
Mobil: +43 676 3438011
christoph.kaspar@bigdetail.com
http://www.bigdetail.com
- christobal
- Senior Member
- Beiträge: 313
- Registriert: Do 4. Nov 2010, 13:03
- Wohnort: Reith bei Seefeld, Tirol - Österreich
- Kontaktdaten:
Re: Bilder im WYSIWYG-Feld
Ganz praktikabel ist Euere Vorgehensweise nicht:
ich setze responsives Webdesign voraus
ich setze responsives Webdesign voraus
- Ich bin im WYSIWYG-Feld
lade ein Bild hoch
sag ihm per Miniaturansicht-Select, dass es statt der 4000px nur 1200px Breite haben soll
nur dass dann der Editor voll mit diesem Bild ist
und ich herumdoktern muss, um überhaupt einen Platz für den Cursor zu finden...
- oder ich definier als Miniaturansicht 250px Breite
damit kann ich im Editor gut arbeiten
nichts ist im Weg
aber das Bild bleibt so klein
BIG Detail, Kaspar & Sigl OG
Riedgasse 8b
A-6020 Innsbruck
Tel. +43 512 346070-40
Fax +43 512 346070-20
Mobil: +43 676 3438011
christoph.kaspar@bigdetail.com
http://www.bigdetail.com
Riedgasse 8b
A-6020 Innsbruck
Tel. +43 512 346070-40
Fax +43 512 346070-20
Mobil: +43 676 3438011
christoph.kaspar@bigdetail.com
http://www.bigdetail.com
-
- Senior Member
- Beiträge: 238
- Registriert: Do 16. Feb 2012, 12:51
Re: Bilder im WYSIWYG-Feld
Hallo Christoph,
versuche es doch mal mit dem Einbinden der CSS wie oben beschrieben. Es funktioniert wirklich gut. Das ist einmal Arbeit, und dann klappt das auch immer. Und das responsive kannst Du damit auch noch abdecken.
versuche es doch mal mit dem Einbinden der CSS wie oben beschrieben. Es funktioniert wirklich gut. Das ist einmal Arbeit, und dann klappt das auch immer. Und das responsive kannst Du damit auch noch abdecken.
- christobal
- Senior Member
- Beiträge: 313
- Registriert: Do 4. Nov 2010, 13:03
- Wohnort: Reith bei Seefeld, Tirol - Österreich
- Kontaktdaten:
Re: Bilder im WYSIWYG-Feld
Hallo Ulrich,
habs gerade ausprobiert. Funktioniert einwandsohne!
Vielen Dank. Das rettet mir den Abend!
Christoph
habs gerade ausprobiert. Funktioniert einwandsohne!
Vielen Dank. Das rettet mir den Abend!
Christoph
BIG Detail, Kaspar & Sigl OG
Riedgasse 8b
A-6020 Innsbruck
Tel. +43 512 346070-40
Fax +43 512 346070-20
Mobil: +43 676 3438011
christoph.kaspar@bigdetail.com
http://www.bigdetail.com
Riedgasse 8b
A-6020 Innsbruck
Tel. +43 512 346070-40
Fax +43 512 346070-20
Mobil: +43 676 3438011
christoph.kaspar@bigdetail.com
http://www.bigdetail.com
Wer ist online?
Mitglieder in diesem Forum: 0 Mitglieder und 2 Gäste