Wusstest du schon?
Dass du die Box auch in deine Website einbinden kannst?
Dass du die Box auch in deine Website einbinden kannst?
Inhalt:
1. Wie binde ich die Box in meine Website ein?
2. Wie kann ich nur spezielle Einträge auslesen lassen?
3. Hinweise
Wie binde ich die Box in meine Website ein?
Methode 1 | Methode 2 |
Man bindet lediglich eine JavaScript Datei ein (siehe unten). Auf der Seite muss ein Div-Container mit der ID "ds_dyk" sein. In dieses Div wird die Info vom JavaScript eingetragen. Bindet man den JavaScript Code in den Div Container ein, entfernt er sich selbst durch das Eintragen der Info. | Man benötigt einen JavaScript Code zum nachladen der Info und eine Serverseitige Datei auf dem eigenen Server, welche die Information von uns abfragt. Unter dieser Tabelle findet man ein Beispiel dazu. |
Pro / Contra Sehr einfach einzubauen. Dafür nimmt man aber in Kauf, dass die Geschwindigkeit zum Laden der Seite zusätzlich verlangsamt wird durch das Warten auf die Antwort von unserem Server. | Pro / Contra Keine zusätzliche Ladezeit für die Seite selbst.Es besteht die Möglichkeit nur spezielle Themengebiete anzeigen zu lassen. Die Größe des Div-Containers könnte sich durch die Info nochmal verändern. |
Wir empfehlen Methode 2
Bei dieser Methode haben wir die Website, ein JavaScript und ein Serverseitiges Script (in unserem Beispiel mit PHP gelöst).
HTML-Quellcode
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
- <html>
- <head>
- <title>Did you know?</title>
- </head>
- <body>
- <div id="ds_dyk">
- <img src="/images/views/laden.gif" alt="loading" />
- <script src="http://honsource.de/dev/js_didyouknow.js" type="text/javascript"></script>
- </div>
- </body>
- </html>
Quellcode
- function getHTTPObject(){
- if (window.ActiveXObject)
- return new ActiveXObject("Microsoft.XMLHTTP");
- else if (window.XMLHttpRequest)
- return new XMLHttpRequest();
- else {
- //Fehlerbearbeitung
- return null;
- }
- }
- function setOutput(){
- if(httpObject.readyState == 4){
- document.getElementById('NAME DES DIV').innerHTML = httpObject.responseText;
- }
- }
- httpObject = getHTTPObject();
- if (httpObject != null) {
- httpObject.open("GET", "DATEIPFAD/DATEINAME.php", true);
- httpObject.send(null);
- httpObject.onreadystatechange = setOutput;
- }
NAME DES DIV | Die ID des Div-Containers, in welchen die Antwort eingetragen werden soll. |
DATEIPFAD/DATEINAME | Pfad zu der (PHP-)Datei auf eurem Server. |
//Fehlerbearbeitung | Hier geht es um Gäste, deren Browser gewollt oder ungewollt den Vorgang nicht unterstützen. |
?content=0 | Siehe 2. Wie kann ich nur spezielle Einträge auslesen lassen? |
Ergebnis
Mit CSS
Wie kann ich nur spezielle Einträge auslesen lassen?
Es muss Methode 2 verwendet werden, damit nur spezielle Themen ausgelesen werden können. Dazu muss an der Stelle
der Wert hinter ?content= angepasst werden:
"content" kann sieben verschiedene Werte annehmen:
0: Alle drei Themen werden ausgelesen.
1: Nur "Hintergrund" wird ausgelesen.
2: Nur "Daten & Werte" wird ausgelesen.
3: Nur "Besonderheiten" wird ausgelesen.
4: "Hintergrund" und "Daten & Werte" werden ausgelesen.
5: "Hintergrund" und "Besonderheiten" werden ausgelesen.
6: "Daten & Werte" und "Besonderheiten" werden ausgelesen.
Hinweise
Bei Fragen, Vorschlägen und Kritik schreibt hier, schickt mir eine PN oder schreibt eine E-Mail (ramius@dotasource.de) an mich.
Es wird bei der Verwendung des Scripts registriert, dass eure Website das Script verwendet. Bei Nutzung der Box muss der Link zu "dotasource.de" gut sichtbar sein und auf dotasource.de verweisen.
DotaSource.de übernimmt keine Haftung für eventuell auftretende Fehler oder Schäden durch die Verwendung der "Wusstest du schon?"-Box und aller dazugehörigen Scripte.
Ich wünschen euch und euren Besuchern viel
Spaß mit den vielen kleinen Informationen und
Bedanke mich hiermit bei jedem einzelnen, der
an den Inhalten mitgewirkt hat.
ramius