beliebige Widgets einfliegend ab bestimmter Position

Mario hat ja unter https://www.zella.de/code/3.html bereits ein frei einfliegendes CSS-Fenster entwickelt. Ich tue mich leider immer noch etwas schwer mit mit der Anwendungskombination aus CSS und HTML, da ich als Vereinswebmaster (zumindest theoretisch) dahingehend vorsorgen sollte, dass außer mir auch andere Personen die Webseite betreuen können. Konkret geht es darum, dass wir mit WeCanHelp einen Handelspartner haben, der über das Portal einen Großteil der Provisionen an uns als Spende weiterleitet. Hierfür werden auch diverse Quellcodes wie beispielsweise nachfolgend als Marketingmittel angeboten.

<!-- Anfang WeCanHelp -->
<a href="https://www.wecanhelp.de/hanabi" target="_blank">
<img src="https://www.bildungsspender.org/extern/images/wch_verein_150_200.gif" border="0" alt="Hier geht's zu unserem Spenden-Shop."  title="Hier geht's zu unserem Spenden-Shop." width="150" height="200" /></a><br />
<!-- Ende WeCanHelp -->

Rein Optisch lässt sich dieser Quellcode aber nur schwer platzieren, da er, wenn er auf allen Seiten angezeigt werden soll, nur im Footer untergebracht werden kann. Die Logos zu unseren Social-Media-Auftritten sind quadratisch, eine Platzierung vor oder nach der Danksagung an aktuelle Spender wirkt unsymmetrisch. Den Spendertext von zwei Buttons einzufassen, hilft auch nicht, da beispielsweise der "Paypal"-Spenden-Button wieder im Querformat angelegt ist.

einzig saubere Platzierung wäre einschwebend rechts oder links. Hierfür ist die "Beinahe-Lösung" das Info-Banner, welches aber nur funktioniert, wenn ich vorher über den Entwicklermodus eine Kopie des Banners anlege (nur ein Info-Banner-zulässig, dieses wird bereits für die Datenschutzinfo benötigt). Mit der Kopie des Infobanners funktioniert es halbwegs, allerdings werden dadurch untere Teile der Homepage verdeckt (z. B. "nach Oben").

Das Ganze ist sicherlich ein "Luxus-"Problem, aber wir sind ja hier schließlich in der Rubrik "wünsch dir was"

Aus meiner Sicht würde hier eine Variante von "HTML-Quelltext" mit Angabe der Einblendposition ausreichen, da die Einbindung von externem Bannercode sicherlich die häufigste Anwendung in diesem Zusammenhang ist.

Für einen erfahrenen User ist die Lösung von Mario sicherlich problemlos umzusetzen, durch die (notwendigerweise) Verwendung von individuellem CSS kann es aber später zu Support-Problemen kommen, wenn User sich dieser Anwendung nicht mehr erinnern oder schlichtweg vergessen, bei Support-Anfragen zu erwähnen, welches individuelle CSS verwendet wurde.

Hallo Stefan,

das macht sich wegen der Abmessungen des eingebundenen Bildes schlecht. Mit der Kopie des Info-Banners sieht es jetzt ganz vernünftig aus, insbesondere lässt sich die Werbung auch wegklicken.

Nachtrag: die Kopie vom Infobanner habe ich jetzt wieder verworfen, da zwar in Zeta keine Fehlermeldung angezeigt wird bei Verwendung von Infobanner + Kopie, tatsächlich aber nur ein Banner eingeblendet wird (getestet im in-Private-Modus, um gesetzte Cookies zu umgehen) Auch eine Nachbearbeitung des kopierten Banners (Ersetzung von alertbanner gegen okbanner in widget.json und banner.css bringt da keine Änderung. Grundsätzlich war aber das Ziel gewesen, ohne größere Eingriffe in den Programmcode zu arbeiten, um mögliche Fehlerquellen bei künftigen Updates auszuschließen.

Gelandet bin ich letztlich beim Reservierungs-Popup: Hier musste ich lediglich aus dem von der Handelsplattform zur Verfügung gestellten Script das Bild separat speichern und dann statt mit Quelltext mit einer normalen Verlinkung arbeiten. Da das Werbebild mit 150 x 200 px (Breite x Höhe) in den Ausmaßen nicht zum aufpoppenden Text passte, habe ich noch eine passende Grafik mit CC-0-Lizenz gesucht und eingefügt.

Das Ergebnis könnt Ihr unter http://www.hanabi-pirna.de sehen (und nutzen).

Man muss also nicht immer nach was Neuem schreien, sondern sich manchmal seeehr viel Zeit nehmen, um das Gewünschte auch mit Bordmitteln umzusetzen.