Suche im Forum:
Suchen


Autor Nachricht
Beitrag29.10.2011 um 14:21 (UTC)    
Titel: Extra Gästebuch: Grußkarte u Bilder den Einträgen hinzufügen

Hallo,

mit dem folgenden Script erhält das Extra Gästebuch eine Grußkartenfunktion und Gäste
können ihren Einträgen auch eigene Bilder hinzufügen.

Bsp: http://o-4-n-test.de.tl/G.ae.stebuch.htm

Zitat:
<script type="text/javascript">var name="G.ae.stebuch",entrys=[],tds=document.getElementsByTagName("td"),mes=document.getElementById("kommentartext"); function createImgBB(c){c=document.getElementById("o4ngbimgaddinp").value.toLowerCase();return c.indexOf("http://")!=-1?c.substr(c.length-4,4)==".jpg"||c.substr(c.length-4,4)==".gif"||c.substr(c.length-4,4)==".png"?(mes.value+="[img]"+c+"[/img]",mes.focus(),true):(alert("Falsches Bildformat! Nur: .jpg, .gif, .png"),document.getElementById("o4ngbimgaddinp").focus(),false):(alert("Falsche URL"),document.getElementById("o4ngbimgaddinp").focus(),false)} function greetingCard(c){mes.value+="[img]"+c+"[/img]";mes.focus();return false} function createTheImg(){var c,f,d,b,a,h,g=[];for(c=0;c<entrys.length;c++){h=entrys[c].childNodes;for(f=0;f<h.length;f++){a=h[f].nodeValue;if(h[f].nodeName=="IMG")d=document.createElement("img"),d.src=h[f].src,d.style.border="0",g.push(d);if(a){a.indexOf("[img]");for(a.indexOf("[/img]");a.length>0&&a.indexOf("[img]")!=-1&&a.indexOf("[/img]")!=-1; ) d=a.indexOf("[img]"),b=a.indexOf("[/img]"),d<b?d>0?(b=a.substr(0,d),b=document.createTextNode(b),g.push(b),a=a.substr(d,a.length-d)) : (d=a.substr(d+5,b-d- 5),a=a.substr(b+6,a.length-b+6),b=document.createElement("img"),b.style.border="none",b.style.margin="5px",b.style.maxWidth="300px",b.src=d,b.alt="Bild",d=document.createElement("p"),d.appendChild(b),g.push(d)):b==0?a=a.substr(b+6,a.length-6):a=a.substr(0,b)+a.substr(b+6,a.length-b-6);a.length>0&&(b=document.createTextNode(a),g.push(b))}}for(;entrys[c].childNodes.length>0;)entrys[c].removeChild(entrys[c].firstChild);for(f=0;f<g.length;f++)entrys[c].appendChild(g[f]);g=[]}} if(window.location.href.toLowerCase().indexOf(name.toLowerCase())!=-1){if(mes){var i,j=0,ntr=document.createElement("tr"),ntd1=document.createElement("td"),ntd2=document.createElement("td"),ninputtxt=document.createElement("input");ninputtxt.id="o4ngbimgaddinp";ninputtxt.placeholder="Bild URL";ninputtxt.type="text";ninputtxt.style.display="block";ninputtxt.style.width="150px";var ninputbut=document.createElement("input");ninputbut.id="o4ngbimgaddbut";ninputbut.value="einfügen";ninputbut.type= "button";ninputbut.onclick=createImgBB;var ntxt=document.createTextNode("Eigenes Bild einfügen:");ntd1.appendChild(ntxt);ntd2.appendChild(ninputtxt);ntd2.appendChild(ninputbut);ntr.appendChild(ntd1);ntr.appendChild(ntd2);mes.parentNode.parentNode.parentNode.insertBefore(ntr,mes.parentNode.parentNode)}else{var e=document.getElementById("o4ngkdiv");e&&e.parentNode.removeChild(e)}for(i=0;i<tds.length;i++)tds[i].width=="25%"&&tds[i].firstChild&&tds[i].firstChild.nodeValue=="Nachricht:"&&tds[i+1].width== "75%"&&i+1<tds.length&&(entrys[j]=tds[i+1],j++,i++);entrys.length>0&&createTheImg()};</script>

Das rote ersetzt ihr mit dem Namen eures Gästebuches,
so wie er in der URL(siehe Beispiel, mein Gästebuch hat den Namen Gästebuch) steht.

Danach einfach kopieren und bei
Arrow Klicke hier: http://www.homepage-baukasten.de/design.php
Arrow Reiter "Erweiterte Einstellungen"
Arrow Text unter dem Design
einfügen.


Eure Grußkarten könnt ihr jetzt wie folgt bei:
Arrow Klicke hier: http://www.homepage-baukasten.de/extras.php?extra=gbook&mode=edit
Arrow Text vor dem Gästebuch
einfügen.

Zitat:
<div id="o4ngkdiv">
<p>
<a href="javascript:void(0);" onclick="greetingCard(this.firstChild.src);"><img src="URL zu Grußkarte 1" alt="g1"></a>

<a href="javascript:void(0);" onclick="greetingCard(this.firstChild.src);"><img src="URL zu Grußkarte 2" alt="g2"></a>
</p>
</div>

Das Html könnt ihr weitestgehend selbst gestalten.
WICHTIG ist nur, dass ihr dem äußersten Element die grüne id zuweist. Andernfalls, wird das Javascript nicht ausgeführt!
Am besten lasst ihr also das braune div Element als Container.

Wenn ihr mehr als 2 Grußkarten einfügen wollt, dann kopiert einfach das orangene.

Das blaue müsst ihr jeweils mit der URL des entsprechenden Bildes ersetzen.

Natürlich könnt ihr das ganze auch beliebig per CSS gestalten.
______________
mfg
o-4-n

"If you’re incompetent, you can’t know you’re incompetent." - [David Dunning]

*** Die Suchfunktion ist KEINE tödliche Krankheit! ***

Eventplanung, Equipment, Zeltverleih, Catering


Zuletzt bearbeitet von o-4-n am 15.11.2011, 19:23, insgesamt 4-mal bearbeitet
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de