Mini-calendrier et gestionnaire d’évènements

Publié le 29 novembre 2006, mise à jour le 30 novembre 2006
par sBa

PNG - 29 ko
Mini calendrier et agenda

Ici sur la page sommaire du squelette egt

Pour ajouter un mini calendrier et un gestionnaire d’évènements, on utilise ici le plugin agenda associé à un autre plugin : widget calendrier. Il faut donc téléchager et activer ces deux plugins.

Il faut lire la documentation à leur sujet, elle se trouve sur Spip-contrib.

Ci-dessous un exemple de code pour l’intégration sur la page sommaire du squelette egt. Vous pouvez faire un copier/coller juste après le

<div id="menudroit">
       <!-- debut calendrier et agenda -->
[(#CALENDRIER_MINI{#ENV{date},'date',#SELF})]
<BOUCLE_calendrier(EVENEMENTS){agenda date_debut, mois, (#ENV{date}|annee), (#ENV{date}|mois)}>
[(#DATE_DEBUT|Agenda_memo_full{#DATE_FIN,[(#TITRE|addslashes)],#DESCRIPTIF,#LIEU,
[(#ENV{self}|parametre_url{#ENV{var_date},[(#DATE_DEBUT|affdate{'Y-m-d'})]})]})]
</BOUCLE_calendrier>
<div id="agenda">               
<B_agenda>
<h3><:agenda:></h3>
<dl>
<BOUCLE_agenda(EVENEMENTS){age<0}{par date}{statut=publie}{pagination 2}>
<dt>#TITRE</dt>
[<dd>(#DATE_DEBUT|Agenda_affdate_debut_fin{#DATE_FIN,#HORAIRE})</dd>]
<dd class='engras'>#LIEU</dd>
<dd>#DESCRIPTIF</dd>

</BOUCLE_agenda></dl>
[<p class="pagination">(#PAGINATION)</p>]
</B_agenda>
</div><!-- fin du div agenda -->
<!-- fin calendrier et agenda -->

On oubliera pas de rajouter dans la feuille de style le code suivant :

/* Habillage du mini calendrier */
#calendar { -moz-border-radius: 1em;text-align: center; border: 1px dotted #ccc; padding: 2px; padding-top: 0.5em; width:140px;}
#calendar table { width: 100%; margin: 0 auto; padding: 0; }
#calendar caption { font-size:0.8em;padding: 5px ; font-weight: bold; }
#calendar th { -moz-border-radius: 1em;background: #ADC7D6; font-weight: normal; color: #666; }
#calendar th abbr { border: none; cursor: help; }
#calendar td {-moz-border-radius: 0.7em; margin: 0; padding: 0; border: none; text-align: center; background: #ddd; line-height: 1.6em; }
#calendar td.horsperiode { background: #ececec; color: #ccc; }
#calendar td.occupe { background: #FFD98F; }
#calendar td a { display: block; }
#calendar td span { color: #aaa; }
#calendar td a:hover { border:0px }
#calendar tr { font-size:0.9em; }

/* Habillage agenda */
#agenda dt{
        background-color: #FFD98F;
        -moz-border-radius: 10px;
        padding: 2px 0px 2px 10px;
        margin: 0px 0px 0px 0px;
}
#agenda dd{
        font-size: 0.9em;
        padding: 2px 0px 2px 20px;
        margin: 0px 0px 0px 0px;
}
PNG - 5.9 ko

La boucle agenda est paginée. Par défaut les 2 prochains évènements s’affichent, pour modifier cela, changez le critère de {pagination 2} dans la boucle la BOUCLE_agenda(EVENEMENTS)


Source : article plugin agenda (et son forum !) et squelette Spip Party

calle
calle
calle
Réagir à cet article