Hallo Ihr Lieben, Hintergrund: wir haben sehr viele Beratungsgespräche via Telefon und das kostet extrem viel Zeit im Lauf eines Tages. Das hat zur Folge, daß nicht jeder Kunden via Telefon durchkommt; trotz mehrerer Versuche... Wir nehmen uns Zeit und gehen während des Telefonats mit dem Kunden in unseren Onlineshop und beraten direkt beim Artikel. Gerade in der Oldtimerszene werden viele Ersatzteile unterschiedlich in den Shops benannt und doch meinen wir alle das Gleichen. Nur, woher soll der Laie in der Suchfunktion die Begriffe eingeben, was er auch meint und sucht. Da kommen viele unterschiedliche Suchbegriffe zusammen, Schreibfehler in Suchbegriffe, ... und dann wird das passende Teil nicht gefunden, obwohl es im Shop enthalten ist... Was passiert ist klar: Kunde ist gefrustet, verläßt den Shop, weil "die" das nicht haben... Hintergrund ist auch, auch wenn Kunden die Wunschteile nicht direkt im Shop finden, dann eine Email mit Fotos/Bilder per Email gesendet wird. Oft sind die Emails so groß, daß gleich das Emailprogramm an der Menge von MB schlapp macht oder gar nicht erst ankommt. Zu 99% sind diese Fotos/Bilder mit einfachen Worten leicht erklärt, dennoch scheut man sich vor einer Beschreibung am Telefon... Natürlich könnte man auch die Suchbegriffe optimieren; auch die Schreibfehler von Kunden mit einbauen - das machen wir auch schon. Jedoch wo fängt man an und hört man auf bei einer schier Unmengen an Artikeln... Idee: Wir möchten technische Zeichnungen so modifizieren/digitalisieren, daß der Kunde seinen Wunschartikel darin anklicken kann und dann die Wahl hat zwischen "weitere Infos" oder "kaufen" (sprich in den Warenkorb legen). Wir glauben, daß wir durch diese Bildsprache das Einkaufverhalten des Wunschartikels vereinfachen können. Wer hat oder kann ein Programm empfehlen, welches einfach zu benutzen ist und auch in Gambio integriert werden kann. Oder andere Lösungsvorschläge, wie wir diese Idee umgesetzt bekommen. Vielleicht sind wir mit dieser Idee/Problematik nicht alleine und es ergeben sich Möglichkeiten, daß Gambio hier für sein Shopsystem dazu was entwickeln könnte... Merci im Voraus und viele Grüße wünscht Britta
Du meinst so wie das beim Slider machbar ist - Teile in einem Bild markieren und verlinken sowie Info-Popup bei Mausover über den Bereich? Vielleicht reicht es dir ja aus, wenn so einen Slider mit 1 Bild erstellst als Kategorie Slider oben einblendest und auf die entsprechenden Artikel verlinkst. Das wäre ohne extras nutzbar. Falls mehr brauchst oder soch noch spezielleres müsste man schauen was es noch so gibt.
Dazu kannst du bei jedem Artikel Zusatzbegriffe für die Suche eingeben. Da kannst alle bekannten Bezeichnungen hinterlegen. Falls self Hostet Shop noch das Modul von Dominik für die bessere Suche Evtl. auch Produktlisten - (Link nur für registrierte Nutzer sichtbar.) Oder alle Artikel der Zeichnung als Atribute darstellen - (Link nur für registrierte Nutzer sichtbar.) generell gibts bei Werbemarkt und Xycons so einiges was self-Hosted Shops sinnige Funktionen anbietet.
Habe nun einige "Image Map generator / creator" durch und ausgiebig getestet. Alle Programme sind eigentlich in der Ansicht und Benutzeroberläche unterschiedlich, jedoch von den Basics alle gleich. Einige sind kostenpflichtig, andere umsonst. Bei den kostenfplichtigen kann die Sprache eingestellt werden, bei den konstenlosen oft nur in englisch möglich. Bei allen Programmen läßt sich der generierte Code zwar herauskopieren und im "Quellcode" an der jeweiligen Stelle im Shop einfügen, jedoch wird dann im Shop IMMER eine leere Seite angezeigt... Der Code speichert nicht intern das eigentliche Bild, sondern nur die Links. Hier muss ich noch mal tüfteln, ob ich erst die eigenliche Sprengzeichnung als Bild in den Shop hochladen muss und dann das Bild mit dem Code belegen muss...??? Irgendwie sehen ich den Wald vor läuter Bäumen nicht mehr, nach mehreren Stunden des Ausprobierens ... Gibt es von deiner / eurer Seite ein paar Tipps, die ich evtl. übersehe?
Hä warum musst du Quellcode kopieren oder einfügen? Welche Software ist Englisch? Ich meinte Gambio Module. Die sind eigentlich alle Deutsch.
Das Problem ist, dass Du das Bild für den jeweiligen Image Map Generator Anbieter vom PC hochlädst und bearbeitest. Du musst aber stattdessen die URL von deinem Bild nehmen, das Du vorher über den Dateimanager in deinen Shop hochlädst. Bearbeite mal ein Bild und füg hier den Code ein. Dann sieht man besser, wo noch Fehler sind. Der Link im HTML Code ist abgekürzt, sieht also nicht folgendermaßen aus: src="(Link nur für registrierte Nutzer sichtbar.)" Sondern so: src="images/das-jeweilige-Bild.jpg" Wenn Du also deinen Code so in deinem Shop einfügst, nimmt der Browser folgendes an: src="(Link nur für registrierte Nutzer sichtbar.)" Damit ist der Link broke, weil nichts dahinter ist. Dewegen lädt auch das Bild nicht, wenn Du den Code in deiner Artikelseite einfügst. Ich habe mal testweise das obiges Bild genommen und ein paar Teile darauf markiert. Ich habe wie oben beschrieben nicht das Bild vom PC hochgeladen, sondern die URL der Adresse genommen, wo ich das Bild vorher hochgeladen habe. So funzt das Ding auch. Mir ist aber aufgefallen, dass wenn man mit der Maus über ein Einzelteil fährt, zwar der Cursor zu einem Finger wird, für mich aber zu wenig ist. Es gibt aber tatsächlich Image Map Generator Anbieter, bei denen man die "Highlight" Funktion einschalten kann, sodass der Hintergrund beim Mouseover bunt wird. Code: <!-- Image Map Generated by http://www.image-map.net/ --> <img src="https://i.postimg.cc/5tvmBVxh/upload-2023-7-25-10-11-45.png" usemap="#image-map"> <map name="image-map"> <area target="_blank" alt="Produkt 1" title="Produkt 1" href="URL-EINFÜGEN" coords="109,398,305,483,301,669,107,574" shape="poly"> <area target="_blank" alt="Produkt 2" title="Produkt 2" href="URL-EINFÜGEN" coords="318,491,553,589,553,780,494,757,444,685,409,658,371,658,343,672,331,681,315,673" shape="poly"> <area target="_blank" alt="Produkt 3" title="Produkt 3" href="URL-EINFÜGEN" coords="97,628,10" shape="circle"> <area target="_blank" alt="Produkt 4" title="Produkt 4" href="URL-EINFÜGEN" coords="126,171,583,305,564,351,557,558,112,365,113,353,268,415,279,268,293,229,132,181,123,347,113,342,114,209" shape="poly"> <area target="_blank" alt="Produkt 5" title="Produkt 5" href="URL-EINFÜGEN" coords="148,193,280,233,266,280,259,403,132,349,138,222" shape="poly"> <area target="_blank" alt="Produkt 6" title="Produkt 6" href="URL-EINFÜGEN" coords="191,672,11" shape="circle"> <area target="_blank" alt="Produkt 7" title="Produkt 7" href="URL-EINFÜGEN" coords="210,677,6" shape="circle"> <area target="_blank" alt="Produkt 8" title="Produkt 8" href="URL-EINFÜGEN" coords="225,681,279,708,275,715,221,689" shape="poly"> <area target="_blank" alt="Produkt 9" title="Produkt 9" href="URL-EINFÜGEN" coords="222,706,251,721,247,725,216,713" shape="poly"> </map> Tipp: Den obigen Code komplett kopieren, Links im Code ersetzen und auf der folgenden Webseite testen: (Link nur für registrierte Nutzer sichtbar.)
ich hatte auch deine Vorschläge angeschaut und hatte allgemein hier meine Erfahrung beschrieben. Ja, deine Lösungsvorschläge sind in deutscher Sprache - das stimmt
Großartigen Danke für die sensationelle Info!!! Habe das jetzt mal mit folgendem Code ausprobiert: <!-- Image Map Generated by http://www.image-map.net/ --> <img src="100403 100404.jpg" usemap="#image-map"> <map name="image-map"> <area target="_self" alt="Stirnwand überhalb von Pedalbodenblech, 2CV 1970 bis 1990" title="Stirnwand überhalb von Pedalbodenblech, 2CV 1970 bis 1990" href="https://www.treffpunkt-citron.de/de...b-von-Pedalbodenblech--2CV-1970-bis-1990.html" coords="112,186,385,220,283,399,13,320" shape="poly"> <area target="_top" alt="Frontscheibenrahmen (unterer Teil), 2CV" title="Frontscheibenrahmen (unterer Teil), 2CV" href="https://www.treffpunkt-citron.de/de...--Motorhaubenscharnierleiste--2CV-AK-228.html" coords="115,184,178,116,458,141,408,224" shape="poly"> <area target="_parent" alt="Dreiecksblech links (Seitenwand A-Säule), 2CV / AK" title="Dreiecksblech links (Seitenwand A-Säule), 2CV / AK" href="https://www.treffpunkt-citron.de/de...d-A-Saeule---elektr--verzinkt---2CV---AK.html" coords="383,223,281,399,277,456,323,500,344,541,392,538,390,305,396,259,410,223" shape="poly"> <area target="_blank" alt="Frontscheibenrahmen -komplett / besser verarbeitet-, 2CV / AK" title="Frontscheibenrahmen -komplett / besser verarbeitet-, 2CV / AK" href="https://www.treffpunkt-citron.de/de...komplett---besser-verarbeitet---2CV---AK.html" coords="246,44,223,57,188,100,116,185,412,223,497,81,513,62,522,51,535,43,541,38" shape="poly"> </map> auch hier leider kein Bild zur Kontrolle. Ich stehe auf dem Schlauch... was mache ich falsch?
Hast du das Bild mit dieser Bezeichnung im Shop-Dateimanager hochgeladen? <img src="100403 100404.jpg" usemap="#image-map"> Dann muss diese Zeile so aussehen: <img src="images/100403 100404.jpg" usemap="#image-map"> wie O.C. hier erklärt hat:
Muss aber nicht zwangsläufig sein, je nach dem, wo genau das Bild gespeichert wird. Außerdem ist mir das Leerzeichen im Link sehr suspekt. Würde normalerweise durch ein Plus-Zeichen oder "%20" ersetzt werden. @Brittchen Deswegen würde ich empfehlen, dass Du mal die ganze URL vom Bild dort einsetzt. Geh also folgendermaßen vor: 1. Dateimanager > Images Ordner aufrufen 2. Bild hochladen 3. Rechtsklick auf das hochgeladene Bild 4. URL kopieren wählen und "kopieren" klicken. Jetzt die komplette URL hier einsetzen: <img src="URL HINZUFÜGEN" usemap="#image-map"> So sollte es ungefähr aussehen: <img src="(Link nur für registrierte Nutzer sichtbar.)" usemap="#image-map"> Noch ein Tipp: Wenn Du hier Codes mit uns teilen möchtest, klick bitte oben in der Zeile auf das kleine Quadrat mit dem + und dann klick auf "Code". Dann sind Codes deutlich besser zu lesen.
ja, teile gerne die Infos. Ich werkel mal ein wenig und teile gerne dann die neuesten Infos Ich stimme dir zu, denn fürs Auge fände ich auch einen Mouseover oder ein anderes optisches "ins Auge springend" schöner...
So! Es gibt Neuigkeiten Wir haben nun alle Sprengzeichnungen so modifiziert, daß alle Links funktionieren und auch die detaillierten Kurzinfos beim "overflow" angezeigt werden. Nachteil: zu vielen Infos auf einmal und Kunde verliert die Übersicht. Wir haben das nun differenziert und nur noch die Artikelüberschrift mit Preis angezeigt. Möchte Kunde mehr Infos, so muss dieser aktiv werden... > Fazit: wie schon geschrieben, ist die Vorbereitung (Aufbereitung, Verlinkung und in den Shop einsetzen) NICHT zu unterschätzen!!! Da gehen Stunden drauf! und die Übersicht muss zwingend beibehalten werden. So manches Mal verzettelt man sich, verzweifelt und verliert "sprichwörtlich" die Übersicht... Jedoch lohnt es sich sehr
Update * Update *Update *Update *Update *Update *Update Vorab: es ist VIEL Arbeit und man muss das aktiv wollen! Es lohnt sich! Wir sind den Weg gegangen und sagen "Danke" für die vielen Tipps. Hier ist das Ergebnis: https://www.treffpunkt-citron.de/de/info/waehle-deine-sprengzeichnung.html Wir haben es am 01.01.2024 gelauncht und wird sehr gut angenommen. Es erleichtert die vielen Erklärungsversuche, wenn Kunden keine Fachkenntnisse haben. Die Vorteile sind vielfältig für beide Seiten (Kunde & Verkäufer). Liebe Grüße; Britta
@Brittchen, sieht toll aus. Habt Ihr super umgesetzt. Glückwunsch! Edit: Eine Anregung hätte ich aber noch. Vielleicht macht es Sinn, bei den Bildern noch die Klasse "img-responsive" hinzuzufügen. Schon unter 1800px sprengen die Bilder den Rahmen des Shops. Mobil ist es noch gravierender, da muss man ellenlang nach links und rechts scrollen. Mit class="img-responsive" Ohne class="img-responsive"
Sehr cool gemacht! Habt ihr das nun mit "Image-Map" umgesetzt? Eine Sache noch, "Sprengzeichnung" m.E. ein veralteter Begriff, wir Konstrukteure reden da von Explosionszeichnung / Explosionsdarstellung, ich glaub das kennen die meisten - ist aber Geschmacksache. Soll beim Mouseover etwas angezeigt werden? Bei mir im Safari und im Chrome ist das nicht der Fall. Ansonsten, top!
Hallo v-pixel, merci für deine Rückmeldung. Wir haben die nötigen "Sprenzeichnungen" alle bearbeitet, zusammengefügt (je nach Kategorie) und dann später mit einer Software für "Image map" verlinkt. Nicht zu vergessen: das Wasserzeichen ist Teil des Bildes. Zu viele Fehlerquellen ergab das automatisch "darübergebügelt" vom Onlineshop. Entschieden haben wir uns bewußt für das Wort "Sprengzeichnungen" und aus dem Grunde, da die meisten unserer Kunden dies so verwenden. Danke für deine Info. SAFARI & Chrome: wir hatten je eine veraltete Software und, nach dem Update auf neueste Version, hat es auch bei uns dann funktioniert. Viele Grüße; Britta
Merci nochmal auch für deine Hilfe. Jetzt werkel ich wieder an diesem Thema, da es neue Artikel im Sortiment gibt. In diesem Zusammenhang hatt ich mich gar nicht mehr darum gekümmert wegen der übergroßen Ansichten. wo kann ich das ändern? Merci für Hilfe