Modul Kalender - nur Ort, Zeit und Teasertex anzeigen lassen

[marcus k]

Hallo,

ist es möglich, aus den kompletten Kalenderereignissen nur Ort, Zeit und Teasertext in einem weiteren Bereich der Website anzeigen zu lassen?
Also z.B. die kompletten Termine in der Hauptspalte und die "verkürzte" Version mit Weiterlesen-Link in der Randspalte?

[flip-flop]

Du meinst das eingebaute Kalender-Modul?

Das sollte mit {SHOW_CONTENT:...} funktionieren.
Die Kalenderanweisungen dazu würden in einem CP in einem versteckten Bereich parken. Dieser CP wird dann mit {SHOW_CONTENT:...} abgerufen.

[marcus k]

Ja, ich verwende den eingebauten Kalender mit den von Dir erstellten Erweiterungen V 1.2.

Es geht um diese Situation:
http://www.vaeter-helfen-vaetern.de/index.php?termine

Der "große" Kalender funktioniert soweit prima.

Wo jetzt rechts "Nächste Termine" steht (die Daten werden momentan aus einer anderen Quelle abgerufen),
möchte ich die Daten aus den Kalendereinträgen anzeigen lassen, aber eben nicht komplett, sondern,
wie oben geschrieben, nur Kurzinfos; diese natürlich auch in einer anderen Formatierung.

Wenn ich in der rechte Spalte per {SHOW_CONTENT:...} den Kalender anzeigen lassen,
erscheint dort natürlich der komplette "große" Kalender.

Muss ich ein neues Template bauen, das für die Ausgabe in der Randspalte angepasst ist?

[flip-flop]

Ein neues Kalendertemplate für eine anders geartete Ausgabe muss schon sein. Woher soll denn das System wissen was es ausgeben soll?

Eine neuer CP wird in einem versteckten Bereich der Seite angelegt und mit z.B. {SHOW_CONTENT:CP,Die-ID-Des-CPs} abgerufen
Z.B. CP-Inhalt:

Code: Select all

{CALENDAR:
items=10
template=my_dates_short_de.html
lang=de
tag=tag1, tag2
tagmode=OR
date_start=01.01.2010
date_end=31.12.2010
href=index.php?category06
WxHxCxQ=80x80x1x80
}

Z.B. ein Template (my_dates_short_de.html) ohne Bilder:

Code: Select all

<div class="cal-short">
  <div class="left">
    <div class="date">
      <p><strong> {STARTDATE:d.m.}</strong><strong class="year">{STARTDATE:Y}</strong>
      <strong> bis {ENDDATE:d.m.}</strong><strong class="year">{ENDDATE:Y}</strong></p>
    </div>
  </div>
  <div class="detail">
<!--
    <div class="image">
      [IMAGE_CALENDAR]{IMAGE_CALENDAR}[/IMAGE_CALENDAR]
    </div>
//-->
    <div class="teaser">
      [TITLE]<h2>{TITLE}</h2>[/TITLE]
<!--      [PLACE]<p class="place">Ort: {PLACE}</p>[/PLACE]//-->
<!--      [HREF]<div class="other">HREF: {HREF}</div>[/HREF]//-->
      [URL]<div class="other">URL: {URL}[TARGET]{TARGET}[/TARGET]</div>[/URL]
      
      [TEXT]<div class="textlong">{TEXT}</div>[/TEXT]
<!--      [TEXTLONG]<div class="textlong">{TEXTLONG}</div>[/TEXTLONG]//-->
    </div>
  </div>
  <div style=clear:both;"><!--nop//--></div>
</div> 

Die Kommentare könnten natürlich auch komplett entfernt werden.


CSS dazu:

Code: Select all

/* SHORT version ================ */
/* Calendar V1.1/2 */
.cal-short {
    padding: 10px 0 5px 0;
    margin: 0;
    clear: left;
    margin: 0;
    border-top: 1px solid #888;
    width: 200px;
    margin-bottom:10px;
}

.cal-short div.left {
/*    float:left; */ 
    position: relativ;
    text-align: left;
    line-height: 100%;
    width: 200px;
    margin: 0;
    padding: 0 0 10px 0;
    font-size: 1.1em;
}

.cal-short div.left .date {
    position: relativ;
    background-color: lightgrey;
    text-align: left;
    line-height: 100%;
    width: 200px;
    /* height: 60px; */
    margin: 0;
    padding: 5px 0 10px 0;
    font-size: 0.9em;
}


 
.cal-short div.detail {
    position: relativ;
    background-color: transparent;
    width: 200px;
    line-height: 100%;
/*    float: left; */ 
    margin: 0 0 0 0px;
    padding: 0 0 10px 0px;
    font-size: 0.9em;
    border-left: 1px solid #ccc;
}


.cal-short div.detail .image {
    float: left;
    margin: 0;
    padding:0;
    position: relativ;
}

.cal-short div.detail .teaser {
    line-height: 140%;
    margin: 0 0 0 0px;
    padding: 0;
}



.cal-short div.date p {
    width: 135px;
    text-align: left;
    margin: 5px 0 0 5px;
}


.cal-short div.date strong {
    letter-spacing: .06em;
}


.cal-short div.date div.day,
.cal-short div.date div.day-short_month {
    float: none;
    padding: 0 0 10px 0;
    font-weight: bold;
    letter-spacing: .1em;
    line-height: 108%;
    font-size: 14px;
    color: #888;
}
.cal-short div.date div.day-short_month {
    letter-spacing: .01em;
}
 
.cal-short div.date div.day-word {
    float: none;
    padding: 0 0 4px 0;
    margin: 0;
    font-weight: bold;
    letter-spacing: .1.5em;
    line-height: 108%;
}
.cal-short div.date div.day-month-year {
    float: none;
    padding: 0;
    font-weight: normal;
    letter-spacing: .05em;
    line-height: 100%;
}
.cal-short div.date div.year {
    float: none;
    width: auto;
    padding: 0;
    font-weight: normal;
    letter-spacing: .1em;
    line-height: 108%;
}
 
.cal-short div.detail h2 {
/*    padding: 1px 0 2px 120px; */
    margin: 0;
    padding: 0 0 10px 0;
    font-size: 1.5em;
    font-family: "HelveticaNeue Condensed", "Arial Narrow", "Helvetica Condensed", Arial, Helvetica, sans-serif;
    font-weight: bold;
    line-height: 100%;
    color: #666;
}
.cal-short div.detail p {
    padding: 0 0 0 0;
    margin: 0;
    font-size: 1.0em;
}
.cal-short div.detail p.place {
    font-weight: normal;
    color: #666;
    padding-bottom: 3px;
}

.cal-short div.detail .textshort {
    font-weight: normal;
    color: #666;
    padding-bottom: 3px;
    font-size: 1.0em;
}
.cal-short div.detail .other {
    font-weight: normal;
    color: #666;
    padding-bottom: 3px;
    font-size: 0.9em;
}
.cal-short div.detail .textlong {
    font-weight: normal;
    color: #666;
    padding-bottom: 3px;
    font-size: 1.0em;
}
 
.cal-short div.detail a {
    text-decoration: none;
}
.cal-short div.detail h2 a {
    color: #7C8084;
}
.cal-short div.detail a:hover {
    color: #000000;
    text-decoration: underline;
}

Was nicht gebraucht wird, einfach rausschmeißen.

[marcus k]

Herzlichen Dank, Knut.
Funktioniert perfekt!