Gallery responsive - Version imprimable
+- Forum CMS Made Simple FR (https://forum.cmsmadesimple.fr)
+-- Forum : Général (https://forum.cmsmadesimple.fr/forum-3.html)
+--- Forum : Modules, Tags (https://forum.cmsmadesimple.fr/forum-14.html)
+--- Sujet : Gallery responsive (/thread-3416.html)
+- Forum CMS Made Simple FR (https://forum.cmsmadesimple.fr)
+-- Forum : Général (https://forum.cmsmadesimple.fr/forum-3.html)
+--- Forum : Modules, Tags (https://forum.cmsmadesimple.fr/forum-14.html)
+--- Sujet : Gallery responsive (/thread-3416.html)
Gallery responsive - jcpapa - 13/02/2015
Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.11.11
#~ Url du site : http://terroirs77.fr/cmsmadesimple/
#~ Hébergeur / Soft : OVH
#~ Informations Système :
#~ ----------------------------------------------
#~ Cms Version: 1.11.12
#~ Installed Modules:
#~ CMSMailer: 5.2.2
#~ CMSPrinting: 1.0.5
#~ FileManager: 1.4.5
#~ MenuManager: 1.8.6
#~ MicroTiny: 1.2.8
#~ ModuleManager: 1.5.8
#~ News: 2.14.4
#~ Search: 1.7.11
#~ ThemeManager: 1.1.8
#~ CGFavs: 1.0.2
#~ CGExtensions: 1.45
#~ ExtendedTools: 1.1.1
#~ CGSmartImage: 1.17.2
#~ FormBuilder: 0.8.1.1
#~ Gallery: 1.6.1
#~ CGSimpleSmarty: 1.7.4
#~ CGCalendar: 1.14.6
#~ FrontEndUsers: 1.26
#~ AireLibs: 1.3.2
#~ EventsManager: 1.2.7
#~ SelfRegistration: 1.8.3
#~ Captcha: 0.5.2
#~ EventsListing: 1.6.1
#~ CustomContent: 1.10
#~ Config Information:
#~ php_memory_limit:
#~ process_whole_template:
#~ max_upload_size: 64000000
#~ url_rewriting: none
#~ page_extension:
#~ query_var: page
#~ image_manipulation_prog: GD
#~ auto_alias_content: true
#~ locale: fr_FR.utf-8
#~ default_encoding: utf-8
#~ admin_encoding: utf-8
#~ set_names: true
#~ Php Information:
#~ phpversion: 5.4.37
#~ md5_function: On (Vrai)
#~ gd_version: 2
#~ tempnam_function: On (Vrai)
#~ magic_quotes_runtime: Off (Faux)
#~ E_STRICT: 0
#~ E_DEPRECATED: 0
#~ memory_limit: 512M
#~ max_execution_time: 300
#~ output_buffering: 4096
#~ safe_mode: Off (Faux)
#~ file_uploads: On (Vrai)
#~ post_max_size: 64M
#~ upload_max_filesize: 64M
#~ session_save_path: /tmp (0700)
#~ session_use_cookies: On (Vrai)
#~ xml_function: On (Vrai)
#~ xmlreader_class: On (Vrai)
#~ Server Information:
#~ Server Api: fpm-fcgi
#~ Server Db Type: MySQL (mysql)
#~ Server Db Version: 5.1.73
#~ Server Db Grants: Impossible de trouver un privilège "GRANT ALL". Cela peut signifier que vous pourriez avoir des problèmes pour installer ou retirer des modules, ou encore l 'ajout et la suppression d'éléments, y compris les pages.
#~ Server Time Diff: Aucune différence de date du système de fichiers trouvées
#~ ----------------------------------------------
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~
Bonjour à tous,
"
J'aimerais savoir s'il est possible d'envisager une galerie de "cartes/images/commentaires" responsive à la manière de cet exemple Bootstrap mais avec le Module Gallery CMSMS ...
Est-ce faisable ou vaut-il mieux mélanger Bootsrap dans le CMS ?...
Merci pour vos lumières à venir.
Bonne journée et bon Week-end.
Gallery responsive - jissey - 13/02/2015
Salut,
avec le module Gallery, tu peux intégrer n'importe qu'elle galerie d'images (HTML+SMARTY, CSS, JAVASCRIPT).
Dans le lien que tu donnes, ça n'est pas vraiment un galerie, tu peux utiliser le module News.
Ensuite, l'intégration de Bootstrap n'est pas nécessaire à mon sens, tu dois pouvoir faire la correspondance avec Foundation que tu utilises.
Gallery responsive - jcpapa - 17/02/2015
Bonjour,
Merci pour ta réponse, (je n'avais pas vu que tu avais répondu aussi vite)...
Je vais étudier cela avec les directions que tu me donnes.
Si je comprends bien, le module news pourrait me donner ce que je cherche !?
Chaque "carte" étant, j'imagine, le sommaire d'une news développée ?...
...
Merci
Gallery responsive - Jean le Chauve - 17/02/2015
Tu n'es pas obligé de te servir du sommaire, mais plutôt de créer des champs personnalisés.
Gallery responsive - jcpapa - 17/02/2015
Pendant que Jean Le Chauve intervient, je trouve de mon côté ceci dans des exemples de blocs qui fonctionnent avec Foundation : http://patterntap.com/code/product-card
C'est exactement ce que je cherche (mis à part la destination qui là est une boutique...).
Je viens d'essayer de l'intégrer mais évidemment, je me plante. J'ai commencé par créer un nouveau "contenu globale" pour l'insérer dans une page... mais c'est une très mauvaise piste.
J'ai d'un côté un code HTML :
Code :
[== XHTML ==]
<div class="row">
<div class="large-4 columns">
<div class="item-wrapper">
<div class="img-wrapper">
<a class="button expand add-to-cart">Add to Cart</a>
<a href="#"><img src="http://i.imgur.com/Mcw06Yt.png"></a>
</div>
<a href="#"><h3>Kickin with Kraken Tee</h3></a>
<h5>$19.99</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin posuere sem enim, accumsan convallis
risus semper.</p>
</div>
</div>
</div>D'un autre côté le CSS :
Code :
[== CSS ==]
.item-wrapper {
padding: 20px;
border: 2px solid #efefef;
border-radius: 7px;
margin-top: 40px;
}
.item-wrapper:hover .img-wrapper img {
-webkit-filter: grayscale(0);
}
.item-wrapper:hover .img-wrapper .add-to-cart {
bottom: 0;
}
.img-wrapper {
margin-bottom: 20px;
position: relative;
overflow: hidden;
}
.img-wrapper .add-to-cart {
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
background-color: #333;
padding: 16px 8px;
bottom: -50px;
position: absolute;
z-index: 2;
color: #fff;
margin: 0 auto;
border: none;
box-shadow: none;
}
.img-wrapper .add-to-cart:hover {
background-color: #008cba;
}
.img-wrapper img {
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
-webkit-filter: grayscale(1);
width: 100%;
}
h3 {
font-size: 22px;
}
h5 {
font-weight: bold;
}
p {
color: #888;
font-size: 13px;
margin-bottom: 0;
}Et même un Scss :
Code :
[== CSS ==]
$primary-color: #008cba;
.item-wrapper {
padding: 20px;
border: 2px solid #efefef;
border-radius: 7px;
margin-top: 40px;
&:hover {
.img-wrapper {
img { -webkit-filter: grayscale(0); }
.add-to-cart { bottom: 0; }
}
}
}
.img-wrapper {
margin-bottom: 20px;
position: relative;
overflow: hidden;
.add-to-cart {
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
background-color: #333;
padding: 16px 8px;
bottom: -50px;
position: absolute;
z-index: 2;
color: #fff;
margin: 0 auto;
border: none;
box-shadow: none;
&:hover { background-color: $primary-color; }
}
img {
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
-webkit-filter: grayscale(1);
width: 100%;
}
}
h3 { font-size: 22px; }
h5 { font-weight: bold; }
p {
color: #888;
font-size: 13px;
margin-bottom: 0;
}Bon... j'ai crée une feuille de style en plus : "product_card_style.css"
Mais je patauge largement lorsque je cherche à intégrer le HTML dans une de mes pages ou dans un gabarit...
J'imagine que pour vous c'est "risible"...
Autre chose, d'habitude je reçois les notifications de réponse au forum, par mail... mais sur ce post, je ne reçois rien !?!
Merci
Gallery responsive - Jean le Chauve - 17/02/2015
Tu mets ton {global_content name='celuiQueTuAsCréé'} dans le "contenu" de la page.
Tu ajoutes une feuilles de style dans l'administration : disposition->feuilles de style, puis tu l'attaches au gabarit utilisé pour ta page : disposition->gabarit (icône bleue à droite)
Gallery responsive - jcpapa - 17/02/2015
Oui, merci... j'ai fait cela, mais ça ne fonctionne qu'en partie.
Bien sûr, ma page affiche le contenu de {global_content name='product_card'} mais sans tenir compte du CSS attaché.
Bon, ça, j'imagine que ça peut évoluer. Mais je vois mal comment affecter par la suite des contenus différents à chaque "{global_content name='product_card'}"...
Je m'explique :
ce qui m'intéresse, c'est le côté visuel d'un affichage d'événement ou de parution à la manière de cartes posé sur la page comme dans cet exemple, ici : http://www.infoculture-reims.fr/index.php.
Puisque je suis sous le gabarit "theme // foundation-5.0.2", j'ai choisi de prendre les codes de cet exemple de "Foundation" : http://patterntap.com/code/product-card
Ainsi pour mon site associatif, je cherche à installer les événements et les parution de brochure de cette même manière.
Je pense qu'il faut intervenir sur le Gabarit lui-même, non !?
Avec le "contenu global", je ne pense pas avoir un outil "assez souple" ...
Qu'en penses-tu ?
Merci
Gallery responsive - Jean le Chauve - 17/02/2015
Citation :Bien sûr, ma page affiche le contenu de {global_content name='product_card'} mais sans tenir compte du CSS attaché.
Citation :Tu ajoutes une feuilles de style dans l'administration : disposition->feuilles de style, puis tu l'attaches au gabarit utilisé pour ta page : disposition->gabarit (icône bleue à droite)Le code css que tu nous as collé plus haut, c'est celui-là que tu colles dans cette nouvelle feuille de style (oublie le scss, ce n'est pas encore à ta portée).
Si c'est ce que tu as fait, c'est que d'autres propriétés css écrasent cette dernière.
Il y a des priorités dans le placement de tes différentes feuilles de style. Si cette css est appelée AVANT celles de foundation et qu'il y a des correspondances de sélecteurs, ils seront écrasés. L'utilisation de Firebug peut te le montrer très facilement (voir ici : http://www.cmsmadesimple.fr/blog/4/15/Les-outils-du-webmaster-Firebug#main).
Déplace l'appel des css foundation dans le gabarit de la page AVANT la balise {cms_stylesheet}.
De nouveau, cette question n'a aucun rapport avec cmsms, mais avec ton niveau de connaissances sur les css.
Gallery responsive - jcpapa - 17/02/2015
Merci pour cette réponse...
J'avais déjà fait tout cela !
J'ai trouvé ce qui clochait : la page concerné n'était pas attribué au bon gabarit... ça aurait pu durer longtemps !
ça fonctionne donc et c'est un début : http://terroirs77.fr/cmsmadesimple/index.php?page=editions
En revanche, mon questionnement est toujours le même, comme je le disais plus haut :
Citation :Je pense qu'il faut intervenir sur le Gabarit lui-même, non !?
Avec le "contenu global", je ne pense pas avoir un outil "assez souple" ...
Qu'en penses-tu ?
Pour avoir plusieurs "cartes-produit" ou "carte-événement" indépendant et à contenu variable... je ne peux pas introduire le code {global_content name='product_card'} à chaque fois... Je pense que mes limites sont bien ici !
Je pense qu'il faut certainement introduire d'autres codes dans ce contenu globale... mais quoi !?
Ou bien s'agit-il d'un autre garbarit à fabriquer ?...
Merci encore
Gallery responsive - Jean le Chauve - 17/02/2015
De nouveau tu as diverses possibilités : le module news (modification du gabarit sommaire), le module Listit2, les {content block} (comme dans la vidéo https://www.youtube.com/watch?v=OmBKRL9caYc&list=PLXalhHHve-2T3aitq0UmSSv16SI1PXPSZ&index=9) ou une galerie d'images.
Gallery responsive - jcpapa - 17/02/2015
Bon,
J'ai suivi quelques posts sur Listit2... je lai installé !
C'est une usine à Gaz, ce truc !
Je pense que c'est trop compliqué pour bibi... :/
En revanche, maintenant, je aperçois "un peu tard" qu'on ne peut pas l'effacer de son CMS !?
Est-ce que ça ne va pas me mettre le bazar, ce truc ?
Gallery responsive - jcpapa - 18/02/2015
Bonjour,
Pour faire suite à la réponse de Jean Le Chauve, à propos de la vidéo et des {content block}...
Peut-on envisager de transformer/fabriquer ses propres gabarits du module "News (articles)" et ainsi de demander un affichage en "cartes" dans une page bien définie... ?!
Je suppose que c'est oui ?!
Merci en tout cas pour cette vidéo qui m'a beaucoup éclairé !!!
Bravo.
Bonne journée.
Gallery responsive - Jean le Chauve - 18/02/2015
Oui, tous les gabarits sont modifiables. Tu n'as qu'à placer tes div aux bons endroits dans le gabarit sommaire et créer des champs personnalisés (définitions de champs). Tu peux ainsi créer un champs "fichier" pour l'image. Lis bien les commentaires {* *} situés dans les gabarits par défaut et essaye de comprendre le code pré-installé. Pour les champs que tu auras créés, ils se situeront dans :
Code :
[== Indéfini ==]
{if isset($entry->fields)}
{foreach from=$entry->fields item='field'}
<div class="NewsSummaryField">
{if $field->type == 'file'}
<img src="{$entry->file_location}/{$field->value}"/>
{else}
{$field->name}: {eval var=$field->value}
{/if}
</div>
{/foreach}
{/if}Gallery responsive - jcpapa - 18/02/2015
Merci pour ces bons conseils...
Je vais tenter de bosser la-dessus demain.
Bonne soirée
Bien cordialement.
Gallery responsive - jcpapa - 19/02/2015
Bonjour,
Voilà... je me suis servi du module Événement pour obtenir ces fameux affichage par carte !
J'ai les cartes réparties comme je le voulais... sauf que mes événements ne se dispatchent pas "par carte" mais "par lignes". Voire ici...
J'ai donc chaque événement répétés autant de fois par ligne.
Bon, évidemment, ça doit me crever les yeux...
J’ai essayé plein de manière toute la matinée mais je sèche !
Voici le code du Sommaire de base :
Code :
[== Indéfini ==]
{* Events summary default template *}
{* Events and details are stored in the $items array *}
{* What can you use in this template? Some examples:
{$entry->name} : event name
{$entry->description} : event description
{$entry->category} : the category object
{$entry->category->name} : category name
{$entry->category->description} : category description
{$entry->start_datetime} : event start datetime (i.e. {$entry->start_datetime|cms_date_format}) - Same with "end_datetime"
{$entry->capacity} : capacity of the event
{$entry->fields : an array of extra fields
If you have an extra field with the alias "place", use :
{$entry->fields.place->value}
NOTE : sometimes, the extrafields values are arrays, so use {$entry->fields.place|print_r} to see what is available
Use {$entry|print_r} to display all the infos available
*}
{if $items|@count}
{foreach from=$items item=entry}
{* Important, do not remove the line above: *}
{assign var='overquotanb' value=0}
<h3>{$entry->name}</h3>
{if isset($entry->category)}
<p>Catégorie : {$entry->category->name}</p>
{/if}
<p>De : {$entry->start_datetime|cms_date_format} à : {$entry->end_datetime|cms_date_format}</p>
<a href="{$entry->detailurl}">Détails de l'événement</a>
{if $entry->allow_registration}
<h5>Réservation</h5>
<p>Places actuellement réservées : {$entry->nb_regusers} / Capacité : {if $entry->capacity > 0}{$entry->capacity} / Places restantes: {math equation="x - y" x=$entry->capacity y=$entry->nb_regusers} {else}Unlimited{/if}</p>
{if isset($entry->registration_url)}
<p><a href="{$entry->registration_url}">Register</a></p>
{/if}
{EventsManager action='register' event_id=$entry->id inline=1 allow_notconnected=1}
{/if}
{*if !empty($entry->description)}
<h4>Description</h4>
<p>{$entry->description}</p>
{/if*}
{* Extra fields *}
{if isset($entry->fields)}
{foreach from=$entry->fields item='oneval' key='key'}
<h4>{$oneval->name}</h4>
<div>
{if $oneval->type eq 'image' and $oneval->value neq ''}
<img src="{$oneval->file_url}" style="max-width: 200px" />
{elseif $oneval->type eq 'checkboxes' and !empty($oneval->value)}
<ul>
{foreach from=$oneval->value item='onecheckbox'}
<li>{$onecheckbox}</li>
{/foreach}
</ul>
{elseif $oneval->value neq ''}
{$oneval->value}
{else}
<p>No value for {$oneval->name}</p>
{/if}
</div>
<br /><br />
{* Uncomment to display all the info for the current field : *}
{*
{$key} : {$oneval|print_r}<br /><br />
*}
{/foreach}
{/if}
{* <a href="{$entry->detailurl}">Détails sur cet événement...</a> *}
<hr>
{/foreach}
{else}
<p>
Aucun évènement</p>
{/if}Et voici le mien que j'ai aménagé... :
Code :
[== Indéfini ==]
{* Events summary default template *}
{* Events and details are stored in the $items array *}
{* What can you use in this template? Some examples:
{$entry->name} : event name
{$entry->description} : event description
{$entry->category} : the category object
{$entry->category->name} : category name
{$entry->category->description} : category description
{$entry->start_datetime} : event start datetime (i.e. {$entry->start_datetime|cms_date_format}) - Same with "end_datetime"
{$entry->capacity} : capacity of the event
{$entry->fields : an array of extra fields
If you have an extra field with the alias "place", use :
{$entry->fields.place->value}
NOTE : sometimes, the extrafields values are arrays, so use {$entry->fields.place|print_r} to see what is available
Use {$entry|print_r} to display all the infos available
*}
{if $items|@count}
{foreach from=$items item=entry}
{* Important, do not remove the line above: *}
{assign var='overquotanb' value=0}
{* début de la card-product *}
{* colonne 1 *}
<div class="large-4 columns small-6">
<div class="item-wrapper">
<div class="img-wrapper">
<a class="button expand add-to-cart" href="{$entry->detailurl}">Voir le détail</a>
<a href="{$entry->detailurl}"><img src="http://i.imgur.com/Mcw06Yt.png"alt="" /></a>
</div>
<h5>{$entry->name}</h5>
{if isset($entry->category)}
<p>{$entry->category->name}</p>
{/if}
<p>Du : {$entry->start_datetime|cms_date_format} au : {$entry->end_datetime|cms_date_format}</p>
{* <a href="{$entry->detailurl}">Détails de l'événement</a>
{if $entry->allow_registration}
<h5>Réservation</h5>
<p>Places actuellement réservées : {$entry->nb_regusers} / Capacité : {if $entry->capacity > 0}{$entry->capacity} / Places restantes: {math equation="x - y" x=$entry->capacity y=$entry->nb_regusers} {else}Unlimited{/if}</p>
{if isset($entry->registration_url)}
<p><a href="{$entry->registration_url}">Register</a></p>
{/if}
{EventsManager action='register' event_id=$entry->id inline=1 allow_notconnected=1}
{/if}
{* Extra fields *}
{if isset($entry->fields)}
{foreach from=$entry->fields item='oneval' key='key'}
<h6>{$oneval->name}</h6>
<div>
{if $oneval->type eq 'image' and $oneval->value neq ''}
<img src="{$oneval->file_url}" style="max-width: 200px" />
{elseif $oneval->type eq 'checkboxes' and !empty($oneval->value)}
<ul>
{foreach from=$oneval->value item='onecheckbox'}
<li>{$onecheckbox}</li>
{/foreach}
</ul>
{elseif $oneval->value neq ''}
{$oneval->value}
{else}
<p>No value for {$oneval->name}</p>
{/if}
</div>
{/foreach}*}
{/if}
</div>
</div>
{* colonne 2 *}
<div class="large-4 columns small-6">
<div class="item-wrapper">
<div class="img-wrapper">
<a class="button expand add-to-cart" href="{$entry->detailurl}">Voir le détail</a>
<a href="{$entry->detailurl}"><img src="http://i.imgur.com/Mcw06Yt.png"alt="" /></a>
</div>
<h5>{$entry->name}</h5>
{if isset($entry->category)}
<p>{$entry->category->name}</p>
{/if}
<p>De : {$entry->start_datetime|cms_date_format} à : {$entry->end_datetime|cms_date_format}</p>
{* <a href="{$entry->detailurl}">Détails de l'événement</a>
{if $entry->allow_registration}
<h5>Réservation</h5>
<p>Places actuellement réservées : {$entry->nb_regusers} / Capacité : {if $entry->capacity > 0}{$entry->capacity} / Places restantes: {math equation="x - y" x=$entry->capacity y=$entry->nb_regusers} {else}Unlimited{/if}</p>
{if isset($entry->registration_url)}
<p><a href="{$entry->registration_url}">Register</a></p>
{/if}
{EventsManager action='register' event_id=$entry->id inline=1 allow_notconnected=1}
{/if}
{*if !empty($entry->description)}
<h4>Description</h4>
<p>{$entry->description}</p>
{/if*}
{* Extra fields *}
{if isset($entry->fields)}
{foreach from=$entry->fields item='oneval' key='key'}
<h4>{$oneval->name}</h4>
<div>
{if $oneval->type eq 'image' and $oneval->value neq ''}
<img src="{$oneval->file_url}" style="max-width: 200px" />
{elseif $oneval->type eq 'checkboxes' and !empty($oneval->value)}
<ul>
{foreach from=$oneval->value item='onecheckbox'}
<li>{$onecheckbox}</li>
{/foreach}
</ul>
{elseif $oneval->value neq ''}
{$oneval->value}
{else}
<p>No value for {$oneval->name}</p>
{/if}
</div>
<br /><br /> *}
{* Uncomment to display all the info for the current field : *}
{/foreach}
{/if}
</div>
</div>
{* colonne 3 *}
<div class="large-4 columns small-6">
<div class="item-wrapper">
<div class="img-wrapper">
<a class="button expand add-to-cart" href="{$entry->detailurl}">Voir le détail</a>
<a href="{$entry->detailurl}"><img src="http://i.imgur.com/Mcw06Yt.png"alt="" /></a>
</div>
<h5>{$entry->name}</h5>
{if isset($entry->category)}
<p>{$entry->category->name}</p>
{/if}
<p>De : {$entry->start_datetime|cms_date_format} à : {$entry->end_datetime|cms_date_format}</p>
{* <a href="{$entry->detailurl}">Détails de l'événement</a>
{if $entry->allow_registration}
<h5>Réservation</h5>
<p>Places actuellement réservées : {$entry->nb_regusers} / Capacité : {if $entry->capacity > 0}{$entry->capacity} / Places restantes: {math equation="x - y" x=$entry->capacity y=$entry->nb_regusers} {else}Unlimited{/if}</p>
{if isset($entry->registration_url)}
<p><a href="{$entry->registration_url}">Register</a></p>
{/if}
{EventsManager action='register' event_id=$entry->id inline=1 allow_notconnected=1}
{/if}
{* Extra fields *}
{if isset($entry->fields)}
{foreach from=$entry->fields item='oneval' key='key'}
<h4>{$oneval->name}</h4>
<div>
{if $oneval->type eq 'image' and $oneval->value neq ''}
<img src="{$oneval->file_url}" style="max-width: 200px" />
{elseif $oneval->type eq 'checkboxes' and !empty($oneval->value)}
<ul>
{foreach from=$oneval->value item='onecheckbox'}
<li>{$onecheckbox}</li>
{/foreach}
</ul>
{elseif $oneval->value neq ''}
{$oneval->value}
{else}
<p>No value for {$oneval->name}</p>
{/if}
</div>
<br /><br /> *}
{/foreach}
{/if}
</div>
</div>
{/foreach}
<hr>
{else}
<p>
Aucun évènement</p>
{/if}Qu'est-ce qui cloche, docteur ?
Bon, le look est affreux... mais je m'attaquerai au css plus tard ; quand cela fonctionnera.
Merci
Gallery responsive - jcpapa - 19/02/2015
OUF !!!
Voilà, j'ai trouvé mon erreur... du moins en partie, car il me reste du travail !
Mais bon, voici mon code de Gabarit de Sommaire que j'ai fini par aménager :
Code :
[== Indéfini ==]
{* Events summary default template *}
{* Events and details are stored in the $items array *}
{* What can you use in this template? Some examples:
{$entry->name} : event name
{$entry->description} : event description
{$entry->category} : the category object
{$entry->category->name} : category name
{$entry->category->description} : category description
{$entry->start_datetime} : event start datetime (i.e. {$entry->start_datetime|cms_date_format}) - Same
with "end_datetime"
{$entry->capacity} : capacity of the event
{$entry->fields : an array of extra fields
If you have an extra field with the alias "place", use :
{$entry->fields.place->value}
NOTE : sometimes, the extrafields values are arrays, so use {$entry->fields.place|print_r} to see what
is available
Use {$entry|print_r} to display all the infos available
*}
<div class="row">
{if $items|@count}
{* Important, do not remove the line above: *}
{assign var='overquotanb' value=0}
{* début de la card-product *}
{* colonne 1 *}
{foreach from=$items item=entry}
<div class="large-4 columns small-6">
<div class="item-wrapper">
<div class="img-wrapper">
<a class="button expand add-to-cart" href="{$entry->detailurl}">Voir le détail</a>
<a href="{$entry->detailurl}"><img src="http://i.imgur.com/Mcw06Yt.png"alt="" /></a>
</div>
<h5>{$entry->name}</h5>
{if isset($entry->category)}
<p>{$entry->category->name}</p>
{/if}
<p>Du : {$entry->start_datetime|cms_date_format} au : {$entry->end_datetime|cms_date_format}</p>
{* <a href="{$entry->detailurl}">Détails de l'événement</a>
{if $entry->allow_registration}
<h5>Réservation</h5>
<p>Places actuellement réservées : {$entry->nb_regusers} / Capacité : {if $entry->capacity > 0}
{$entry->capacity} / Places restantes: {math equation="x - y" x=$entry->capacity y=$entry->nb_regusers} {else}Unlimited
{/if}</p>
{if isset($entry->registration_url)}
<p><a href="{$entry->registration_url}">Register</a></p>
{/if}
{EventsManager action='register' event_id=$entry->id inline=1 allow_notconnected=1}
{/if}
{* Extra fields *}
{if isset($entry->fields)}
{foreach from=$entry->fields item='oneval' key='key'}
<h6>{$oneval->name}</h6>
<div>
{if $oneval->type eq 'image' and $oneval->value neq ''}
<img src="{$oneval->file_url}" style="max-width: 200px" />
{elseif $oneval->type eq 'checkboxes' and !empty($oneval->value)}
<ul>
{foreach from=$oneval->value item='onecheckbox'}
<li>{$onecheckbox}</li>
{/foreach}
</ul>
{elseif $oneval->value neq ''}
{$oneval->value}
{else}
<p>No value for {$oneval->name}</p>
{/if}
</div>
{/foreach}*}
{/if}
</div>
</div>
{/foreach}
<hr>
{else}
<p>
Aucun évènement</p>
{/if}
</div>Bien sûr, il me reste à peauffiner le look avec le css attaché au gabarit !
J'ai un petit souci : auparavant, on pouvait réserver sa place directement sur la liste du sommaire via un champ attaché à chaque événement. J'ai supprimé cette possibilité car trop "lourde" à mon goût sur mes "cartes".
Je pensais reprendre une partie de code de l'ancien gabarit (sample) pour le loger dans la page du détail de chaque événement...
Est-ce que ce sera aussi simple que cela en a l'air ?!?
Merci