Kalender einbauen in eigene Homepage

krecki

Enthusiast
Thread Starter
Mitglied seit
11.01.2005
Beiträge
4.259
Ich suche einen Kalender in der Monatsansicht, den man problemlos in die eigene HP einbauen kann, der kostenlos ist.

Er sollte auch nicht groß sein und man sollte auch termine eintragen können!

Kennt jemand einen anbieter?

Er sollte auf HTML bzw Javascript Basis funktionieren
 
Zuletzt bearbeitet:
Wenn Du diese Anzeige nicht sehen willst, registriere Dich und/oder logge Dich ein.
nicht schlecht, nur leider ist die Werbung recht groß...
 
kann man abstellen, kostet dann allerdings was, glaub ich zumindest. ansonsten setzt dich mal mit PHPnuke, PHPKit oder PHPFusion auseinander kann nur sagen N1
 
PHP Beherrsche ich leider nicht
 
Wenn du dich mit Javascript etwas auskennst, kannst du vielleicht hiermit etwas anfangen, diesen Kalender hab ich mal erstellt.
Der Kalender (Aktueller- und Nächstermonat) sowie die Einträge werden in Div
Container Ausgegeben, und können auf der Seite frei platziert werden.
Die Kalendereinträge musst du allerdings Hartcodiert in ein Array im Quelltext eintragen.
Code:
<style>
a {color:#666666; text-decoration:none; font-weight:normal;      }
a.workday         { font-family: Verdana, Arial; color: #5C5DAF; font-size: 9px; text-decoration: none; } 
a.workday:link    { font-family: Verdana, Arial; color: #5C5DAF; font-size: 9px; text-decoration: none; } 
a.workday:visited { font-family: Verdana, Arial; color: #5C5DAF; font-size: 9px; text-decoration: none; } 
a.workday:hover   { font-family: Verdana, Arial; color: #FF9301; font-size: 9px; text-decoration: none; }
a.sunday:active   { font-family: Verdana, Arial; color: #000080; font-size: 9px; text-decoration: none; }
a.sunday          { font-family: Verdana, Arial; color: #FF9301; font-size: 9px; text-decoration: none; } 
a.sunday:link     { font-family: Verdana, Arial; color: #FF9301; font-size: 9px; text-decoration: none; } 
a.sunday:visited  { font-family: Verdana, Arial; color: #FF9301; font-size: 9px; text-decoration: none; } 
a.sunday:hover    { font-family: Verdana, Arial; color: #CC0000; font-size: 9px; text-decoration: none; }
a.sunday:active   { font-family: Verdana, Arial; color: #800000; font-size: 9px; text-decoration: none; }
.text             { font-family: Verdana, Arial; color: #5C5DAF; font-size: 9px; text-decoration: none; } 
#kalender  { position:absolute; width:200px; top:150px; margin-left:150px; overflow:hidden; z-index: 1; }
#eintraege { position:absolute; width:300px; top:150px; margin-left:350px; overflow:hidden; z-index: 2; }
</style>
		<body>
		<div id="kalender">
		<script type="text/javascript">
		<!--
		var d = new Date();
		var dm1 = d.getMonth() + 1;
		var dm2 = d.getMonth() + 2;
		var dj1 = d.getFullYear();
		var dj2 = d.getFullYear();
		
		//Kalendereintraege!!!
		Kalendereintraege = new Array();
		Kalendereintraege['1.7.2006'] = "Eintrag 1";
		Kalendereintraege['9.7.2006'] = "Eintrag 6";
		Kalendereintraege['27.7.2006'] = "Eintrag 2";
		Kalendereintraege['30.7.2006'] = "Eintrag 7";
		Kalendereintraege['10.8.2006'] = "Eintrag 3";
		Kalendereintraege['15.8.2006'] = "Eintrag 4";
		Kalendereintraege['17.8.2006'] = "Eintrag 5";
		Kalendereintraege['20.8.2006'] = "Eintrag 5";
		Kalendereintraege['21.7.2006'] = "Eintrag 5";
		
		if(dm1 == "12"){ 
		  dm2 = "1" ;
		  dj2 = d.getFullYear() + 1;
		}
		Kalender(dm1,dj1);
		document.write('<br>');
		Kalender(dm2,dj2);
		document.write('<br>');
		function Kalender(Monat,Jahr) {
		Monatsname = new Array ("Januar",
								"Februar",
								"März",
								"April",
								"Mai",
								"Juni",
								"Juli",
								"August",
								"September",
								"Oktober",
								"November",
								"Dezember");
		Tag = new Array ("Mo","Di","Mi","Do","Fr","Sa","So");
		var KSchrArt     = "Verdana,Arial"; /* Schriftart Kalenderkopf */
		var KSchrGroesse = 1;               /* Schriftgroesse 1-7 Kalenderkopf */
		var KSchrFarbe   = "#000080";       /* Schriftfarbe Kalenderkopf */
		var Khgrund      = "#F0F0F8";       /* Hintergrundfarbe Kalenderkopf */
		var TSchrArt     = "Verdana,Arial"; /* Schriftart Tagesanzeige */
		var TSchrGroesse = 1;               /* Schriftgroesse 1-7 Tagesanzeige */
		var TSchrFarbe   = "#000000";       /* Schriftfarbe Tagesanzeige */
		var Thgrund      = "#FFFFFF";       /* Hintergrundfarbe Tagesanzeige */
		var Thgrund2     = "#dddddd";       /* Hintergrundfarbe Tagesanzeige mit Kalendereintrag*/
		var SoFarbe      = "#E00000";       /* Schriftfarbe f. Sonntage */
		var Ahgrund      = '#FFFFFF" style="border:1px solid #FF0000;"';       /* Hintergrundfarbe f. heutigen Tag */
		var Ahgrund2     = '#dddddd" style="border:1px solid #FF0000;"';       /* Hintergrundfarbe f. heutigen Tag mit Kalendereintrag*/
		var workday		 = "workday";
		var sunday 		 = "sunday";
		var jetzt       = new Date();
		var DieserMonat = jetzt.getMonth() + 1;
		var DiesesJahr  = jetzt.getFullYear();
		if(DiesesJahr < 999) DiesesJahr+=1900;
		var DieserTag   = jetzt.getDate();
		var Zeit        = new Date(Jahr,Monat-1,1);
		var Start       = Zeit.getDay();
		if(Start > 0) Start--;
		else Start = 6;
		var Stop = 31;
		if(Monat==4 ||Monat==6 || Monat==9 || Monat==11 ) --Stop;
		if(Monat==2) {
		 Stop = Stop - 3;
		 if(Jahr%4==0) Stop++;
		 if(Jahr%100==0) Stop--;
		 if(Jahr%400==0) Stop++;
		}
		document.write('<table border="0" cellpadding="1" cellspacing="2">');
		var Monatskopf = Monatsname[Monat-1] + " " + Jahr;
		SchreibeKopf(Monatskopf,Khgrund,KSchrFarbe,KSchrGroesse,KSchrArt);
		var Tageszahl = 1;
		for(var i=0;i<=5;i++) {
		  document.write("<tr>");
		  for(var j=0;j<=5;j++) {
		  	foo = Tageszahl+"."+Monat+"."+Jahr;
		    if((i==0)&&(j < Start))
		     SchreibeZelle2("",Thgrund,TSchrFarbe,TSchrGroesse,TSchrArt);
		    else {
		      if(Tageszahl > Stop)
		        SchreibeZelle2("",Thgrund,TSchrFarbe,TSchrGroesse,TSchrArt);
		      else {
		        if((Jahr==DiesesJahr)&&(Monat==DieserMonat)&&(Tageszahl==DieserTag)){
		        	if(Kalendereintraege[foo] != null){
		         		SchreibeZelleE2(Tageszahl,Ahgrund2,TSchrFarbe,TSchrGroesse,TSchrArt,Monat,Jahr,workday);
		        	}else{
		        		SchreibeZelle2(Tageszahl,Ahgrund,TSchrFarbe,TSchrGroesse,TSchrArt,Monat,Jahr,workday);
		        	}
			     }
			    else
			    	if(Kalendereintraege[foo] != null){
		         		SchreibeZelleE2(Tageszahl,Thgrund2,TSchrFarbe,TSchrGroesse,TSchrArt,Monat,Jahr,workday);
		         	}else{
		         		SchreibeZelle2(Tageszahl,Thgrund,TSchrFarbe,TSchrGroesse,TSchrArt,Monat,Jahr,workday);
		         	}
		         Tageszahl++;
		        }
		      }
		    }
		    foo = Tageszahl+"."+Monat+"."+Jahr;
		    if(Tageszahl > Stop)
		      SchreibeZelle2("",Thgrund,SoFarbe,TSchrGroesse,TSchrArt,Monat);
		    else {
		      if((Jahr==DiesesJahr)&&(Monat==DieserMonat)&&(Tageszahl==DieserTag))
		    	if(Kalendereintraege[foo] != null){
			        SchreibeZelleE2(Tageszahl,Ahgrund2,SoFarbe,TSchrGroesse,TSchrArt,Monat,Jahr,sunday);
			    }else{
			    	SchreibeZelle2(Tageszahl,Ahgrund,SoFarbe,TSchrGroesse,TSchrArt,Monat,Jahr,sunday);
			    }
		      else
		    	if(Kalendereintraege[foo] != null){
			        SchreibeZelleE2(Tageszahl,Thgrund2,SoFarbe,TSchrGroesse,TSchrArt,Monat,Jahr,sunday);
			    }else{
			    	SchreibeZelle2(Tageszahl,Thgrund,SoFarbe,TSchrGroesse,TSchrArt,Monat,Jahr,sunday);
			    }
		      Tageszahl++;
		    }
		    document.write("<\/tr>");
		  }
		document.write("<\/table>");
		}
		function SchreibeKopf(Monatstitel,HgFarbe,SchrFarbe,SchrGroesse,SchrArt){
			document.write("<tr>");
			document.write('<td align="center" colspan="7" valign="middle" bgcolor="'+HgFarbe+'">');
			document.write('<font size="'+SchrGroesse+'" color="'+SchrFarbe+'" face="'+SchrArt+'"><b>');
			document.write(Monatstitel);
			document.write("<\/b><\/font><\/td><\/tr>");
			document.write("<tr>");
			for(var i=0;i<=6;i++)
			  SchreibeZelle1(Tag[i],HgFarbe,SchrFarbe,SchrGroesse,SchrArt);
			document.write("<\/tr>");
		}
		function SchreibeZelle1(Inhalt,HgFarbe,SchrFarbe,SchrGroesse,SchrArt,Monat,Jahr){
			document.write('<td align="center" valign="middle" bgcolor="'+HgFarbe+'">');
			document.write('<font size="'+SchrGroesse+'" color="'+SchrFarbe+'" face="'+SchrArt+'">');
			document.write(Inhalt);
			document.write("<\/font><\/td>");
		}
		function SchreibeZelle2(Inhalt,HgFarbe,SchrFarbe,SchrGroesse,SchrArt,Monat,Jahr,Class){
			document.write('<td align="center" valign="middle" bgcolor="'+HgFarbe+'">');
			document.write('<font size="'+SchrGroesse+'" color="'+SchrFarbe+'" face="'+SchrArt+'"><b>');
			document.write('<a href="#'+Inhalt+'.'+Monat+'.'+Jahr+'" class="'+Class+'">');
			document.write(Inhalt);
			document.write('</a>');
			document.write("<\/b><\/font><\/td>");
		}
		function SchreibeZelleE2(Inhalt,HgFarbe,SchrFarbe,SchrGroesse,SchrArt,Monat,Jahr,Class){
			document.write('<td align="center" valign="middle" bgcolor="'+HgFarbe+'">');
			document.write('<font size="'+SchrGroesse+'" color="'+SchrFarbe+'" face="'+SchrArt+'"><b>');
			document.write('<a href="#'+Inhalt+'.'+Monat+'.'+Jahr+'" class="'+Class+'">');
			document.write(Inhalt);
			document.write('</a>');
			document.write("<\/b><\/font><\/td>");
		}
		//-->
		</script>
		</div>  
		
		<div id="eintraege" class="text">
		<!-- Kalendereintraege Ausgeben: //-->
		<script type="text/javascript">	
		<!--
		for (var Eigenschaft in Kalendereintraege){
      		document.write("<a name='"+Eigenschaft+"'>"+Eigenschaft + "</a>: "+Kalendereintraege[Eigenschaft]+"<br /><br /><br /><br /><br /><br /><br /><br />");
      	}
      	//-->
		</script>
		</div>		
		<body>
 
Das ja mal interessant.
Google wird immer cooler. Erst die geile Google-Maps API und jetzt der Kalender...
 
Hardwareluxx setzt keine externen Werbe- und Tracking-Cookies ein. Auf unserer Webseite finden Sie nur noch Cookies nach berechtigtem Interesse (Art. 6 Abs. 1 Satz 1 lit. f DSGVO) oder eigene funktionelle Cookies. Durch die Nutzung unserer Webseite erklären Sie sich damit einverstanden, dass wir diese Cookies setzen. Mehr Informationen und Möglichkeiten zur Einstellung unserer Cookies finden Sie in unserer Datenschutzerklärung.


Zurück
Oben Unten refresh