Mit unserem neuen Script könnt ihr sehen wie oft bestimmte Links oder Downloads angeklickt wurden. Dieses Script verwenden wird auch bei uns im eigenen Blog und ist euch bestimmt schon einmal aufgefallen. Schicke Counts im Facebook Stil!
Unsere Idee war es ein Script zu entwicklen, welches die Anzahl der Klicks auf einen Link oder Download anzeigt. Am besten im schicken und modernen Facebook Like-Button Stil.
Es ist uns gelungen ein solches Script zu erstellen und möchten euch dieses natürlich nicht vorenthalten.
Update
Nun gibt es den Download Counter auch für jQuery!
Die Funktion
Nach dem Einbinden unseres JavaScripts sowie Mootools muss dem Link im Prinzip nur noch die Klasse class=“downloadCounter“ mitgeteilt werden. Danach werden ein paar Elemente, welche Ihr mittels CSS auf eure eigenen Bedürfnisse anpassen könnt angehangen und die entsprechende Funktion vollautomatisch hergestellt.
Das Zählen und Auslesen funktioniert im Groben über Ajax HTML Requests und PHP zum Speichern der Counts (in Textdateien).
Außerdem gibt es natürlich einen Schutz auf Cookie-Basis gegen massives Klicken. Es wird also auch bei mehrmaligem Klicken nur ein Klick gezählt.
Zudem erkennt unser Script gleich-verweisende Links auf einer Seite, wodurch bei einem Klick natürlich sofort beide hochgezählt werden (siehe Beispiel oben). Solltet ihr gleiche Links auf verschiedenen Seiten nutzen, werden natürlich alle Klicks zusammen gezählt und angezeigt.
Internet Explorer 6 natürlich supported!
Download für Mootools und jQuery
Hier könnt ihr das gesamte Paket inkl. Mootools und einer fertigen Demo herunterladen. Darin sind u.a. CSS-Styles und Bilder enthalten, damit euer Counter so aussieht wie unser.
Und hier bekommt ihr das gesamte Paket für jQuery.
What to do
Wichtig ist der Ordner „downloadCounter“ in dem zwei PHP-Dateien liegen. Dieser muss mit in euer Projekt kopiert/hochgeladen werden. Außerdem muss darauf geachtet werden, dass die URL zu diesem Ordner in der dlcounter.js richtig gesetzt ist. Dafür gibt es am Anfang dieser Datei eine Variable.
Sollte danach etwas nicht wie gewünscht funktionieren, müsst ihr nochmals die Pfade in der dlcounter.js und ggf. den beiden PHP Dateien im Ordner „downloadCounter“ überprüfen (es ist ein bisschen verwirrend).
Schaut euch einfach das Beispiel an, bei Problemen mit dem Firebug rein und es sollte im Prinzip ein leichtes sein dieses Script zu nutzen.
Viel Spaß beim beobachten!
