Jeu de squelettes Multiflex 3 et le plugin « agenda2 »

Il s’agit d’un tutorial (pas à pas) expliquant comment mettre en route le calendrier du plugin « agenda2 » dans le squelette « Jeu de squelettes Multiflex 3 » et uniquement celui-là ! Prenez conscience que le plugin « agenda2 » est passible d’évolution, donc, ce qui est valable actuellement, ne le sera peut-plus dans une prochaine version.
Il vous appartiendra donc de faire remonter l’info et si possible de donner une solution pour que cet article soit toujours utile aux prochaines personnes.

Un fois fait, vous aurez un calendrier de 150 pixels de large dans la partie publique de votre site.
Le code pour la mise en route vient du forum du plug et d’Erwan (merci à tous).

Pour toute question sur le fonctionnement du plugin, veuillez vous diriger vers le forum de celui-ci.
Lien vers le plugin agenda 2

Si jamais, vous n’avez pas de réponse, alors, vous pouvez éventuellement posez votre question à Erwan, mais faîtes le uniquement en seconde démarche.

Lien vers le site d’Erwan

En suivant la méthode A, vous aurez votre calendrier dans la colonne de droite si vous choisissez, la structure 3 colonnes via cfg sinon dans la colonne de gauche, si vous choisissez 2 colonnes.

En suivant la méthode B, vous aurez votre calendrier sous « Accueil du site » au centre de la page.

1- Créez un dossier « squelettes » à la racine de votre site SPIP.

2- Dans votre dossier squelettes, vous créer un dossier « css ».
Ce qui vous donne donc :

  • squelettes/css

3- Vous devez creer dans votre dossier squelettes un dossier du nom de « formulaires »

Ce qui vous donne :

  • squelettes/formulaires

4- Vous devez creer et copier ce code, dans un fichier du nom de « inc-agenda.html ».

#CALENDRIER_MINI{#ENV{date},'date',#SELF}

Ce fichier, vous l’enregistrer dans le dossier squelette que vous avez fait en étape 1.

5A- Vous devez faire dans votre dossier, squelettes fait en étape 1, un dossier du nom de « noisette » et à l’intérieur un dossier du nom de « sommaire », un autre du nom de « rubrique » et un dernier du nom de « article ».
Vous aurez donc :

  • squelettes/noisettes/sommaire
  • squelettes/noisettes/rubrique
  • squelettes/noisettes/article

6A- Vous avez un fichier qui se nomme « supplements_colonne », dans les dossiers

  • squelette_multiflex3/noisettes/sommaire
  • squelette_multiflex3/noisettes/rubrique
  • squelette_multiflex3/noisettes/article

Dans les fichiers, vous devez ajouter dedans :

[(#REM) Calendrier ]
[
	[(#ENV{mfx_colonne_div}|=={oui}|oui)
	<div class="subcontent-unit-border-blue">
	  <div class="round-border-topleft"></div><div class="round-border-topright"></div>
	]
	(#INCLURE{fond=inc-agenda}{ajax}{env}
		{mfx_couleur=blue}
		|trim   
	)
		  [(#ENV{mfx_colonne_div}|=={oui}|?{</div>})]
]

Puis vous l’enregistrer sous le même nom dans les dossier que vous avez fait en étape 5A.

5B- Vous devez faire dans votre dossier squelettes, fait en étape 1, un dossier du nom de « noisette » et à l’intérieur un dossier du nom de « _entete ».
Vous aurez donc :

  • squelettes/_entete

6B- Vous avez un fichier qui se nomme « bas », dans le dossier squelette_multiflex3/noisettes/_entete dans ce fichier, vous devez ajoutez la ligne :

<INCLURE{fond=inc-agenda}{ajax}{env}>

Puis vous l’enregistrer sous le même nom dans le dossier que vous avez fait en étape 5B.

7- Dans le dossier squelette_multiflex3/css, vous avez un fichier « header.css.html »
Vous devez copiez dedans :

/* Calendrier */
#calendar {margin: auto; padding: auto; text-align: center; position:relative;}
#calendar h2 {margin: auto; padding: auto; text-align: center; position:relative; width: 150px;}
#calendar table {margin: auto; text-align: center; position:relative; width: 150px;}

Puis, vous l’enregistrer avec le même nom, dans le dossier « css » que vous avez fait en étape 2

8- Vous copiez ce code, dans un fichier qui portera comme nom « aujour.html » et vous l’enregistrer dans votre dossier squelettes que vous avez fait en étape 1.

<div style="text-align: center"><BOUCLE_evenements(EVENEMENTS) {agenda date_debut, mois, (#ENV{date}|annee), (#ENV{date}|mois)}{jour_relatif=0}{statut=publie}><!-- {agenda date_debut, mois, (#ENV{date}|annee), (#ENV{date}|mois)} -->
[(#LOGO_ARTICLE_RUBRIQUE|#URL_ARTICLE)]
      <a href="#URL_ARTICLE" class="titre">#TITRE</a><br>
      <em> [(#DATE_DEBUT|nom_jour)] [(#DATE_DEBUT|jour)]
          [(#DATE_DEBUT|affdate_mois_annee)]
  <!-- &agrave; [(#DATE_DEBUT|heures)]h[(#DATE_DEBUT|minutes)] -->
  </em><br> #LIEU<br>
  [
  <div class="#EDIT{intro} texte">(#DESCRIPTIF)</div>
  ]<br>
</BOUCLE_evenements></div>

9- Dans le fichier « calendrier_mini.html » qui est dans .../agenda_2_0/formulaires/
Vous avez ligne 5 et ligne 10.

<a

Vous devez ajoutez au deux lignes class=« ajax ».
Ce qui vous donnera en ligne 5 et 10 :

<a class="ajax"

Vous avez ligne 52

#ENV{self},'',#ENV{var_date}})

Vous devez mettre à la place.

?page=aujour,'',#ENV{var_date}})

Puis vous l’enregistrer sous le même nom dans le dossier que vous avez fait en étape 3.

21/03/2010 mise à jour du point 9 pour suivre les modifications du plug

25/05/2010 mise à jour du point 9 pour suivre les modifications du plug

10/09/2011 mise à jour du point 9 pour suivre les modifications du plug

Dernière modification de cette page le 14 février 2019

Discussion

Aucune discussion

Ajouter un commentaire

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom