Quickflip - commentairesQuickflip2015-04-02T06:45:03Zhttps://contrib.spip.net/Quickflip#comment4808902015-04-02T06:45:03Z<p>ce sera sur l'autre version, je travaille sur le responsive...</p>Quickflip2015-04-01T16:18:26Zhttps://contrib.spip.net/Quickflip#comment4808852015-04-01T16:18:26Z<p>ça prend forme<small class="fine d-inline"> </small>!</p>
<p>rajouter une petite marge entre chaque image comme avant<small class="fine d-inline"> </small>?<br class="autobr">
Ou indiquer une largeur un chouille plus grande<small class="fine d-inline"> </small>?</p>Quickflip2015-04-01T11:12:44Zhttps://contrib.spip.net/Quickflip#comment4808722015-04-01T11:12:44Z<p>Oui, mais j'aime bien la version qui attire l'œil, car naturellement, il y aura survol et clic,</p>
<p>mais pouvoir personnaliser cette image, c'est bien et c'est fait en jouant sur les nuances rvb, la version 32x32 px en teinte rouge. <br class="autobr">
<a href="http://www.anim-16.com/spip.php?page=quickflip" class="spip_out" rel='nofollow external'>Voir le lien</a></p>Quickflip2015-04-01T10:09:51Zhttps://contrib.spip.net/Quickflip#comment4808702015-04-01T10:09:51Z<p>tu pourras aussi faire une image coin plus petite. Une image coin.png mise dans /squelettes/images devrait prendre la place</p>Quickflip2015-04-01T07:24:37Zhttps://contrib.spip.net/Quickflip#comment4808652015-04-01T07:24:37Z<p>Alors la on est bien, je vais mettre des nouvelles photos mieux proportionnées et ça va le faire : <a href="http://www.anim-16.com/spip.php?page=quickflip&var_mode=recalcul" class="spip_out" rel='nofollow external'>voir la page</a></p>
<p>Encore merci.</p>Quickflip2015-03-31T18:52:10Zhttps://contrib.spip.net/Quickflip#comment4808592015-03-31T18:52:10Z<p>ah oui, il te faut rajouter quelques règles css :</p>
<div class="precode"><pre class="spip_code spip_code_block" dir="ltr" style="text-align:left;"><code>.quickflip-logoart{ float: left;
}
.quickflip-logoart:hover{ opacity: 0.8;
}
.quickflip-lienart{ width: 100%; height: 30px; position: absolute; bottom: 0; background-color: black; opacity: 0.5; text-align: center;
}
.quickflip-lienart a{ color: white !important; font-size: 18px; padding-left: 15px;
}</code></pre></div>Quickflip2015-03-31T07:06:32Zhttps://contrib.spip.net/Quickflip#comment4808462015-03-31T07:06:32Z<p>C'est ça avec bien sur des réglages, visible sur<a href="http://www.anim-16.com/spip.php?page=quickflip" class="spip_out" rel='nofollow external'>cette page test</a></p>
<p>Attention toutefois au nom du modèle et son appel : <br class="autobr">
<code class="spip_code spip_code_inline" dir="ltr">quicfliplogo3art.html</code><br class="autobr">
<code class="spip_code spip_code_inline" dir="ltr">[(#MODELE{quickflip-logo3art}{rubrique=XX}{largeur=YY})]</code><br class="autobr">
Source d'erreur mais si on cherche à comprendre sans faire un simple copier coller, tout va pour le mieux.</p>
<p>Pour ma part, j'ai utilisé sur la version de départ, le logo en background :</p>
<div class="precode"><pre class="spip_code spip_code_block" dir="ltr" style="text-align:left;"><code>background: url([(#LOGO_ARTICLE_RUBRIQUE|extraire_attribut{src})]) center center; background-size: cover; </code></pre></div>
<p>ce qui me permet de pouvoir changer de logo de temps en temps sans retravailler ni le logo, ni la taille du block et surtout de mettre en bandeau grisé, le titre et le chapo avec l'effet de survol.</p>
<p>Mais j'aime bien cette base et elle va me servir sur d'autres sites, encor merci et bon boulot<small class="fine d-inline"> </small>!!!</p>Quickflip2015-03-30T20:03:17Zhttps://contrib.spip.net/Quickflip#comment4808362015-03-30T20:03:17Z<p>bon comme c'est un cas très spécifique, c'est difficile de le proposer dans le plugin mais on peut y arriver ainsi (le plugin quickflip reste nécessaire néanmoins) :</p>
<ul class="spip"><li> création d'un dossier /squelettes à la racine du site</li><li> création d'un dossier /modeles dans /squelettes</li><li> création d'un fichier quicfliplogo3art.html dans /squelettes/modeles avec dedans ce code
<div class="precode"><pre class="spip_code spip_code_block" dir="ltr" style="text-align:left;"><code>#SET{tailleimage,#ENV{largeur,400}} <BOUCLE_largeur(ARTICLES){id_rubrique=#ENV{rubrique}}{0,1}> [(#SET{width,[(#LOGO_ARTICLE|image_reduire{#GET{tailleimage}}|extraire_attribut{width} )]} )] [(#SET{height,[(#LOGO_ARTICLE|image_reduire{#GET{tailleimage}}|extraire_attribut{height} )]} )] </BOUCLE_largeur> <BOUCLE_3quickflip(ARTICLES){id_rubrique=#ENV{rubrique}}{par hasard}>
<div class="quickflip-wrapper quickflip-logoart" style="[width:(#GET{width})px;][height:(#GET{height})px;]"> <div class="quickflip-verso"> <BOUCLE_verso(ARTICLES){id_article}> <div class="quickflip-texte" style="[width:(#GET{width}|moins{4})px;][height:(#GET{height})px;]"> [<div class="quickflip-titre">(#TITRE)</div>] [<div class="quickflip-descriptif">(#CHAPO)</div>] </div> <div class="quickflip-lienart"> <a href="#URL_ARTICLE"> #TITRE </a> </div> </BOUCLE_verso> <div class="quickflip-lien"> <a href="#" class="quickFlipCta"> <img src="#CHEMIN{images/coin.png}" alt="" /> </a> </div> </div> <div class="quickflip-recto"> <div class="quickflip-image"> <BOUCLE_recto(ARTICLES){id_article}> [(#LOGO_ARTICLE||image_reduire{#GET{width},0})] <div class="quickflip-lienart"> <a href="#URL_ARTICLE"> #TITRE </a> </div> </BOUCLE_recto> </div> <div class="quickflip-lien"> <a href="#" class="quickFlipCta"> <img src="#CHEMIN{images/coin.png}" alt="" /> </a> </div>
</div> </div>
</BOUCLE_3quickflip>
<div class="nettoyeur"></div></code></pre></div></li><li> insertion dans ta page sommaire de ce code
<div class="precode"><pre class="spip_code spip_code_block" dir="ltr" style="text-align:left;"><code>[(#MODELE{quickflip-logo3art}{rubrique=XX}{largeur=YY})]</code></pre></div>
<p>avec XX pour le numéro de la rubrique avec tes 3 articles<br class="autobr">
et YY la bonne largeur pour chaque logo, soit le tiers de la largeur totale</p>
</li></ul>
<p>Bon après, il faudra peaufiner, en rajoutant ce que tu veux et en travaillant les css</p>Quickflip2015-03-29T08:04:18Zhttps://contrib.spip.net/Quickflip#comment4807862015-03-29T08:04:18Z<p>Pour le moment une simple boucle <code class="spip_code spip_code_inline" dir="ltr"> (ARTICLES)</code> avec les critères<code class="spip_code spip_code_inline" dir="ltr"> {id_rubrique=XX} {par hasard} </code><br class="autobr">
affichage du <code class="spip_code spip_code_inline" dir="ltr">#TITRE</code> et du <code class="spip_code spip_code_inline" dir="ltr">#CHAPO</code> mais avec une limite <code class="spip_code spip_code_inline" dir="ltr">|couper{xx}</code>pour ne pas dépasser du bandeau.</p>
<p>En faisant pivoter l'image, je pourrais remettre le <code class="spip_code spip_code_inline" dir="ltr">#TITRE</code> et le <code class="spip_code spip_code_inline" dir="ltr">#CHAPO</code> en entier.</p>Quickflip2015-03-28T16:55:48Zhttps://contrib.spip.net/Quickflip#comment4807562015-03-28T16:55:48Z<p>et pour l'instant, tu gères comment l'ordre aléatoire des 3 articles<small class="fine d-inline"> </small>?</p>
<p>Et au verso de chaque image, tu imagines quoi<small class="fine d-inline"> </small>?</p>Quickflip2015-03-28T16:42:07Zhttps://contrib.spip.net/Quickflip#comment4807542015-03-28T16:42:07Z<p>pour le moment ils sont fixes (les 3 articles d'une rubriques) mais ils sont présentés dans un ordre aléatoires voir <a href="http://www.anim-16.com" class="spip_out" rel='nofollow external'>la page d'accueil</a> car je ne peux savoir si les visiteurs vont souhaiter des renseignements sur les soirées, les anniversaires ou les mariages<small class="fine d-inline"> </small>?</p>
<p>Et quand ils arrivent sur le site, je souhaite qu'ils voient que l'ordre est différent d'une fois sur l'autre.</p>Quickflip2015-03-28T16:31:57Zhttps://contrib.spip.net/Quickflip#comment4807532015-03-28T16:31:57Z<p>les 3 articles cibles sont fixes ou ils sont susceptibles de changer<small class="fine d-inline"> </small>?</p>Quickflip2015-03-28T08:33:03Zhttps://contrib.spip.net/Quickflip#comment4807342015-03-28T08:33:03Z<p>c'est à dire, vu mon niveau en javascript (copier coller quand j'en ai besoin et encore ...)<br class="autobr">
mais l'effet est sympa, sachons apprécier ton travail<small class="fine d-inline"> </small>!</p>Quickflip2015-03-27T20:40:31Zhttps://contrib.spip.net/Quickflip#comment4807152015-03-27T20:40:31Z<p>le souci c'est que le javascript utilise le lien de l'image pour la retourner donc je ne vois pas comment générer le lien vers un article.</p>Quickflip2015-03-24T08:10:23Zhttps://contrib.spip.net/Quickflip#comment4805382015-03-24T08:10:23Z<p>Ça marche avec le modèle dans le squelette :<br class="autobr">
voir en bas de la <a href="http://www.anim-16.com" class="spip_out" rel='nofollow external'>page d'accueil du site</a></p>
<p>Je souhaiterais pouvoir l'adapter aux trois articles : « soirées » , « anniversaires » et « mariages » avec les logos des articles, pour ne pas re programmer quand je changerais les logos des articles.</p>
<p>Mais je fais confiance à tous les génies spipiens dont je ne suis pas.</p>Quickflip2015-03-24T07:59:49Zhttps://contrib.spip.net/Quickflip#comment4805362015-03-24T07:59:49Z<p>Bonjour,<br class="autobr">
pas de problème pour le modèle je fais un essai<br class="autobr">
merci</p>Quickflip2015-03-23T21:09:31Zhttps://contrib.spip.net/Quickflip#comment4805292015-03-23T21:09:31Z<p>Hello</p>
<p>Non, pas de balise pour l'instant car je ne sais pas encore faire... Peut-être y en aura-t-il une un jour<small class="fine d-inline"> </small>?</p>
<p>En attendant, comme il s'agit d'un modèle, tu peux l'insérer dans un squelette ainsi<br class="autobr">
<code class="spip_code spip_code_inline" dir="ltr">[(#MODELE{quickflip}{img1=XX})]</code></p>Quickflip2015-03-23T08:13:53Zhttps://contrib.spip.net/Quickflip#comment4804942015-03-23T08:13:53Z<p>Ce ne sont pas mes qualités de programmeur, mais si les réflexions, tests et autres aides peuvent apporter quelque chose, bien sur avec plaisir.</p>
<p>Je souhaitais savoir si on pouvait utiliser une balise de type :<br class="autobr"> <code class="spip_code spip_code_inline" dir="ltr"> [(#QUICKFLIP|img1=XX)]</code></p>
<p>Bravo quand même pour ce travail surtout si c'est beaucoup pour ton niveau, tu as encore plus de mérites.</p>Quickflip2015-03-20T19:53:06Zhttps://contrib.spip.net/Quickflip#comment4804302015-03-20T19:53:06Z<p>Ouh là ouh là on se calme<small class="fine d-inline"> </small>!<small class="fine d-inline"> </small>;-) ça n'a déjà pas été facile pour mes modestes compétences de pondre ce plugin pourtant assez simple. Quand tu dis que tu serais partant, c'est une proposition pour le rendre plus performant<small class="fine d-inline"> </small>?</p>
<p>Sinon, attention, Quickflip est indépendant d'Escal.</p>Quickflip2015-03-20T07:56:49Zhttps://contrib.spip.net/Quickflip#comment4804002015-03-20T07:56:49Z<p>Bonjour,</p>
<p>super effet et je me dis que je serais partant pour le mettre dans les squelettes :<br class="autobr">
page d'accueil, sur les articles à la une, au survol du logo ou de l'image choisie, le texte du Chapo.</p>
<p>Par avance, merci</p>