Termin Kalender für deine Homepage

Hier könnt ihr nützliches reinstellen, wenn ihr was gefunden habt.

Moderator: HTML-Laie

Benutzeravatar
Jasko
Globaler Moderator
Globaler Moderator
Beiträge: 3277
Registriert: Di 21. Feb 2012, 06:59
Mein Vorname: Herr Jasmin ;)
Wohnort: Rheinland-Pfalz
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von Jasko »

Hallo moni,

Ja das kann gut sein das sich da die css in die Quere kommen. Ich habe den einbau ganz bewusst in zwei farblich und stylisch ganz verschiedene styles gemacht das man sehen kann das eine anpassung an die eigene HP kein Problem ist.
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8331
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von moni »

Hallo Jasmin ... habe den Kalender zu erst einfach so wie der ist an meine webspace geladen ..

http://www.blicke1.de/event-kalender/index.php

In den config.php entsprechend die angaben gemacht doch komme dann nicht weiter mit den Termine einfügen !

Wie komme ich an so diese Seite ?
http://jaskoscript.net/calender/

Habe auch in den Datenbank rein geschaut und könnte kein neuen Eintrag finden, auch komisch :E
Brauche deine Hilfe beim Installieren !

wen der einwandfrei installiert wird da will erst dann an mein style anpassen
Viele Grüße ...Monika
Benutzeravatar
Butterblume
Held des Forums
Held des Forums
Beiträge: 7505
Registriert: Fr 3. Aug 2012, 16:33
Mein Vorname: Karin
Wohnort: Peine / Niedersachsen
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von Butterblume »

Kussi... und Bild für all eure Bemühungen!

Butterblume / Karin

https://www.karins-poserbilder.de
Benutzeravatar
Jasko
Globaler Moderator
Globaler Moderator
Beiträge: 3277
Registriert: Di 21. Feb 2012, 06:59
Mein Vorname: Herr Jasmin ;)
Wohnort: Rheinland-Pfalz
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von Jasko »

moni hat geschrieben:
In den config.php entsprechend die angaben gemacht doch komme dann nicht weiter mit den Termine einfügen !

Wie komme ich an so diese Seite ?
http://jaskoscript.net/calender/

Habe auch in den Datenbank rein geschaut und könnte kein neuen Eintrag finden, auch komisch :E
Brauche deine Hilfe beim Installieren !
Hallo moni,

ich habe jetzt einige änderungen am Kalender gemacht, nichts großartiges, aber bevor du weiter machst, hole dir am bessten die neue Version von Github. Die hat jetzt eine installations Datei drin.

Du machst wieder wie auch vorher, die config.php anpassen, und dann rufst du die install.php Datei im browser auf, wenn du in der config.php alles richtig eingegeben hast sollte jetzt nur eine Zeile ausgegeben werden, mit der Info das die Tabelle eventcalender erfolgreich angelegt wurde. Jetzt kannst du die veränderungen machen die du möchtest.

Vorher musste man auch die Tabele in der Datenbank selber anlegen, darum hat es bei dir nicht geklappt.

MFG
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8331
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von moni »

Danke Jasmin ! es hat gut geklappt ,nur noch an die style anpassen :)

http://www.blicke1.de/event-kalender/index.php
Viele Grüße ...Monika
Benutzeravatar
Butterblume
Held des Forums
Held des Forums
Beiträge: 7505
Registriert: Fr 3. Aug 2012, 16:33
Mein Vorname: Karin
Wohnort: Peine / Niedersachsen
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von Butterblume »

Hast deine Mittagspause schon drin! :D
Kussi... und Bild für all eure Bemühungen!

Butterblume / Karin

https://www.karins-poserbilder.de
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8331
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von moni »

Hallo Jasmin .. den kalender-selber lässt sich farblich usw gut gestellten doch das einbinden in das Design da hatte ich Probleme gehabt

hier meine Kalender pur
http://www.blicke1.de/event-kalender/index.php

hier eingebaut per include ....
http://www.blicke1.de/event-kalender/kalender.php

das Design ist zerrissen und auch sonstigen Text verändert :E
habe versucht in den Bootsrtap css einiges zu ändern aber viel hat das nicht gebracht , kann sein das ich die falschen Sachen erwischt habe :)


