Bandeau

Site de démonstration du jeu de squelettes ESCAL fonctionnant sous SPIP3 et mis à la disposition des Etablissements SColaires de l’Académie de Lyon... et de qui veut.

Forum de l’article

Photos au hasard

Qui êtes-vous ?
Votre message

Pour créer des paragraphes, laissez simplement des lignes vides.
Attention ! Si votre message contient un lien, il devra être validé par le webmestre.

Ajouter un document

Rappel de la discussion
inc-photos
mima - le 29 mai 2014

bonjour,
j’utilise escal v2 / spip3 .
j’ai créé une noisette inc art (copie de inc photo en changeant juste le mot clé ’art’ que j’ai créé dans l’espace privé). ça marche très bien lorsque ça soit dans l’article (copier le div de la noisette dans article .html)Mais dans l’accueil (sommaire.html)ça marche en alternance avec la noisette inc photo ( ya un défilement de photo d’une seule noisette à la fois) . problème ? ..problème dans le fichier javascript ?
MERCI

inc-photos
Jean Christophe Villeneuve - le 29 mai 2014

Oui, en effet, c’est lié au javascript qui fait tourner les images mais on peut s’en sortir :

  • dans ton fichier inc-art, tu remplaces "scrollup2" et headline2" par "scrollup3" et headline3"
  • tu copies rotative.js de escal/scripts vers squelettes/scripts
  • dans cette copie, tu verras 2 blocs de code quasi identiques, tu copies le 2e en dessous et tu changes chaque occurrence de "scrollup2" et headline2" par "scrollup3" et headline3"
  • et pour finir, tu rajoutes dans perso.css les propriétés suivantes
    #scrollup3 {
            position: relative;
            overflow: hidden;
            height: 140px;
            margin: auto;
            width: 170px;
    }
    .headline3 {
            position: absolute;
            top: 140px;
    }

Voilà, ça devrait faire l’affaire.

inc-photos
mima - le 29 mai 2014

MERCI monsieur Jean Christophe. ça marche très bien.
j’aimerais bien aussi créer un espace membre pour mon site .
je sais pas trop sur la fonction autorisation php, créer le dossier script dans squelettes et (l’appel dans inc article)... Merci pour votre aide

inc-photos
Jean Christophe Villeneuve - le 29 mai 2014

Il y a plugin dédié à ça : Accès restreint

inc-photos
mima - le 1er juin 2014

Bonjour.
MERCI . je vais essayer de travailler avec.
Merci pour votre aide

inc-photos x 2 ou 3... dans Escal V3 et SPIP 3.1.3
Fabrice - le 17 octobre 2016

Bonjour Jean Christophe,
Bravo et merci pour votre fabuleux travail.
Cherchant en vain à multiplier "inc-photo", comme mima, j’étais heureux d’avoir trouver ici la solution, mais

dans ton fichier inc-art, tu remplaces "scrollup2" et headline2" par "scrollup3" et headline3"
tu copies rotative.js de escal/scripts vers squelettes/scripts
dans cette copie, tu verras 2 blocs de code quasi identiques, tu copies le 2e en dessous et tu changes chaque occurrence de "scrollup2" et headline2" par "scrollup3" et headline3"

scrollup2" et headline2 sont introuvables dans Escal V3... et je sèche encore une fois 🙁

Help ! Merci

inc-photos x 2 ou 3... dans Escal V3 et SPIP 3.1.3
Jean Christophe Villeneuve - le 17 octobre 2016

Ah oui, mais ça, c’était avant ... en 2014 !
Et depuis, un autre spipeur m’a recodé ça plus proprement.
Mais il doit bien y avoir un autre moyen de bidouiller. Je regarde ça de près et je te tiens au courant.

inc-photos x 2 ou 3... dans Escal V3 et SPIP 3.1.3
Fabrice - le 18 octobre 2016

Bonjour Jean Christophe,

Je regarde ça de près et je te tiens au courant.

Merci infiniment 🙂

inc-photos x 2 ou 3... dans Escal V3 et SPIP 3.1.3
Jean Christophe Villeneuve - le 24 octobre 2016

C’est bon, je l’ai ! C’est parti :

  • tu crées un fichier mes-photos.html dans /squelettes/modeles (dossier et sous-dossier à créer si pas existant) aves ce code :
