TLNTT
I'm new here

Benutzerfreundliche Eingabemöglichkeit für Bildpositionierung

Jump to solution

Hallo,

wir haben aktuell ein Projekt bei dem die Redakteure nur die Möglichkeit haben Bilder horizontal auszurichten.

Da manche Bildelemente, wie Gesichter, so aber in Menüs wandern und verdeckt werden sollen weitere Möglichkeiten hinzukommen. D.h. eine Kombination aus vertikaler und horizontaler Ausrichtung.

Insgesamt ergeben sich vier Radiobuttons für eine horizontale Positionierung: links, mitte-links, mitte, mitte-rechts, rechts und noch einmal drei für eine vertikal Positionierung(oben, mitte, unten). Der Kunde frägt aus diesem Grund nach einer Eingabemöglichkeit mit höherer Usability.

Gibt es hierzu solch eine Möglichkeit bspw. einen Anker (s. Bild) zu erstellen - als Super-Feature ggf. sogar mit optischem Feedback z.B. im ContentCreator?

Ist solch ein Feature für die Zukunft geplant?

Oder gibt es eventuell einen besseren Vorschlag hierzu, den wir nicht sehen?

Vielen Dank

Tobias Lutz

0 Kudos
1 Solution

Accepted Solutions
mbergmann
Crownpeak employee

Hallo Tobias,

im CC kann man sich praktisch beliebige "Tools" bauen - wenn es nur um die "Optik" geht.

Grobe Idee: Per JS (z.B. on hover) ein Overlay einblenden mit einer Grafik (bis dahin hat das Ganze dann noch gar nichts mit FS zu tun). Da legt man dann entsprechende Klick-Ereignisse drauf, die per WE_API.COmmon.execute(...) dann ein Executable aufrufen. Das manipuliert dann letztlich die Eingabekomponenten die hinter der Ausrichtung stecken. Das geht dann natürlich nicht im Formular, aber auf der CC-Vorschauseite würde es gehen. Natürlich kann man - wenn man es richtig nett machen will, erstmal nur das DOM manipulieren und erst nach einem OK die Daten ändern.

Viele Grüße

Michael

View solution in original post

0 Kudos
5 Replies
Peter_Jodeleit
Crownpeak employee

Was spricht dagegen, den Redakteuren eine Bildzuschnitt-Option mit einer passenden Bildauflösung anzubieten?

Peter
0 Kudos

Die Auflösung wird von Fotografen/Agenturen bereits korrekt geliefert, teilweise sogar mit Hinweis für die Ausrichtung. Wenn die Redakteure nun etwas davon abschneiden würden, würde auf einer anderen Seite etwas Fehlen oder man müsste das Bild skalieren und würde Qualtiät verlieren. Hierbei besteht dann wieder die Gefahr, dass ein Kopf hinter einen Banner rutscht. Insbesondere wenn zwischen Desktop, Tablet und Smartphone responsive umgeschaltet wird.

Davon abgesehen sind die Redakteure keine geschulten Bildbearbeiter und bräuchten ein Raster, damit sie sehen wie das Bild sich dann in das Layout einfügt. Aktuell ist selbst das für die die Agenturen ein Try-and-Error und kann nicht beliebig ausgenutzt werden ohne das Bild und dessen Wirkung zu "zerstören".

Wir sehen aktuell nur die Möglichkeit einer Eigenentwicklung mittels Swing o.ä., das birgt aber diverse Risiken bei FirstSpirit Upgrades aufgrund von Dependencies.

0 Kudos
mbergmann
Crownpeak employee

Hallo Tobias,

im CC kann man sich praktisch beliebige "Tools" bauen - wenn es nur um die "Optik" geht.

Grobe Idee: Per JS (z.B. on hover) ein Overlay einblenden mit einer Grafik (bis dahin hat das Ganze dann noch gar nichts mit FS zu tun). Da legt man dann entsprechende Klick-Ereignisse drauf, die per WE_API.COmmon.execute(...) dann ein Executable aufrufen. Das manipuliert dann letztlich die Eingabekomponenten die hinter der Ausrichtung stecken. Das geht dann natürlich nicht im Formular, aber auf der CC-Vorschauseite würde es gehen. Natürlich kann man - wenn man es richtig nett machen will, erstmal nur das DOM manipulieren und erst nach einem OK die Daten ändern.

Viele Grüße

Michael

0 Kudos

Hallo Michael,

die Idee ist klingt gut und wäre wohl auch recht einfach ohne große Abhängigkeiten umsetzbar.

Vielen Dank

Tobias Lutz

0 Kudos
mbergmann
Crownpeak employee

Hallo Tobias,

ja, versuch das mal. Ich habe irgendwann auch mal sowas gebaut, habe den Code aber nicht mehr. War aber recht simpel. Die entsprechende Logik sollte natürlich mit $CMS_IF(#global.is("WEBEDIT"))$ nur im CC erscheinen 😉

Die entsprechenden nötigen Infos wie sectionID, Name der Eingabekomponente usw. würde ich dann einfach im Common.execute(...) als Parameter mitgeben, dann bleibt das flexibel. Kleiner Hinweis: Es kann sein dass Du bei der Übergabe der numerischen IDs aufpassen musst - ggf. landen die nämlich als Double in der Parameter-Map des Executables und müssen dann erst in Long umgewandelt werden.

Viele Grüße

Michael

0 Kudos