erst per iframe da sieht alles gut aus, und denke kann so bleiben :)
http://www.blicke1.de/event-kalender/termine.php

was meinst du dazu ?
Viele Grüße ...Monika
Benutzeravatar
Jasko
Globaler Moderator
Globaler Moderator
Beiträge: 3277
Registriert: Di 21. Feb 2012, 06:59
Mein Vorname: Herr Jasmin ;)
Wohnort: Rheinland-Pfalz
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von Jasko »

Hallo moni,

include ist hier auch keine gute methode den Kalender einzubinden, da ja der ganze code aus der index.php Datei in deine bestehnde Datei übertragen wird, also auch die Doppelten Meta Tags, die Doppelten body tags usw. Eine andere Möglichkeit ist das einbinden per iframe das du gemacht hast und das sicher funktioniert, vor allem beim Kalender der in der Höhe nicht großartig verändert wird undsomit super klappt.

Doch beim erstellen der App (Software) dachte ich auch daran das der Kalender in ein Design oder eine Unterelement in einer Datei sein kann, dacher kann man den Kalender auch per Code in die eigene Datei holen.

Also diesen Code an die Stelle einsetzen wo der kalender zu sehen sein soll:

Code: Alles auswählen

<div class="calender">
    <table class="table table-bordered">
      <thead>
        <tr>
          <td><a id="previusMonth" href="?y=<?=$y?>&m=<?=$m?>"><<</a></td>
          <td><center><span id="selectedMonth"></span></center></td>
          <td><a id="nextMonth" href="?y=<?=$y?>&m=<?=($m+2)?>">>></a></td>
          <td></td>
          <td><a id="previusYear" href="?y=<?=($y-1)?>&m=<?=($m+1)?>"><<</a></td>
          <td><center><span id="selectedYear"><?=$y?></span></center></td>
          <td><a id="nextYear" href="?y=<?=($y+1)?>&m=<?=($m+1)?>">>></a></td>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><?=$lg['MON']?></td>
          <td><?=$lg['TUE']?></td>
          <td><?=$lg['WED']?></td>
          <td><?=$lg['THU']?></td>
          <td><?=$lg['FRI']?></td>
          <td><?=$lg['SAT']?></td>
          <td><?=$lg['SUN']?></td>
        </tr>
        <tr>
          <td id="d1"></td>
          <td id="d2"></td>
          <td id="d3"></td>
          <td id="d4"></td>
          <td id="d5"></td>
          <td id="d6"></td>
          <td id="d7"></td>
        </tr>
        <tr>
          <td id="d8"></td>
          <td id="d9"></td>
          <td id="d10"></td>
          <td id="d11"></td>
          <td id="d12"></td>
          <td id="d13"></td>
          <td id="d14"></td>
        </tr>
        <tr>
          <td id="d15"></td>
          <td id="d16"></td>
          <td id="d17"></td>
          <td id="d18"></td>
          <td id="d19"></td>
          <td id="d20"></td>
          <td id="d21"></td>
        </tr>
        <tr>
          <td id="d22"></td>
          <td id="d23"></td>
          <td id="d24"></td>
          <td id="d25"></td>
          <td id="d26"></td>
          <td id="d27"></td>
          <td id="d28"></td>
        </tr>
        <tr>
          <td id="d29"></td>
          <td id="d30"></td>
          <td id="d31"></td>
          <td id="d32"></td>
          <td id="d33"></td>
          <td id="d34"></td>
          <td id="d35"></td>
        </tr>,
        <tr>
          <td id="d36"></td>
          <td id="d37"></td>
          <td id="d38"></td>
          <td id="d39"></td>
          <td id="d40"></td>
          <td id="d41"></td>
          <td id="d42"></td>
        </tr>
      </tbody>
    </table>
</div>
<div class="modal fade" tabindex="-1" role="dialog" id="eventInfo">
 <div class="modal-dialog" role="document">
   <div class="modal-content">
     <div class="modal-header">
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
         <h4 class="modal-title" id="info-title"><?=$lg['YOUR_EVENTS_AT']?> <span id="event_day"></span>.<span id="event_month"></span>.<?=$y?></h4>
       </div>
       <div class="modal-body" id="info-body">
         <span id="event-info"></span>
       </div>
       <div class="modal-footer">
         <button type="button" class="btn btn-default" data-dismiss="modal"><?=$lg['CLOSE']?></button>
       </div>
   </div><!-- /.modal-content -->
 </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script onLoad="loadCalender(<?=$y?>,<?=$m?>,<?=$d?>)" type="text/javascript" src="calender/js/calender.js"></script>
