05/02/2013, 16:15:12
Tu dois commencer par ajouter des "définition de champs" et les rendre publiques.
Les données provenant de ces champs seront alors utilisables dans tes gabarits d'article.
Tu pourras les appeler de cette manière dans le gabarit de détail (ex champs image -> fichier):Dans cet exemple, l'éditeur voit un champs "image" et un bouton parcourir qui lui permet d'uploader une image de son bureau vers le serveur dans le dossier uploads/news/id.
Dans le gabarit, {$entry->fieldsbyname.image->value} contient le nom du fichier image uploadé.
CGSmartImage est utilisé pour permettre le redimentionnement automatique de l'image grâce à son système d'alias.
Une classe css zoom est ajoutée pour permettre l'affichage dans une fancybox grâce à un js
Les données provenant de ces champs seront alors utilisables dans tes gabarits d'article.
Tu pourras les appeler de cette manière dans le gabarit de détail (ex champs image -> fichier):
Code :
{if $entry->fieldsbyname.image->value neq ''}
{capture assign='photoarticle'}uploads/news/id{$entry->id}/{$entry->fieldsbyname.image->value}{/capture}
<a href="{$photoarticle}" title="{$entry->title|cms_escape:htmlall}" class="alignleft zoom">{CGSmartImage alias='news' src=$photoarticle alt=$entry->title class='bordure'}<p class="textalignleft">Cliquez pour zoomer</p></a>
Dans le gabarit, {$entry->fieldsbyname.image->value} contient le nom du fichier image uploadé.
CGSmartImage est utilisé pour permettre le redimentionnement automatique de l'image grâce à son système d'alias.
Une classe css zoom est ajoutée pour permettre l'affichage dans une fancybox grâce à un js
Code :
[== Indéfini ==]
// fancybox
$(document).ready(function(){
$(".various").fancybox({
maxWidth : 800,
maxHeight : 600,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'fade',
closeEffect : 'fade'
});
$("a.zoom").fancybox({
nextEffect: 'fade',
prevEffect: 'fade'
});
});