<script>
// Il faut instancier un objet Rotative pour assurer la rotation des photos
$(document).ready(
  function()
  {
    new Rotative
    (
      {
        container : "#mes-photos-defilantes",
        element   : "div.une-photo",
        tempo     : [(#CONFIG{escal/config/tempophotos, 8})]
      }
    )
  }
) ;
</script>


<!-- on selectionne les articles avec le mot-cle mes-photos et on stocke dans doublons photos2 -->
    <BOUCLE_selection_articles2(ARTICLES){titre_mot=mes-photos}{par hasard}{0,10}>
      <BOUCLE_selection_docs2(DOCUMENTS){id_article}{mode=image}{extension==jpg|png|gif}{0,10}{par hasard}{doublons photos2}>
      </BOUCLE_selection_docs2>
    </BOUCLE_selection_articles2>


#SET{nombrephotos,#CONFIG{escal/config/nombrephotos,5}}
  <div id="mes-photos-defilantes">

      <BOUCLE_photo_une(DOCUMENTS){!doublons photos2}{par hasard}{0,#GET{nombrephotos}}>
      <div class="une-photo"> 
     
<BOUCLE_titre_article(ARTICLES){id_document}{0,1}> 
#SET{lien,#URL_ARTICLE}
</BOUCLE_titre_article>      
      
      [(#CONFIG{escal/config/lienphotos}|=={non}|non)      
      <LIEN href="[(#GET{lien}|parametre_url{lang,#ENV{lang}})]">      
      ]
      <img src="[(#FICHIER|image_reduire{[(#CONFIG{escal/config/largeurimagenoisettes,170})]}|extraire_attribut{src})]"
                                 alt='[(#TITRE)]'
                                 title="[(#TITRE)]" />
      [(#CONFIG{escal/config/lienphotos}|=={non}|non)
      </LIEN>
      ]
      
      </div>
      </BOUCLE_photo_une>

        </div> 

en remplaçant les 2 occurrences de "LIEN" par "a" (obligé de faire ça, sinon mon code ne passe pas, anti-spam oblige)

  • tu rajoutes le code suivant à ton fichier perso.css (ou tu crées ce fichier dans un dossier /squelettes/styles)
/* noisette mes-photos */
/***********************/
#mes-photos-defilantes {
  position: relative;
  overflow: hidden;
  margin: auto;
  height: 170px;
}
.une-photo {
  position: absolute;
  width: 100%;
  margin: auto;
  text-align: center;
  top: 340px ;
}
  • tu crées un mot-clé "mes-photos" dans le groupe "affichage" par exemple
  • tu attribues ce mot-clé "mes-photos" à tous les articles dont tu veux récupérer les photos
  • tu crées un article dont le titre sera celui de la noisette affichée et tu mets dans le texte de cet article
<mes-photos|>
  • tu attribues à cet article le mot-clé "article-libre1" (ou un autre numéro si déjà utilisé)
  • tu vas dans la config d’Escal et tu affiche la noisette "Article libre 1" où tu veux
  • tu admires le résultat ... ou tu me dis ce qui cloche !
inc-photos x 2 ou 3... dans Escal V3 et SPIP 3.1.3
Fabrice - le 15 décembre 2016

J’admire le résultat !

Mais j’admire aussi ta générosité !

Merci Jean Christophe !

Joyeuse fêtes !

PS :
Désolé pour le délai de réponse... des problèmes perso.

Derniers commentaires

images dans un article
Merci pour le paramétrage.

images dans un article
Hello Voilà, je t’ai mis la limite à 1000 px. La largeur max des images paramétrable dans la (...)

images dans un article
Bonjour Jean Christophe, peux-tu mettre la limite à 1000 px ? En effet, on va changer le (...)

Modifier un texte
Ok c’était bien ça, cool. A l’avenir, utilises plutôt un éditeur de code plutôt que LibreOffice, (...)

Modifier un texte - suite et fin -
Super, c’est réparé Les apostrophes inclinés venaient de LibreOffice ! Encore (...)

Plan du site Contact Mentions légales Données personnelles et cookies Espace privé squelette RSS

2009-2024 © Escal - Tous droits réservés
Haut de page
Réalisé sous SPIP
Habillage ESCAL 4.6.2