Wordpress - Geizhals Link Hover Preview

Starko

Cadet 3rd Year
Registriert
Feb. 2009
Beiträge
45
Hallo,
ich würde ich meinem Wordpress Blog gerne Geizhals Links genauso schön einbetten wie das hier im Forum der Fall ist. Bei einem Mausover kommt dieses praktische kleine Vorschaubild zusammen mit dem Namen des Artikels.
https://geizhals.de/877395
Leider finde ich keine Informationen darüber, wie das hier umgesetzt wurde. Fraglich ist natürlich, ob ich dass dann überhaupt für Wordpress übernehmen kann, aber das kann ich immer noch recherchieren, sobald ich einen Anhaltspunkt habe.

Für Tipps wäre ich dankbar. Danke schön!

Gruß
 
Zuletzt bearbeitet:
Ist doch recht einfach. Das Script, das für diese Geizhals-Einblendungen verantwortlich ist, heißt "geizhals-tooltips.20150823.js", zu finden unter
Code:
https://www.computerbase.de/js/forum/geizhals-tooltips.20150823.js

Wenn du jetzt mit der Maus über einen Geizhals-Link fährst, wird ein Mouseover-Event gestartet, dass die Daten für das Produkt aus der Preisvergleichs-API von Computerbase zieht. Das ist einfach nur ein $.get auf die URL
Code:
/api/geizhals-items?itemids=877395&timestamp=1454222494&hash=73c0c41b4f6f7dd5b26cbceb629d558e1a5f6354f65a4fbbcd4253e9ac52e6e7
Dabei ist zu beachten, dass in der Anfrage ein Zeitstempel drin ist und die Anfrage noch "signiert" wird. Der Zeitstempel sorgt dafür, dass die API irgendwann nicht mehr antworten wird, wenn der Zeitstempel zu weit in der Vergangenheit liegt (etwa nach 20-30 Sekunden). Und ohne einen gültigen Hash funktioniert das Ganze auch nicht. Klassische Methode beim Aufbau von APIs.
Den Zeitstempel und den Hash bekommt man aus dem Quelltext und der steht in
Code:
<div id="geizhals-tooltip-params" data-params="itemids=877395&amp;timestamp=1454223402&amp;hash=70a8599152cdef563c897b468526e648a6cdcb372b85a2cbbf411d36eac591e0"></div>
Wenn du schnell genug bist, kannst du diesen Thread hier nehmen, die "data-params" auslesen und den Link von oben zusammensetzen. Dann bekommst du einfach einen JSON-String zurück, wenn du die URL im Browser eingibst.
 
Zurück
Oben