<script
			  src="https://code.jquery.com/jquery-3.2.1.min.js"
			  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
			  crossorigin="anonymous"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
Da der Kalender bootstrap verwendet muss man auch bootstrap im Headberaeich einbinden, am einfachsten geht das über die Bootstrap CDN:

Code: Alles auswählen

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
Unter den bootstrap stylesheet muss man noch die eigene Styledatei einbinden mit der man den Kalender angepasst hat, oder den Code halt direkt einstellen:

Code: Alles auswählen

      <style>
    .calender {
      width:95%;
      margin:auto;
    }
    .calender .table td {
      text-align: center;
    }
    .calender .table td > a {
      cursor: help;
    }
  </style>
Noch ein Code muss eingebunden werden, und zwar der php Teil, den einfach an erster stelle in der gewünschten Datei platziren, oder wenn anderer php Code schon drin ist, halt da wo platz ist.

Code: Alles auswählen

<?php
  require_once('calender/config.php');
  require_once('calender/'.$lang);

  $yearUp = false;
  $yearDown = false;
  if (isset($_REQUEST['m'])){
    # change the month because of the javascript month array [0..11]
    $m = intval($_REQUEST['m'])-1;
    if($m<0){
      $m=11;
      $yearDown = true;
    }
    if($m>11){
      $m=0;
      $yearUp = true;
    }
  } else {
    $m = date('n')-1;
  }
  if (isset($_REQUEST['y'])){
    $y = $_REQUEST['y'];
    if($yearUp){
      $y = intval($y)+1;
    }
    if($yearDown){
      $y = intval($y)-1;
    }
  } else {
    $y = date('Y');
  }
  if (isset($_REQUEST['d'])){
    $d = $_REQUEST['d'];
  } else {
    $d = 0;
  }
?>
Habe gerade gemerckt das man hier vieleicht etwas durcheinander kommen könnte, daher werde ich in den nächsten versionen versuchen das einbinden des Kalenders einfacher zu machen, oder man nutzt ein iframe, geht auch :D
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8331
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von moni »

Danke Jasmin für ausführlichen Erklärung ..habe das so gefolgt und sieht so aus .. den Bootsrap link in den hedaer.php eingefügt und unten das kleine css.style

http://www.blicke1.de/event-kalender/kalender1.php

hier code wie ich das an die Seite platziert habe

Code: Alles auswählen

<?php
  require_once('calender/config.php');
  require_once('calender/'.$lang);

  $yearUp = false;
  $yearDown = false;
  if (isset($_REQUEST['m'])){
    # change the month because of the javascript month array [0..11]
    $m = intval($_REQUEST['m'])-1;
    if($m<0){
      $m=11;
      $yearDown = true;
    }
    if($m>11){
      $m=0;
      $yearUp = true;
    }
  } else {
    $m = date('n')-1;
  }
  if (isset($_REQUEST['y'])){
    $y = $_REQUEST['y'];
    if($yearUp){
      $y = intval($y)+1;
    }
    if($yearDown){
      $y = intval($y)-1;
    }
  } else {
    $y = date('Y');
  }
  if (isset($_REQUEST['d'])){
    $d = $_REQUEST['d'];
  } else {
    $d = 0;
  }
?>
<?php
  include("../design/header.php");
?>


 <h1><span style="color: #FF0000;">T</span><span style="color: #EB000C;">e</span><span style="color: #D70018;">r</span><span style="color: #C40024;">m</span><span style="color: #B00031;">i</span><span style="color: #9C003D;">n</span><span style="color: #890049;">k</span><span style="color: #750056;">a</span><span style="color: #620062;">l</span><span style="color: #4E006E;">e</span><span style="color: #3A007B;">n</span><span style="color: #270087;">d</span><span style="color: #130093;">e</span><span style="color: #0000A0;">r</span></h1>
 <div class="textfeld">
<div class="calender">
    <table class="table table-bordered">
      <thead>
        <tr>
          <td><a id="previusMonth" href="?y=<?=$y?>&m=<?=$m?>"><<</a></td>
          <td><center><span id="selectedMonth"></span></center></td>
          <td><a id="nextMonth" href="?y=<?=$y?>&m=<?=($m+2)?>">>></a></td>
          <td></td>
          <td><a id="previusYear" href="?y=<?=($y-1)?>&m=<?=($m+1)?>"><<</a></td>
          <td><center><span id="selectedYear"><?=$y?></span></center></td>
          <td><a id="nextYear" href="?y=<?=($y+1)?>&m=<?=($m+1)?>">>></a></td>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><?=$lg['MON']?></td>
          <td><?=$lg['TUE']?></td>
          <td><?=$lg['WED']?></td>
          <td><?=$lg['THU']?></td>
          <td><?=$lg['FRI']?></td>
          <td><?=$lg['SAT']?></td>
          <td><?=$lg['SUN']?></td>
        </tr>
        <tr>
          <td id="d1"></td>
          <td id="d2"></td>
          <td id="d3"></td>
          <td id="d4"></td>
          <td id="d5"></td>
          <td id="d6"></td>
          <td id="d7"></td>
        </tr>
        <tr>
          <td id="d8"></td>
          <td id="d9"></td>
          <td id="d10"></td>
          <td id="d11"></td>
          <td id="d12"></td>
          <td id="d13"></td>
          <td id="d14"></td>
        </tr>
        <tr>
          <td id="d15"></td>
          <td id="d16"></td>
          <td id="d17"></td>
          <td id="d18"></td>
          <td id="d19"></td>
          <td id="d20"></td>
          <td id="d21"></td>
        </tr>
        <tr>
          <td id="d22"></td>
          <td id="d23"></td>
          <td id="d24"></td>
          <td id="d25"></td>
          <td id="d26"></td>
          <td id="d27"></td>
          <td id="d28"></td>
        </tr>
        <tr>
          <td id="d29"></td>
          <td id="d30"></td>
          <td id="d31"></td>
          <td id="d32"></td>
          <td id="d33"></td>
          <td id="d34"></td>
          <td id="d35"></td>
        </tr>,
        <tr>
          <td id="d36"></td>
          <td id="d37"></td>
          <td id="d38"></td>
          <td id="d39"></td>
          <td id="d40"></td>
          <td id="d41"></td>
          <td id="d42"></td>
        </tr>
      </tbody>
    </table>
</div>
<div class="modal fade" tabindex="-1" role="dialog" id="eventInfo">
 <div class="modal-dialog" role="document">
   <div class="modal-content">
     <div class="modal-header">
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
         <h4 class="modal-title" id="info-title"><?=$lg['YOUR_EVENTS_AT']?> <span id="event_day"></span>.<span id="event_month"></span>.<?=$y?></h4>
       </div>
       <div class="modal-body" id="info-body">
         <span id="event-info"></span>
       </div>
       <div class="modal-footer">
         <button type="button" class="btn btn-default" data-dismiss="modal"><?=$lg['CLOSE']?></button>
       </div>
   </div><!-- /.modal-content -->
 </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script onLoad="loadCalender(<?=$y?>,<?=$m?>,<?=$d?>)" type="text/javascript" src="calender/js/calender.js"></script>
<script
           src="https://code.jquery.com/jquery-3.2.1.min.js"
           integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
           crossorigin="anonymous"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

 </div>
<br><br>

<?php
  include("../design/footer.php");
?>
Viele Grüße ...Monika
Benutzeravatar
Jasko
Globaler Moderator
Globaler Moderator
Beiträge: 3277
Registriert: Di 21. Feb 2012, 06:59
Mein Vorname: Herr Jasmin ;)
Wohnort: Rheinland-Pfalz
Kontaktdaten:

Re: Termin Kalender für deine Homepage

Beitrag von Jasko »

Hallo moni, ich habe mir mal deinen Quellcode angeschaut, genauer den CSS Code, und dort habe ich gefunden das du den Kalender in der Box3 gemacht hast. Diese box drei hat eine width von 90%, wir diese auf 100% gestellt dann sieht die seite normal aus.

MFG
Antworten

Zurück zu „Nützliches für den Websitebau“

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 2 Gäste